speed up animation

island-is · Jan 20, 2025 · 8c84f2e · 8c84f2e
1 parent 0bebbaf
commit 8c84f2e
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/apps/portals/my-pages/src/components/Header/Header.css.ts b/apps/portals/my-pages/src/components/Header/Header.css.ts
@@ -30,7 +30,7 @@ export const fixedHeader = style({
       position: 'fixed',
       transform: 'translateY(0)',
       top: 0,
-      transition: 'transform 550ms cubic-bezier(0.4, 0.0, 0.2, 1)',
+      transition: 'transform 300ms cubic-bezier(0.4, 0.0, 0.2, 1)',
     },
   },
 })
@@ -40,7 +40,7 @@ export const hideHeader = style({
     [`screen and (max-width: ${theme.breakpoints.md}px)`]: {
       position: 'fixed',
       transform: 'translateY(-100%)',
-      transition: 'transform 550ms cubic-bezier(0.4, 0.0, 0.2, 1)',
+      transition: 'transform 300ms cubic-bezier(0.4, 0.0, 0.2, 1)',
       top: 0,
     },
   },

diff --git a/libs/portals/my-pages/core/src/components/Navigation/Navigation.css.ts b/libs/portals/my-pages/core/src/components/Navigation/Navigation.css.ts
@@ -193,7 +193,7 @@ export const scrolledMenuVisible = style({
     background: theme.color.blue100,
     borderBottom: `1px solid ${theme.color.blue200}`,
     transformOrigin: 'top',
-    animation: `${stretchKeyframe} 0.75s ease-in-out forwards`, // Appear animation
+    animation: `${stretchKeyframe} 0.3 ease-in-out forwards`,
   },
 })
 
@@ -209,7 +209,7 @@ export const scrolledMenuHidden = style({
     background: theme.color.blue100,
     borderBottom: `1px solid ${theme.color.blue200}`,
     transformOrigin: 'top',
-    animation: `${shrinkKeyframe} 0.75s ease-in-out forwards`, // Disappear animation
+    animation: `${shrinkKeyframe} 0.3 ease-in-out forwards`,
   },
 })