fixing background in hero section (#42)

blackwavesdev · Nov 7, 2024 · d56aba1 · d56aba1 · github-actions · Nov 7, 2024
2 parents c25a427 + 3e988f6
commit d56aba1
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 3 deletions.
diff --git a/app/components/Hero.tsx b/app/components/Hero.tsx
@@ -34,7 +34,7 @@ const Hero = forwardRef<HTMLDivElement>((_, ref) => {
   return (
     <section
       ref={localRef}
-      className="overflow-y-hidden min-h-[100dvh] snap-start relative back bg-cover bg-center bg-fixed h-screen flex items-center justify-center "
+      className="overflow-y-hidden min-h-[100dvh] snap-start relative back bg-cover bg-center bg-fixed h-[100dvh] center "
     >
       <div className="flex flex-col md:flex-row justify-center items-center ">
         <Image
@@ -45,7 +45,7 @@ const Hero = forwardRef<HTMLDivElement>((_, ref) => {
           className={`center ${
             isInView
               ? "motion-scale-in-[0.5] motion-translate-x-in-[-88%] motion-translate-y-in-[-9%] motion-opacity-in-[0%] motion-rotate-in-[-10deg] motion-blur-in-[5px] motion-duration-[0.00s] motion-duration-[0.61s]/translate motion-ease-spring-bouncy"
-              : "hidden"
+              : ""
           }`}
         />
         <p

diff --git a/app/components/ScrollBySection.tsx b/app/components/ScrollBySection.tsx
@@ -60,7 +60,7 @@ const ScrollBySection: React.FC = () => {
 
   return (
     <div
-      className={`h-screen w-full ${
+      className={`h-[100dvh] w-full ${
         isDesktop ? "overflow-hidden" : "overflow-auto"
       }`} // Overflow hidden only for desktop
     >

diff --git a/app/globals.css b/app/globals.css
@@ -5,6 +5,9 @@ html,
 body {
   scroll-behavior: smooth !important;
 }
+* {
+  overflow-y: hidden !important;
+}
 body {
   font-family: Arial, Helvetica, sans-serif;
 }
-Original file line number
+Diff line change
@@ Expand Up / @@ -5,6 +5,9 @@ html, @@
     body {
       scroll-behavior: smooth !important;
     }
+    * {
+      overflow-y: hidden !important;
+    }
     body {
       font-family: Arial, Helvetica, sans-serif;
     }
@@ Expand Down @@