Merge branch 'develop'

Author: tobihagemann

assets/css/custom.css

@@ -81,6 +81,34 @@
   @apply cursor-not-allowed no-underline text-gray-300;
 }
 
+.text-link {
+  @apply text-primary no-underline hover:underline;
+}
+
+.prose-article {
+  @apply prose prose-sm md:prose max-w-none md:max-w-none;
+}
+
+.font-h1 {
+  @apply font-headline font-medium text-3xl md:text-4xl leading-tight;
+}
+
+.font-h2 {
+  @apply font-headline font-medium text-xl md:text-2xl leading-snug;
+}
+
+.font-h3 {
+  @apply font-headline text-lg md:text-xl leading-relaxed;
+}
+
+.font-lead {
+  @apply text-lg md:text-xl leading-relaxed text-gray-700;
+}
+
+.font-p {
+  @apply text-sm md:text-base leading-relaxed text-gray-700;
+}
+
 .white-box {
   @apply rounded-sm shadow-sm bg-white;
 }

content/_index.de.html

@@ -3,7 +3,7 @@
 ---
 
 <section class="container py-12">
-  <article class="prose prose-sm md:prose max-w-none md:max-w-none">
+  <article class="prose-article">
     <div class="flex flex-wrap">
       <div class="md:w-2/3">
         <h2>Nimm die Sicherung deiner Daten selbst in die Hand</h2>
@@ -31,7 +31,7 @@ <h2>Nimm die Sicherung deiner Daten selbst in die Hand</h2>
 </section>
 
 <section class="container py-12">
-  <article class="prose prose-sm md:prose max-w-none md:max-w-none">
+  <article class="prose-article">
     <div class="flex flex-wrap md:flex-row-reverse">
       <div class="md:w-2/3">
         <h2>Wie schützt Cryptomator deine Daten?</h2>
@@ -66,7 +66,7 @@ <h2>Wie schützt Cryptomator deine Daten?</h2>
 </section>
 
 <section class="container text-center py-12 md:py-16 lg:py-20">
-  <article class="prose prose-sm md:prose max-w-none md:max-w-none">
+  <article class="prose-article">
     <h2>Optimaler Schutz dank neuesten Technologie-Standards</h2>
     <figure class="mx-auto md:w-5/6 lg:w-2/3">
       <img data-src="/de/img/home/split-screenshots.avif" class="lazyload aspect-1664/975 w-full" alt="Gegenüberstellung von verschlüsselten und entschlüsselten Daten in einem Cryptomator-Tresor"/>
@@ -76,7 +76,7 @@ <h2>Optimaler Schutz dank neuesten Technologie-Standards</h2>
 </section>
 
 <section class="container py-12 md:py-16 lg:py-20">
-  <article class="prose prose-sm md:prose max-w-none md:max-w-none">
+  <article class="prose-article">
     <h2 class="text-center">Warum ist Cryptomator sicher und vertrauenswürdig?</h2>
     <div class="flex flex-wrap md:flex-row-reverse">
       <div class="md:w-2/3">

content/_index.en.html

@@ -3,7 +3,7 @@
 ---
 
 <section class="container py-12">
-  <article class="prose prose-sm md:prose max-w-none md:max-w-none">
+  <article class="prose-article">
     <div class="flex flex-wrap">
       <div class="md:w-2/3">
         <h2>Take the security of your data into your own hands</h2>
@@ -31,7 +31,7 @@ <h2>Take the security of your data into your own hands</h2>
 </section>
 
 <section class="container py-12">
-  <article class="prose prose-sm md:prose max-w-none md:max-w-none">
+  <article class="prose-article">
     <div class="flex flex-wrap md:flex-row-reverse">
       <div class="md:w-2/3">
         <h2>How does Cryptomator protect your data?</h2>
@@ -66,7 +66,7 @@ <h2>How does Cryptomator protect your data?</h2>
 </section>
 
 <section class="container text-center py-12 md:py-16 lg:py-20">
-  <article class="prose prose-sm md:prose max-w-none md:max-w-none">
+  <article class="prose-article">
     <h2>Optimal protection thanks to the latest technology standards</h2>
     <figure class="mx-auto md:w-5/6 lg:w-2/3">
       <img data-src="/img/home/split-screenshots.avif" class="lazyload aspect-1664/975 w-full" alt="Comparison of encrypted and decrypted data in a Cryptomator vault"/>
@@ -76,7 +76,7 @@ <h2>Optimal protection thanks to the latest technology standards</h2>
 </section>
 
 <section class="container py-12 md:py-16 lg:py-20">
-  <article class="prose prose-sm md:prose max-w-none md:max-w-none">
+  <article class="prose-article">
     <h2 class="text-center">Why is Cryptomator secure and trustworthy?</h2>
     <div class="flex flex-wrap md:flex-row-reverse">
       <div class="md:w-2/3">

content/boxcryptor-alternative.de.md

@@ -9,7 +9,7 @@
 ---
 
 <div class="w-full md:w-1/2 lg:w-1/3 py-4 text-center">
-  <header class="prose prose-sm md:prose max-w-none md:max-w-none mb-6">
+  <header class="prose-article mb-6">
     <h2>Cryptomator für Android</h2>
   </header>
 

content/boxcryptor-alternative.en.md

@@ -9,7 +9,7 @@
 ---
 
 <div class="w-full md:w-1/2 lg:w-1/3 py-4 text-center">
-  <header class="prose prose-sm md:prose max-w-none md:max-w-none mb-6">
+  <header class="prose-article mb-6">
     <h2>Cryptomator for Android</h2>
   </header>
 

content/downloads/android.de.html

@@ -9,7 +9,7 @@
 ---
 
 <div class="w-full md:w-1/2 lg:w-1/3 py-4 text-center">
-  <header class="prose prose-sm md:prose max-w-none md:max-w-none mb-6">
+  <header class="prose-article mb-6">
     <h2>Cryptomator für iOS</h2>
   </header>
 

content/downloads/android.en.html

@@ -9,7 +9,7 @@
 ---
 
 <div class="w-full md:w-1/2 lg:w-1/3 py-4 text-center">
-  <header class="prose prose-sm md:prose max-w-none md:max-w-none mb-6">
+  <header class="prose-article mb-6">
     <h2>Cryptomator for iOS</h2>
   </header>
 

content/downloads/ios.de.html

@@ -16,7 +16,7 @@
   <meta itemprop="applicationSubCategory" content="Encryption"/>
   <meta itemprop="image" content="{{< absurl "/img/logo.png" >}}"/>
   <meta itemprop="operatingSystem" content="Mac"/>
-  <header class="prose prose-sm md:prose max-w-none md:max-w-none mb-6">
+  <header class="prose-article mb-6">
     <h2>Cryptomator für Linux</h2>
     <p>Version {{< siteparam releases.appimage.version >}} • <a href="https://github.com/cryptomator/cryptomator/releases/tag/{{< siteparam releases.appimage.version >}}" target="_blank" rel="noopener">Änderungen</a></p>
   </header>