hipstersmoothie.com / hip-ui
A design system in a box. hip-ui.tngl.io/docs/introduction
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

add shadow

Andrew Lisowski fa7b345f 93cb2705

+6
+3
apps/docs/src/components/navbar/useAnimatedNavbar.tsx
··· 8 8 animationDuration, 9 9 animationTimingFunction, 10 10 } from "../theme/animations.stylex"; 11 + import { shadow } from "../theme/shadow.stylex"; 11 12 12 13 const SCROLL_THRESHOLD = 16; 13 14 ··· 18 19 top: 0, 19 20 }, 20 21 navbarRevealed: { 22 + boxShadow: shadow.lg, 21 23 position: "sticky", 22 24 transform: "translateY(0)", 23 25 transitionDuration: animationDuration.slow, ··· 87 89 currentScrollY <= SCROLL_THRESHOLD 88 90 ) { 89 91 setShouldAnimateIn(true); 92 + setShouldAnimateOut(false); 90 93 } 91 94 } 92 95 // Animate navbar out when scrolling down past threshold
+3
packages/hip-ui/src/components/navbar/useAnimatedNavbar.tsx
··· 8 8 animationDuration, 9 9 animationTimingFunction, 10 10 } from "../theme/animations.stylex"; 11 + import { shadow } from "../theme/shadow.stylex"; 11 12 12 13 const SCROLL_THRESHOLD = 16; 13 14 ··· 18 19 top: 0, 19 20 }, 20 21 navbarRevealed: { 22 + boxShadow: shadow.lg, 21 23 position: "sticky", 22 24 transform: "translateY(0)", 23 25 transitionDuration: animationDuration.slow, ··· 87 89 currentScrollY <= SCROLL_THRESHOLD 88 90 ) { 89 91 setShouldAnimateIn(true); 92 + setShouldAnimateOut(false); 90 93 } 91 94 } 92 95 // Animate navbar out when scrolling down past threshold