Fix header z-index and padding for text (#24)

compolabs · Jun 9, 2024 · 83ff4a7 · 83ff4a7
1 parent 80dd86c
commit 83ff4a7
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 4 deletions.
diff --git a/src/core/components/LandingPage/ResourcesSection/NumberedCard.tsx b/src/core/components/LandingPage/ResourcesSection/NumberedCard.tsx
@@ -70,7 +70,7 @@ const cssStyles = {
   `,
   paragraph: css`
     margin-bottom: ${theme.spacing.custom[40]};
-    max-width: ${convertPxToRem(500)};
+    max-width: ${convertPxToRem(300)};
 
     ${theme.media.tabletLandscape} {
       max-width: ${convertPxToRem(732)};

diff --git a/src/core/components/common/Header/Header.tsx b/src/core/components/common/Header/Header.tsx
@@ -6,6 +6,7 @@ import theme from "@/core/styles/theme";
 import { useMobileWindowWidth } from "@/core/hooks/useMobileWindowWidth";
 import useMainFont from "@/core/hooks/useMainFont";
 import useScrollDirection from "@/core/hooks/useScrollDirection";
+import { convertPxToRem } from "@/core/utils/convertPxToRem";
 
 import Navigation from "./Navigation";
 import Logo from "../Logo";
@@ -52,14 +53,14 @@ const cssStyles = {
     scrollPosition: boolean,
     scrollDirection: boolean | null
   ) => css`
-    z-index: 1;
+    z-index: 100;
     width: 100%;
     min-height: 3.75rem;
     position: fixed;
     top: 0;
     padding: ${theme.spacing.normal} 0;
     transition:
-      transform 0.05s linear,
+      transform 0.15s linear,
       background 0.15s linear,
       backdrop-filter 0.15s linear;
 
@@ -73,7 +74,7 @@ const cssStyles = {
       : null};
 
     transform: translateY(
-      ${scrollPosition && !scrollDirection ? "-130px" : "0"}
+      ${scrollPosition && !scrollDirection ? convertPxToRem(-130) : "0"}
     );
 
     ${theme.media.tabletBreakPoint} {