From a6b7cd08a9be7a7de1e8fbc45b202b6d6b8c4139 Mon Sep 17 00:00:00 2001
From: hendr-ik <hello@niefeld.com>
Date: Mon, 13 Nov 2023 20:57:20 +0100
Subject: [PATCH] splash screen fix (#6) (#7)

Reviewed-on: https://git.offen.dev/offen.software/website/pulls/6
Reviewed-on: https://git.offen.dev/offen.software/website/pulls/7
---
 website/theme/static/css/styles.css |  8 +++++++-
 website/theme/templates/index.html  | 32 ++++++++++++++---------------
 2 files changed, 23 insertions(+), 17 deletions(-)

diff --git a/website/theme/static/css/styles.css b/website/theme/static/css/styles.css
index 90f2a5c..ebefbc4 100644
--- a/website/theme/static/css/styles.css
+++ b/website/theme/static/css/styles.css
@@ -38,7 +38,7 @@ COLORS
 LAYOUT
 ----------------------------------------------------*/
 .splashContent {
-  min-height: 86vh;
+  min-height: calc(100vh -190px);
 }
 .splashCta {
   position: -webkit-sticky;
@@ -107,6 +107,12 @@ IMAGES
     object-fit: none;
   }
 }
+@media only screen and (max-height: 650px) {
+  .imageCropSplash {
+    height: 192px;
+    object-fit: none;
+  }
+}
 .imageCrop {
   object-fit: none;
 }
diff --git a/website/theme/templates/index.html b/website/theme/templates/index.html
index 19f79d8..bf57a8e 100644
--- a/website/theme/templates/index.html
+++ b/website/theme/templates/index.html
@@ -5,26 +5,26 @@
 
 <div class="splashContent">
 
-    <div class="w-100 bgColorOrange">
-      <div class="mw7 center">
-        <img src="/theme/images/gfx-index.svg" alt="pattern" width="768px" height="448px" class="db imageCropSplash">
-      </div>
+  <div class="w-100 bgColorOrange">
+    <div class="mw7 center">
+      <img src="/theme/images/gfx-index.svg" alt="pattern" width="768px" height="448px" class="db imageCropSplash">
     </div>
-
-    <div class="mw7 center paddingSplash mt4">
-      <h2 class="f4 f2-ns ma0">
-        <span class="fw4">We </span><span class="fw7">think up, create and ship </span><span class="fw4">software for organisations and individuals who embrace </span><span class="fw7">societal change.</span>
-      </h2>
-    </div>
-
-</div>
-
-<div class="splashCta bgColorWine">
-  <div class="flex justify-center pb5">
-    <a class="link dim br1 f5 fw7 ttu tc trackedExtraWide h3 w5 buttonPadding colorWhite bgColorOrange" href="#we" rel="noopener">Learn more</a>
   </div>
+
+  <div class="mw7 center paddingSplash mt4">
+    <h2 class="f4 f2-ns ma0">
+      <span class="fw4">We </span><span class="fw7">think up, create and ship </span><span class="fw4">software for organisations and individuals who embrace </span><span class="fw7">societal change.</span>
+    </h2>
+  </div>
+
 </div>
 
+  <div class="splashCta bgColorWine">
+    <div class="flex justify-center pb5">
+      <a class="link dim br1 f5 fw7 ttu tc trackedExtraWide h3 w5 buttonPadding colorWhite bgColorOrange" href="#we" rel="noopener">Learn more</a>
+    </div>
+  </div>
+
 <!-- FOLD 1 -->
 
 <div class="w-100 colorWine bgColorOrange">