Fine tuning changes

inovex · Dec 8, 2023 · 58d3eb8 · 58d3eb8
1 parent f32bd9a
commit 58d3eb8
Show file tree

Hide file tree

Showing 13 changed files with 37 additions and 48 deletions.
diff --git a/src/components/Footer/Footer.astro b/src/components/Footer/Footer.astro
@@ -1,5 +1,4 @@
 ---
-import { Facebook } from "../../icons/Facebook";
 import { Github } from "../../icons/Github";
 import { Instagram } from "../../icons/Instagram";
 import { Linkedin } from "../../icons/Linkedin";
@@ -75,15 +74,6 @@ const content = await getTranslatedContent("Footer", lang!);
             <Instagram />
           </a>
         </li>
-        <li>
-          <a
-            href="https://www.facebook.com/inovexde"
-            target="_blank"
-            aria-label="Facebook"
-          >
-            <Facebook />
-          </a>
-        </li>
         <li>
           <a
             href="https://digital-future.podigee.io/"

diff --git a/src/components/Footer/Footer.scss b/src/components/Footer/Footer.scss
@@ -13,7 +13,7 @@ footer {
   max-width: 1920px;
   margin: 0 auto;
   height: 427px;
-  padding: 100px var(--footer-padding-x);
+  padding: 100px 64px;
   color: var(--white);
   box-sizing: border-box;
   display: flex;
@@ -46,6 +46,7 @@ footer {
 }
 
 .footer__inovex-description {
+  text-wrap: balance;
   margin: 0;
   font-size: 20px;
   line-height: 28px;
@@ -87,7 +88,7 @@ footer {
 
     &:focus-visible {
       outline: none;
-      border-color: var(--lightmode-pink);
+      border-color: var(--lightmode-blue);
     }
   }
 }
@@ -113,7 +114,7 @@ footer {
   align-items: center;
   width: 100%;
   max-width: 1920px;
-  padding: 0 var(--footer-padding-x);
+  padding: 0 64px;
   box-sizing: border-box;
 
   span {
@@ -143,7 +144,7 @@ footer a {
   border-radius: 4px;
 
   &:hover {
-    color: var(--lightmode-pink);
+    color: var(--darkmode-blue);
   }
 
   &:focus-visible {
@@ -157,11 +158,11 @@ footer a {
     background-color: var(--darkmode-blue);
 
     a:hover {
-      color: var(--darkmode-pink);
+      color: var(--lightmode-blue);
     }
 
     a:focus-visible {
-      border-color: var(--darkmode-pink);
+      border-color: var(--lightmode-blue);
     }
   }
 

diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
@@ -57,6 +57,7 @@ const { title } = Astro.props;
   html {
     font-family: "Raleway", sans-serif;
     box-sizing: border-box;
+    scroll-padding-top: 64px;
     scroll-behavior: smooth;
 
     --white: #ffffff;
@@ -121,8 +122,8 @@ const { title } = Astro.props;
   }
 
   p {
-    font-size: 14px;
-    line-height: 20px;
+    font-size: 18px;
+    line-height: 24px;
   }
 
   @media screen and (min-width: 992px) {

diff --git a/src/pages/[lang]/Legal/Legal.scss b/src/pages/[lang]/Legal/Legal.scss
@@ -9,13 +9,14 @@ h2 {
   font-size: 40px;
   line-height: 48px;
   font-weight: 700;
+  margin-top: 64px;
 }
 
 h3 {
   font-size: 24px;
   line-height: 28px;
   font-weight: 700;
-  margin: 48px 0 16px 0;
+  margin: 64px 0 16px 0;
 }
 
 p,

diff --git a/src/pages/[lang]/Legal/Privacy.astro b/src/pages/[lang]/Legal/Privacy.astro
@@ -16,5 +16,6 @@ export const getStaticPaths = (() => {
 ---
 
 <LegalLayout>
-  <section set:html={content.Privacy_Policy} />
+  <section class="legal__content" set:html={content.Privacy_Policy} />
 </LegalLayout>
+
diff --git a/src/pages/[lang]/Legal/Terms.astro b/src/pages/[lang]/Legal/Terms.astro
@@ -18,3 +18,9 @@ export const getStaticPaths = (() => {
 <LegalLayout>
   <section set:html={content.Terms_Conditions} />
 </LegalLayout>
+
+<style>
+  section {
+    text-wrap: wrap;
+  }
+</style>
diff --git a/src/views/AboutUs/AboutUs.scss b/src/views/AboutUs/AboutUs.scss
@@ -75,21 +75,17 @@
 .about-us__scrumlr-text,
 .about-us__cta {
   > h2 {
-    font-size: 40px;
-    line-height: 48px;
     text-wrap: balance;
     margin: 0 0 24px 0;
   }
 
   > p {
-    font-size: 20px;
-    line-height: 28px;
     text-wrap: balance;
     margin: 0;
   }
 
   > a {
-    margin-top: 68px;
+    margin-top: 64px;
   }
 }
 

diff --git a/src/views/Choices/Choices.astro b/src/views/Choices/Choices.astro
@@ -7,7 +7,7 @@ const {lang} = Astro.params;
 const content = await getTranslatedContent("Choices_Section", lang!);
 ---
 
-<section class="choices" id="Features">
+<section class="choices">
   <h2>{content.header}</h2>
   <p>{content.text}</p>
   <VideoPlayer client:visible textContent={content} />

diff --git a/src/views/Features/Features.astro b/src/views/Features/Features.astro
@@ -13,7 +13,7 @@ const {lang} = Astro.params;
 const content = await getTranslatedContent("Features_Section", lang!);
 ---
 
-<section class="features">
+<section id="Features" class="features">
     <h2>{content.header}</h2>
     <p>{content.text}</p>
   <div class="features_list">

diff --git a/src/views/Mobile/Mobile.astro b/src/views/Mobile/Mobile.astro
@@ -10,7 +10,7 @@ const content = await getTranslatedContent("Mobile_Section", lang!);
 <div class="mobile__image">
   <img
     class="mobile__stan"
-    src={`/assets/mobile/mobile_light.webp`}
+    src={`/assets/mobile/mobile_light--mobile.webp`}
     alt={content.imageAlt}
   />
   <img

diff --git a/src/views/Mobile/Mobile.scss b/src/views/Mobile/Mobile.scss
@@ -37,7 +37,7 @@
 
     min-height: 800px;
     max-height: 1100px;
-    right: 0;
+    right: 70px;
     z-index: 0;
   }
 }
@@ -64,7 +64,7 @@
   opacity: 0.05;
 }
 
-@media screen and (max-width: 700px) {
+@media screen and (max-width: 991px) {
   h2 {
     font-size: 24px;
     line-height: 28px;
@@ -82,8 +82,8 @@
     align-items: center;
     text-align: center;
     height: fit-content;
-    padding: 64px 0 0 0;
-    gap: 16px;
+    padding: 64px 0 64px 0;
+    gap: 36px;
   }
 
   .mobile__dots {
@@ -96,13 +96,12 @@
 
     .mobile__stan {
       min-height: unset;
-      height: 380px;
-      content: url("/assets/mobile/mobile_light--mobile.webp");
+      height: 500px;
     }
 
     .mobile__background {
       min-height: unset;
-      height: 540px;
+      height: 750px;
       right: 46px;
     }
   }
@@ -111,12 +110,6 @@
     margin: 0;
     width: 90%;
   }
-
-  @media (prefers-color-scheme: dark) {
-    .mobile__image .mobile__stan {
-      content: url("/assets/mobile/mobile_dark--mobile.webp");
-    }
-  }
 }
 
 @media (prefers-color-scheme: dark) {
@@ -129,7 +122,7 @@
   }
 
   .mobile__stan {
-    content: url("/assets/mobile/mobile_dark.webp");
+    content: url("/assets/mobile/mobile_dark--mobile.webp");
   }
 
   .mobile__background {

diff --git a/src/views/ReachNewHeights/ReachNewHeights.scss b/src/views/ReachNewHeights/ReachNewHeights.scss
@@ -15,7 +15,7 @@
   margin: 0 auto;
   display: flex;
   flex-direction: column;
-  gap: 48px;
+  gap: 64px;
 }
 
 .reach-new-heights__headline {
@@ -91,7 +91,7 @@
 .reach-new-heights__information {
   display: flex;
   flex-direction: column;
-  gap: 42px;
+  gap: 64px;
 }
 
 .reach-new-heights__information-item {
@@ -101,15 +101,15 @@
 
   > h2 {
     color: var(--black);
-    font-size: 16px;
+    font-size: 24px;
     font-weight: 700;
-    line-height: 22px;
+    line-height: 32px;
     margin-top: 12px;
     margin-bottom: 8px;
   }
   > p {
     color: var(--black);
-    font-size: 16px;
+    font-size: 18px;
     font-weight: 400;
     line-height: 24px;
     text-align: center;

diff --git a/src/views/Uniqueness/Uniqueness.scss b/src/views/Uniqueness/Uniqueness.scss
@@ -110,13 +110,13 @@ $uniqueness-image-count: 4; // Number of images
 @media screen and (max-width: 1140px) {
   .uniqueness__wrapper {
     padding: 32px;
+    padding-bottom: 64px;
     box-sizing: border-box;
   }
 
   .uniqueness__section {
     flex-direction: column;
     box-sizing: border-box;
-    margin-bottom: 100px;
     gap: 32px;
 
     &:first-of-type {