fix: minor fix

delta · Dec 8, 2023 · 0fa9dcf · 0fa9dcf
1 parent a95a21c
commit 0fa9dcf
Show file tree

Hide file tree

Showing 6 changed files with 31 additions and 53 deletions.
diff --git a/src/app/gallery/page.tsx b/src/app/gallery/page.tsx
@@ -77,7 +77,8 @@ const History = () => {
                 styles.historyBG +
                 ' ' +
                 'h-screen w-screen p-0 flex justify-center items-center overflow-y-hidden' +
-                (isScrolled ? 'scrolled' : '')
+                ' ' +
+                (isScrolled ? ' scrolled' : ' transitioned')
             }
             onWheel={simulateScroll}
             onTouchStart={handleTouchStart}

diff --git a/src/app/globals.css b/src/app/globals.css
@@ -104,7 +104,7 @@ body {
         background-color: initial;
     }
     to {
-        background-color: #7efbfe;
+        background-color: #000;
     }
 }
 

diff --git a/src/app/home/page.tsx b/src/app/home/page.tsx
@@ -57,7 +57,7 @@ export default function Home() {
                 }
             ></div>
             <div
-                className={'h-screen w-full text-center lg:p-7 p-5 home'}
+                className={'h-screen w-full text-center lg:p-7 p-5 home transitioned'}
                 onWheel={simulateScroll}
                 onTouchStart={handleTouchStart}
                 onTouchMove={handleTouchMove}

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -21,31 +21,7 @@ const generateRandomNumber = (length: number) => {
     return result;
 };
 
-function useWindowSize() {
-    const [windowSize, setWindowSize] = useState<{
-        width: number | undefined;
-        height: number | undefined;
-    }>({
-        width: undefined,
-        height: undefined,
-    });
-
-    useEffect(() => {
-        function handleResize() {
-            setWindowSize({
-                width: window.innerWidth,
-                height: window.innerHeight,
-            });
-        }
-        window.addEventListener('resize', handleResize);
-        handleResize();
-        return () => window.removeEventListener('resize', handleResize);
-    }, []);
-    return windowSize;
-}
-
 export default function Loading() {
-    const size = useWindowSize();
     const currDate = new Date();
     const [animationStarted, setAnimationStarted] = useState<boolean>(false);
     const [year, setYear] = useState(String(currDate.getFullYear()).padStart(4, '0'));
@@ -87,8 +63,8 @@ export default function Loading() {
                 clearInterval(lightTimer);
                 setTimeout(() => {
                     router.push('/home');
-                }, 1000);
-            }, 5000);
+                }, 500);
+            }, 2000);
             const lightTimer = setInterval(() => {
                 setIsLeftLightOn(prev => !prev);
             }, 100);
@@ -100,27 +76,28 @@ export default function Loading() {
         }
     }, [animationStarted, router]);
 
-    return size.width !== undefined && size.width < 700 ? (
-        <LoadingMobileView
-            month={month}
-            year={year}
-            date={date}
-            hours={hours}
-            minutes={minutes}
-            isButtonClicked={animationStarted}
-            setClicked={setAnimationStarted}
-            isLeftLightOn={isLeftLightOn}
-        />
-    ) : (
-        <LoadingWebView
-            month={month}
-            year={year}
-            date={date}
-            hours={hours}
-            minutes={minutes}
-            isButtonClicked={animationStarted}
-            setClicked={setAnimationStarted}
-            isLeftLightOn={isLeftLightOn}
-        />
+    return (
+        <>
+            <LoadingMobileView
+                month={month}
+                year={year}
+                date={date}
+                hours={hours}
+                minutes={minutes}
+                isButtonClicked={animationStarted}
+                setClicked={setAnimationStarted}
+                isLeftLightOn={isLeftLightOn}
+            />
+            <LoadingWebView
+                month={month}
+                year={year}
+                date={date}
+                hours={hours}
+                minutes={minutes}
+                isButtonClicked={animationStarted}
+                setClicked={setAnimationStarted}
+                isLeftLightOn={isLeftLightOn}
+            />
+        </>
     );
 }
diff --git a/src/components/Landing/LoadingMobileView.tsx b/src/components/Landing/LoadingMobileView.tsx
@@ -15,7 +15,7 @@ const LoadingMobileView = ({
 }: LoadingProps) => {
     return (
         <>
-            <div className="relative w-[100vw] h-[100vh] bg-[#0D0D0D] flex flex-col items-center justify-center bg-[url('../assets/images/loadingBgMobile.png')] bg-contain bg-center bg-no-repeat">
+            <div className="relative md:hidden w-[100vw] h-[100vh] bg-[#0D0D0D] flex flex-col items-center justify-center bg-[url('../assets/images/loadingBgMobile.png')] bg-contain bg-center bg-no-repeat">
                 <div className=" h-[20%] w-[80%] relative flex flex-col items-center justify-center">
                     <div className="absolute flex w-[10%] right-[10vw] top-[4.2vh] max-[380px]:right-[15vw]">
                         <Image src={isLeftLightOn ? onlight : offLight} alt="light" />

diff --git a/src/components/Landing/LoadingWebView.tsx b/src/components/Landing/LoadingWebView.tsx
@@ -15,7 +15,7 @@ const LoadingWebView = ({
 }: LoadingProps) => {
     return (
         <>
-            <div className="w-[100vw] h-[100vh] bg-[#0D0D0D] relative">
+            <div className="max-md:hidden w-[100vw] h-[100vh] bg-[#0D0D0D] relative">
                 <div className="relative left-[50%] top-[50%] transform -translate-x-1/2 -translate-y-1/2 h-[90%] w-[100%] flex flex-col items-center justify-center bg-[url('../assets/images/loadingBg.png')] bg-contain bg-center bg-no-repeat">
                     <div className=" w-[80%] h-[28%] loadingdivs relative flex items-center justify-end">
                         <div className=" mr-[2%] flex w-[10%] h-[100%] items-end 2xl:h-[100%] lights">
-Original file line number
+Diff line change
@@ Expand Up / @@ -104,7 +104,7 @@ body { @@
             background-color: initial;
         }
         to {
-            background-color: #7efbfe;
+            background-color: #000;
         }
     }
@@ Expand Down @@