Merge branch 'develop'

Author: tobihagemann

i18n/de.yaml

@@ -445,6 +445,8 @@
 
 - id: hub_deployment_title
   translation: "Bereit, mit Cryptomator Hub zu starten?"
+- id: hub_deployment_recommended
+  translation: "Empfohlen"
 - id: hub_deployment_managed_subtitle
   translation: "Von Skymatic gehostet und gewartet"
 - id: hub_deployment_managed_benefit_1
@@ -917,7 +919,7 @@
 - id: pricing_hub_managed_title
   translation: "Managed"
 - id: pricing_hub_managed_cta
-  translation: "Jetzt anmelden"
+  translation: "Kostenlose 30-Tage-Testversion starten"
 
 - id: pricing_hub_community_title
   translation: "Community"
@@ -940,8 +942,6 @@
   translation: "Standard"
 - id: pricing_hub_standard_price_description
   translation: "pro Sitz, pro Monat"
-- id: pricing_hub_standard_trial
-  translation: "30 Tage kostenlos"
 - id: pricing_hub_standard_benefit_1
   translation: "Alles in Community"
 - id: pricing_hub_standard_benefit_2

i18n/en.yaml

@@ -445,6 +445,8 @@
 
 - id: hub_deployment_title
   translation: "Ready to Get Started with Cryptomator Hub?"
+- id: hub_deployment_recommended
+  translation: "Recommended"
 - id: hub_deployment_managed_subtitle
   translation: "Hosted and maintained by Skymatic"
 - id: hub_deployment_managed_benefit_1
@@ -917,7 +919,7 @@
 - id: pricing_hub_managed_title
   translation: "Managed"
 - id: pricing_hub_managed_cta
-  translation: "Sign Up Now"
+  translation: "Start Free 30-Day Trial"
 
 - id: pricing_hub_community_title
   translation: "Community"
@@ -940,8 +942,6 @@
   translation: "Standard"
 - id: pricing_hub_standard_price_description
   translation: "per seat, per month"
-- id: pricing_hub_standard_trial
-  translation: "Free 30-Day Trial"
 - id: pricing_hub_standard_benefit_1
   translation: "Everything in Community"
 - id: pricing_hub_standard_benefit_2

layouts/for-teams/single.html

@@ -172,17 +172,14 @@ <h2 id="pricing-plans" class="font-h2 mb-4">{{ i18n "hub_pricing_title" . }}</h2
     <h2 id="deployment" class="text-center font-h2 mb-4">{{ i18n "hub_deployment_title" . }}</h2>
 
     <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-      <div class="flex flex-col white-box">
+      <div class="flex flex-col white-box ring-2 ring-secondary">
         <div class="flex justify-between items-center p-4 border-b border-primary">
-          <h3>
-            <div class="flex items-center">
-              <img src="/img/logo.svg" class="hidden md:block h-8 mr-2 aspect-1110/942" alt="Logo"/>
-              <span class="font-headline font-bold text-primary pb-px">CRYPTOMATOR HUB</span>
-            </div>
+          <h3 class="font-h3">
+            <i class="fa-solid fa-cloud text-primary"></i> {{ i18n "pricing_hub_managed_title" . }}
           </h3>
-          <div class="inline-flex items-center gap-x-1.5 px-4 py-1 rounded-full text-xs lg:text-sm font-medium tracking-wide uppercase bg-primary-l2 text-dark">
-            <i class="fa-solid fa-cloud"></i>
-            {{ i18n "pricing_hub_managed_title" . }}
+          <div class="inline-flex items-center gap-x-1.5 px-4 py-1 rounded-full text-xs lg:text-sm font-medium tracking-wide uppercase bg-secondary text-white">
+            <i class="fa-solid fa-star"></i>
+            {{ i18n "hub_deployment_recommended" . }}
           </div>
         </div>
         <div class="flex flex-col justify-between h-full gap-8 px-4 py-8">
@@ -212,17 +209,10 @@ <h4 class="font-medium lg:text-lg leading-relaxed">
       </div>
 
       <div class="flex flex-col white-box">
-        <div class="flex justify-between items-center p-4 border-b border-primary">
-          <h3>
-            <div class="flex items-center">
-              <img src="/img/logo.svg" class="hidden md:block h-8 mr-2 aspect-1110/942" alt="Logo"/>
-              <span class="font-headline font-bold text-primary pb-px">CRYPTOMATOR HUB</span>
-            </div>
+        <div class="p-4 border-b border-primary">
+          <h3 class="font-h3">
+            <i class="fa-solid fa-server text-primary"></i> {{ i18n "pricing_hub_self_hosted_title" . }}
           </h3>
-          <div class="inline-flex items-center gap-x-1.5 px-4 py-1 rounded-full text-xs lg:text-sm font-medium tracking-wide uppercase bg-primary-l2 text-dark">
-            <i class="fa-solid fa-server"></i>
-            {{ i18n "pricing_hub_self_hosted_title" . }}
-          </div>
         </div>
         <div class="flex flex-col justify-between h-full gap-8 px-4 py-8">
           <div class="flex flex-col gap-4">

layouts/pricing/single.html

@@ -5,7 +5,7 @@ <h1 class="font-h1 mb-8">{{ .Title }}</h1>
       <p class="lead">{{ .Description }}</p>
     </header>
 
-    <div x-data="{planOption: location.hash}" x-init="location.hash = planOption || '#for-individuals'" @hashchange.window="planOption = location.hash" class="py-12">
+    <div x-data="{planOption: location.hash}" x-init="location.hash = planOption || '#for-teams'" @hashchange.window="planOption = location.hash" class="py-12">
       <header class="text-center">
         <h2 class="text-center font-h2 mb-4">
           {{ i18n "pricing_title" . }}
@@ -262,15 +262,15 @@ <h3 class="inline-flex px-4 py-1 rounded-full text-xs lg:text-sm font-medium tra
               </ul>
             </div>
           </div>
-          <div x-data="{infrastructure: 'managed', data: {selfHostedMonthlyPrice: null, managedMonthlyPrice: null}}" x-init="new HubPricing(data).loadPrice()" class="white-box">
+          <div x-data="{infrastructure: 'managed', data: {selfHostedMonthlyPrice: null, managedMonthlyPrice: null}}" x-init="new HubPricing(data).loadPrice()" class="white-box" :class="infrastructure === 'managed' && 'ring-2 ring-secondary'">
             <div class="p-4 border-b border-primary">
               <div class="flex gap-2 mb-8">
                 <h3 class="inline-flex px-4 py-1 rounded-full text-xs lg:text-sm font-medium tracking-wide uppercase bg-primary-l2 text-dark">
                   {{ i18n "pricing_hub_standard_title" . }}
                 </h3>
-                <p class="inline-flex items-center gap-x-1.5 px-4 py-1 rounded-full text-xs lg:text-sm font-medium tracking-wide uppercase bg-gray-300 text-gray-700">
-                  <i class="fa-solid fa-calendar-star"></i>
-                  {{ i18n "pricing_hub_standard_trial" . }}
+                <p x-show="infrastructure === 'managed'" class="inline-flex items-center gap-x-1.5 px-4 py-1 rounded-full text-xs lg:text-sm font-medium tracking-wide uppercase bg-secondary text-white">
+                  <i class="fa-solid fa-star"></i>
+                  {{ i18n "hub_deployment_recommended" . }}
                 </p>
               </div>
               <div class="flex items-center gap-2">