From 4e8d9bb8a09b3559c53fd86ce5827f667f88b883 Mon Sep 17 00:00:00 2001
From: Ida Marie Andreassen <43541032+idamand@users.noreply.github.com>
Date: Fri, 13 Dec 2024 12:13:59 +0100
Subject: [PATCH] Fix padding on homepage and customer page and small fixes
 (#1052)

---
 .../customerCases/customerCase/customerCase.module.css    | 8 ++++----
 .../customerCase/sections/results/ResultsBlock.tsx        | 2 +-
 .../sections/contact-box/contact-box.module.css           | 1 -
 .../sections/customerCasesEntry/CustomerCasesEntry.tsx    | 4 ++--
 .../customerCasesEntry/customerCasesEntry.module.css      | 4 ++++
 src/components/sections/generosity/generosity.module.css  | 3 ++-
 src/components/sections/hero/hero.module.css              | 6 +++---
 src/components/sections/learning/learning.module.css      | 3 ++-
 src/components/sections/openness/openness.module.css      | 3 ++-
 9 files changed, 20 insertions(+), 14 deletions(-)

diff --git a/src/components/customerCases/customerCase/customerCase.module.css b/src/components/customerCases/customerCase/customerCase.module.css
index 75f2458ea..6dead2ab1 100644
--- a/src/components/customerCases/customerCase/customerCase.module.css
+++ b/src/components/customerCases/customerCase/customerCase.module.css
@@ -1,12 +1,12 @@
 .wrapper {
   display: flex;
   flex-direction: column;
-  margin: 4rem 0rem;
+  margin: 5rem 0rem;
   align-items: center;
   justify-content: center;
 
-  @media (max-width: 1024px) {
-    margin: 2rem 0rem;
+  @media (max-width: 834px) {
+    margin: 3rem 0rem;
   }
 }
 
@@ -68,5 +68,5 @@
 .sectionsWrapper {
   display: flex;
   flex-direction: column;
-  gap: 4.5rem;
+  gap: 6rem;
 }
diff --git a/src/components/customerCases/customerCase/sections/results/ResultsBlock.tsx b/src/components/customerCases/customerCase/sections/results/ResultsBlock.tsx
index 86376513f..2a6fd6d84 100644
--- a/src/components/customerCases/customerCase/sections/results/ResultsBlock.tsx
+++ b/src/components/customerCases/customerCase/sections/results/ResultsBlock.tsx
@@ -38,7 +38,7 @@ function StackedHighlights({ section, blockColor }: ResultsBlockProps) {
           {section.quote?.map((quote) => (
             <div className={styles.highlightCard} key={quote._key}>
               <div className={styles.innerContent}>
-                <Text type="h2">{quote.quoteText}</Text>
+                <Text type="h3">{quote.quoteText}</Text>
                 <p className={styles.subtitle}>{quote.quoteAuthor}</p>
               </div>
             </div>
diff --git a/src/components/sections/contact-box/contact-box.module.css b/src/components/sections/contact-box/contact-box.module.css
index 849380fa2..276f8e179 100644
--- a/src/components/sections/contact-box/contact-box.module.css
+++ b/src/components/sections/contact-box/contact-box.module.css
@@ -3,7 +3,6 @@
   padding: 0;
   width: 100%;
   max-width: var(--max-content-width-large);
-  padding: 2.25rem 0rem;
 }
 
 .contactBox__inner {
diff --git a/src/components/sections/customerCasesEntry/CustomerCasesEntry.tsx b/src/components/sections/customerCasesEntry/CustomerCasesEntry.tsx
index a68e5bce8..64c59a845 100644
--- a/src/components/sections/customerCasesEntry/CustomerCasesEntry.tsx
+++ b/src/components/sections/customerCasesEntry/CustomerCasesEntry.tsx
@@ -45,7 +45,7 @@ async function CustomerCasesEntry({ language, section }: CustomerCasesProps) {
 
   return (
     customerCaseResult && (
-      <>
+      <div className={styles.firstWrapper}>
         <div className={styles.titleWrapper}>
           <Text type="h3" className={styles.title}>
             {section.basicTitle}
@@ -56,7 +56,7 @@ async function CustomerCasesEntry({ language, section }: CustomerCasesProps) {
           language={language}
           customerCasePageSlug={customerCasePageSlug}
         />
-      </>
+      </div>
     )
   );
 }
diff --git a/src/components/sections/customerCasesEntry/customerCasesEntry.module.css b/src/components/sections/customerCasesEntry/customerCasesEntry.module.css
index f3b00742b..cf73b6834 100644
--- a/src/components/sections/customerCasesEntry/customerCasesEntry.module.css
+++ b/src/components/sections/customerCasesEntry/customerCasesEntry.module.css
@@ -1,3 +1,7 @@
+.firstWrapper {
+  padding-top: 5rem;
+}
+
 .container {
   container-type: inline-size;
   container-name: customer-case-container;
diff --git a/src/components/sections/generosity/generosity.module.css b/src/components/sections/generosity/generosity.module.css
index 0d58caa38..a8a27fb21 100644
--- a/src/components/sections/generosity/generosity.module.css
+++ b/src/components/sections/generosity/generosity.module.css
@@ -4,7 +4,8 @@
   justify-content: center;
   align-items: flex-start;
   max-width: var(--max-content-width-large);
-  margin: 5rem auto;
+  margin: 0 auto;
+  padding: 5rem 0;
   gap: 2rem;
   color: var(--text-primary);
 }
diff --git a/src/components/sections/hero/hero.module.css b/src/components/sections/hero/hero.module.css
index 8f4d3201f..8a09ff117 100644
--- a/src/components/sections/hero/hero.module.css
+++ b/src/components/sections/hero/hero.module.css
@@ -2,10 +2,10 @@
   display: flex;
   flex-direction: column;
   overflow: hidden;
-  padding: var(--padding-l) 0rem;
+  padding: 5rem 0;
 
   @media (max-width: 834px) {
-    padding: var(--padding-l) 0rem;
+    padding: 5rem 0rem;
   }
 
   @media (max-width: 425px) {
@@ -23,8 +23,8 @@
 .secondary {
   composes: shared;
   align-self: center;
-  padding: var(--padding-xl) var(--padding-rem);
   gap: var(--padding-rem);
+  padding: 0 var(--padding-rem);
 
   @media (max-width: 834px) {
     padding: var(--padding-l) var(--padding-s);
diff --git a/src/components/sections/learning/learning.module.css b/src/components/sections/learning/learning.module.css
index 4a5026cd1..9d5abee3b 100644
--- a/src/components/sections/learning/learning.module.css
+++ b/src/components/sections/learning/learning.module.css
@@ -4,7 +4,8 @@
   justify-content: center;
   align-items: flex-start;
   max-width: var(--max-content-width-large);
-  margin: 5rem auto;
+  margin: 0 auto;
+  padding: 5rem 0;
   gap: 2rem;
 }
 
diff --git a/src/components/sections/openness/openness.module.css b/src/components/sections/openness/openness.module.css
index 24bd6abef..d379ce7de 100644
--- a/src/components/sections/openness/openness.module.css
+++ b/src/components/sections/openness/openness.module.css
@@ -4,7 +4,8 @@
   justify-content: center;
   align-items: flex-start;
   max-width: var(--max-content-width-large);
-  margin: 5rem auto;
+  margin: 0 auto;
+  padding: 5rem 0;
   gap: 2rem;
   color: var(--text-primary);
 }