chore: fundamental Website minor updates(#1750)

* chore: emptycommit * fix: test2 * fix: test3 * fix: problem1 * fix: postghissue * fix: scroll extended * fix: hidden overflow * fix: back to normal * fix: z index * fix: testing * fix: mobile scroll * fix: responsive index * fix: try width * fix: width, index, overflow, positions * fix: z index 2 * fix: pre deploy * fix: minor fixes * fix: cards paragraphs * fix: card text * fix: libraries title content fit * fix: iphone text delete fit * fix: mobile card text delete, scrolling saved * fix: card titles
SAP · Dec 1, 2023 · 785848c · 785848c
1 parent 5520e97
commit 785848c
Show file tree

Hide file tree

Showing 8 changed files with 48 additions and 16 deletions.
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
@@ -1,10 +1,13 @@
 
+
 .fl-libraries {
-  position: relative;
+  position: sticky;
   top: 0;
   height: auto;
   min-height: 100vh;
+  width: auto;
   background-color: #fafcff;
+  z-index: 2;
   .fl-title {
     display: flex;
     flex-direction: column;
@@ -14,6 +17,12 @@
     margin-right: 1.1875rem;
     margin-left: 5vw;
   }
+  @media (50px <= width <=430px){
+
+    .fl-title{
+      padding-top: 1.5rem;
+    }
+  }
   @media (500px <= width <= 899px) {
     position: sticky;
     top: 0;
@@ -44,7 +53,7 @@
   padding: 5vw 5vw;
 
 }
-@media (width >= 1115px){
+@media (width >= 900px){
   .fl-cards{
     flex-direction: row;
     column-gap: 2rem;

diff --git a/src/app/fl-card/fl-card.component.scss b/src/app/fl-card/fl-card.component.scss
@@ -11,9 +11,7 @@
     2.3px 2.3px 4.5px rgba(0, 0, 0, 0.045),
     6.4px 6.4px 12.5px rgba(0, 0, 0, 0.065),
     15.4px 15.4px 30.1px rgba(0, 0, 0, 0.085),
-    51px 51px 100px rgba(0, 0, 0, 0.13)
-  ;
-
+    51px 51px 100px rgba(0, 0, 0, 0.13);
 
     img {
         height: 3.75rem;
@@ -61,10 +59,28 @@
 
 
     }
-}
 
-@media (min-width: 900px) {
-    .fl-card {
+  @media (max-width: 430px) {
+    gap: 1rem;
+    padding: 1.5rem 1rem;
+
+    h2{
+        font-size: 1.1rem;
+        line-height: 1rem;
+    }
+
+    p {
+        font-size: 0.875rem;
+        line-height: 1.375rem;
+        color: #004E5E;
+        text-align: center;
+        display: none;
+    }
+
+  }
+
+  @media (min-width: 900px) {
+
         gap: 2.75rem;
         padding: 2.25rem;
         align-items: flex-start;
@@ -83,7 +99,9 @@
             line-height: 1.875rem;
             text-align: left;
         }
-
     }
+
 }
 
+
+
diff --git a/src/app/fl-conference/fl-conference.component.scss b/src/app/fl-conference/fl-conference.component.scss
@@ -9,6 +9,7 @@
     position: sticky;
     top:0;
     justify-content: center;
+    z-index: 4;
 
 
     .fl-title span {

diff --git a/src/app/fl-design/fl-design.component.scss b/src/app/fl-design/fl-design.component.scss
@@ -10,6 +10,7 @@
     position: relative;
     top: 0;
     justify-content: center;
+    z-index: 5;
 
     .fl-designimg1{
         width:20rem;

diff --git a/src/app/fl-footer/fl-footer.component.scss b/src/app/fl-footer/fl-footer.component.scss
@@ -20,7 +20,7 @@
     position: absolute;
     font-size: 1rem;
     font-weight: 700;
-    color: #001e31;
+    color: #001E31;
   }
 
   .fl-footer-img1 {
@@ -112,7 +112,7 @@
     margin-right: 1rem;
   }
   .fl-policies a{
-    color: black;
+    color: #001E31;
   }
   .fl-footer-imgSAP {
     float: left;
@@ -129,7 +129,7 @@
     margin-top: 3rem;
   }
   .fl-links a {
-    color: black;
+    color: #001E31;
 }
 
   @media (605px <= width <= 849px) {
@@ -138,7 +138,7 @@
       margin-left: 1rem;
     }
     .fl-links a {
-        color: black;
+        color: #001E31;
     }
   }
 
@@ -232,7 +232,7 @@
       margin-right: 0;
     }
     .fl-links a {
-        color: black;
+        color: #001E31;
     }
     .fl-footer-imgSAP {
       margin: 0 0 0 0;

diff --git a/src/app/fl-intro/fl-intro.component.scss b/src/app/fl-intro/fl-intro.component.scss
@@ -10,6 +10,7 @@
     padding: 0 1rem;
     position: sticky;
     top: 0;
+    z-index: 0;
 
     &__container {
         gap: 1rem;
@@ -27,7 +28,7 @@
     &__btn-container {
         margin-top: 5rem;
         align-items: center;
-        gap: 0.5rem;
+        gap: 1rem;
         display: flex;
         flex-direction: column;
     }

diff --git a/src/app/fl-purpose/fl-purpose.component.scss b/src/app/fl-purpose/fl-purpose.component.scss
@@ -6,9 +6,10 @@
     border-radius: 1rem;
     padding: 1.75rem 1rem;
     flex-direction: column;
-    background-color:#00677F;
+    background-color: #00677f;
     position: sticky;
     top: 0;
+    z-index: 1;
 
     p {
         flex: 1;

diff --git a/src/app/fl-used/fl-used.component.scss b/src/app/fl-used/fl-used.component.scss
@@ -9,6 +9,7 @@
     flex-direction: column;
     position: sticky;
     top: 0;
+    z-index: 3;
 
     .fl-title span {
       display: block;