Merge branch 'develop'

Author: tobihagemann

assets/js/download.js

@@ -1,13 +1,15 @@
-function guessDownloadTab() {
-  if (navigator.appVersion.indexOf('iPhone') !== -1 || navigator.appVersion.indexOf('iPad') !== -1 || navigator.appVersion.indexOf('iPod') !== -1) {
-    return 'ios';
+function guessDownloadTab(locationHash) {
+  if (locationHash === '#win' || locationHash === '#mac' || locationHash === '#linux' || locationHash === '#android' || locationHash === '#ios') {
+    return locationHash;
+  } else if (navigator.appVersion.indexOf('iPhone') !== -1 || navigator.appVersion.indexOf('iPad') !== -1 || navigator.appVersion.indexOf('iPod') !== -1) {
+    return '#ios';
   } else if (navigator.appVersion.indexOf('Android') !== -1) {
-    return 'android';
+    return '#android';
   } else if (navigator.appVersion.indexOf('Linux') !== -1 || navigator.appVersion.indexOf('X11') !== -1) {
-    return 'linux';
+    return '#linux';
   } else if (navigator.appVersion.indexOf('Mac') !== -1) {
-    return 'mac';
+    return '#mac';
   } else {
-    return 'win';
+    return '#win';
   }
 }

layouts/downloads/list.html

@@ -2,9 +2,9 @@
   <link rel="dns-prefetch" href="https://github.com">
 {{ end }}
 {{ define "main" }}
-  <div x-data="{ tab: guessDownloadTab() }" x-cloak>
+  <div x-data="{ tab: guessDownloadTab(location.hash) }" x-init="location.hash = tab || '#win'" @hashchange.window="tab = guessDownloadTab(location.hash)">
     {{ range .Pages }}
-      <section x-show="tab === '{{ .Slug }}'" class="container flex flex-wrap items-center py-12 min-h-[66vh]">
+      <section x-show="tab === '#{{ .Slug }}'" class="container flex flex-wrap items-center py-12 min-h-[66vh]">
         <figure class="w-full md:w-1/2 lg:w-auto mx-auto pr-0 md:pr-8">
           <img class="lazyload" data-src="{{ .Params.Screenshot }}" data-srcset="{{ .Params.Screenshot }} 1x, {{ .Params.Screenshot2x }} 2x"/>
         </figure>
@@ -16,7 +16,7 @@
       <div class="container flex flex-wrap justify-center text-white p-2">
         {{ range $index, $element := .Pages }}
           <div class="w-1/3 md:w-1/5 p-2">
-            <button :class="{ 'text-primary hover:text-primary focus:text-primary border-primary hover:border-primary focus:border-primary': tab === '{{ .Slug }}' }" @click="tab = '{{ .Slug }}'" class="btn btn-outline-gray-500 px-2 w-full whitespace-nowrap">{{ safeHTML .Params.ButtonLabel }}</button>
+            <button :class="{ 'text-gray-800 border-gray-400 bg-gray-400': tab === '#{{ .Slug }}' }" @click="location.hash = '#{{ .Slug }}'" class="btn btn-outline-gray-500 px-2 w-full whitespace-nowrap">{{ safeHTML .Params.ButtonLabel }}</button>
           </div>
         {{ end }}
       </div>

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}" @hashchange.window="planOption = location.hash" class="py-12">
+    <div x-data="{planOption: location.hash}" x-init="location.hash = planOption || '#for-individuals'" @hashchange.window="planOption = location.hash" class="py-12">
       <header class="text-center">
         <h2 class="text-center font-h2 mb-4">
           {{ i18n "pricing_title" . }}
@@ -95,7 +95,7 @@ <h2 class="text-center font-h2 mb-4">
               <p class="text-sm md:text-base text-gray-500 mb-4">
                 {{ i18n "pricing_android_price_description" . }}
               </p>
-              <a href="{{ .Site.LanguagePrefix }}/downloads/" role="button" class="btn btn-primary w-full" data-umami-event="pricing-android-cta">
+              <a href="{{ .Site.LanguagePrefix }}/downloads/#android" role="button" class="btn btn-primary w-full" data-umami-event="pricing-android-cta">
                 {{ i18n "pricing_android_cta" . }}
               </a>
             </div>
@@ -151,7 +151,7 @@ <h2 class="text-center font-h2 mb-4">
                   </p>
                 </div>
               </div>
-              <a href="{{ .Site.LanguagePrefix }}/downloads/" role="button" class="btn btn-primary w-full" data-umami-event="pricing-ios-cta">
+              <a href="{{ .Site.LanguagePrefix }}/downloads/#ios" role="button" class="btn btn-primary w-full" data-umami-event="pricing-ios-cta">
                 {{ i18n "pricing_ios_cta" . }}
               </a>
             </div>