From 2049c4472fb89c5eb7920cf1c0a0d49c993125c9 Mon Sep 17 00:00:00 2001
From: Tben <benoti.san@gmail.com>
Date: Thu, 20 Jul 2023 21:26:23 +0100
Subject: [PATCH] updates

---
 app/(utils)/homepage-timeline.ts         | 34 +++++++++++++-----------
 layouts/general_layout/GeneralHeader.tsx |  4 +--
 styles/tw_main.css                       | 32 ++++++++++++++++++++++
 3 files changed, 52 insertions(+), 18 deletions(-)

diff --git a/app/(utils)/homepage-timeline.ts b/app/(utils)/homepage-timeline.ts
index 2b5887e..c04551a 100644
--- a/app/(utils)/homepage-timeline.ts
+++ b/app/(utils)/homepage-timeline.ts
@@ -22,22 +22,24 @@ export default function homepageTimeline({ componentRef }: { componentRef: { cur
             /**
              * Origin
              */
-            if (scrollTop < 300) {
-                gsap.to("nav", {
-                    opacity: 1,
-                    pointerEvents: "visible",
-                });
-                gsap.to("header", {
-                    zIndex: 2000,
-                });
-            } else {
-                gsap.to("nav", {
-                    opacity: 0,
-                    pointerEvents: "none",
-                });
-                gsap.to("header", {
-                    zIndex: 0,
-                });
+            if (!isMobile) {
+                if (scrollTop < 300) {
+                    gsap.to("nav", {
+                        opacity: 1,
+                        pointerEvents: "visible",
+                    });
+                    gsap.to("header", {
+                        zIndex: 2000,
+                    });
+                } else {
+                    gsap.to("nav", {
+                        opacity: 0,
+                        pointerEvents: "none",
+                    });
+                    gsap.to("header", {
+                        zIndex: 0,
+                    });
+                }
             }
 
             /**
diff --git a/layouts/general_layout/GeneralHeader.tsx b/layouts/general_layout/GeneralHeader.tsx
index a4093ce..0ee52b0 100644
--- a/layouts/general_layout/GeneralHeader.tsx
+++ b/layouts/general_layout/GeneralHeader.tsx
@@ -61,7 +61,7 @@ const GeneralHeader = (): React.ReactElement => {
             <a
                 href="/"
                 data-href="/"
-                className="logo-link-block"
+                className="logo-link-block scale-90 sm:scale-100"
             >
                 <Image
                     src="/images/logo-white.svg"
@@ -74,7 +74,7 @@ const GeneralHeader = (): React.ReactElement => {
             <HeaderNav />
 
             <button
-                className="p-2 w-14 h-14 rounded-full flex flex-col items-center justify-center gap-2 hover:bg-[white]/90 xl:hidden fixed right-10 z-10 -rotate-45"
+                className="p-2 w-14 h-14 rounded-full flex flex-col items-center justify-center gap-2 hover:bg-[white]/90 xl:hidden fixed top-[35px] right-10 z-10 -rotate-45"
                 onClick={(e) => {
                     e.preventDefault();
                     setMobileNavOpen(!mobileNavOpen);
diff --git a/styles/tw_main.css b/styles/tw_main.css
index 02488fe..a6222e2 100644
--- a/styles/tw_main.css
+++ b/styles/tw_main.css
@@ -150,6 +150,18 @@
   top: 330px
 }
 
+.top-\[30px\] {
+  top: 30px
+}
+
+.top-\[40px\] {
+  top: 40px
+}
+
+.top-\[35px\] {
+  top: 35px
+}
+
 .z-0 {
   z-index: 0
 }
@@ -320,6 +332,12 @@
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
 }
 
+.scale-90 {
+  --tw-scale-x: .9;
+  --tw-scale-y: .9;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
+}
+
 .transform {
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
 }
@@ -671,6 +689,14 @@
   opacity: 0.6
 }
 
+@media (min-width: 450px) {
+  .sm\:scale-100 {
+    --tw-scale-x: 1;
+    --tw-scale-y: 1;
+    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
+  }
+}
+
 @media (min-width: 600px) {
   .md\:relative {
     position: relative
@@ -741,6 +767,12 @@
     width: 60%
   }
 
+  .xl\:scale-100 {
+    --tw-scale-x: 1;
+    --tw-scale-y: 1;
+    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
+  }
+
   .xl\:flex-row {
     flex-direction: row
   }