diff --git a/site/app/(marketing)/docs/[[...slug]]/layout.tsx b/site/app/(marketing)/docs/[[...slug]]/layout.tsx index c8849a588..2941bf83c 100644 --- a/site/app/(marketing)/docs/[[...slug]]/layout.tsx +++ b/site/app/(marketing)/docs/[[...slug]]/layout.tsx @@ -6,10 +6,8 @@ export const metadata = { export default function DocsLayout({ children /*, meta = {}, pageProps*/ }) { return ( -
-
- {children} -
+
+
{children}
); } diff --git a/site/app/layout.tsx b/site/app/layout.tsx index 5143b9321..6156121cc 100644 --- a/site/app/layout.tsx +++ b/site/app/layout.tsx @@ -61,7 +61,7 @@ export const metadata = { }, }; -export default function RootLayout({ children, bodyClass }: { children: React.ReactNode; bodyClass?: string }) { +export default function RootLayout({ children }: { children: React.ReactNode }) { return ( @@ -72,8 +72,7 @@ export default function RootLayout({ children, bodyClass }: { children: React.Re )} - - {bodyClass} + {children} diff --git a/site/components/layout/Header.tsx b/site/components/layout/Header.tsx index 0e5676a23..65e1aba3e 100644 --- a/site/components/layout/Header.tsx +++ b/site/components/layout/Header.tsx @@ -10,8 +10,7 @@ import GoToTop from '@/components/layout/GoToTop'; import Link from '@/components/Link'; import NavLink from '@/components/NavLink'; import Shape from '@/components/Shape'; - -// import { useRouter } from 'next/router' +import { usePathname } from 'next/navigation'; const NavDropdown = ({ title, children, active, footer = false }) => { return ( @@ -237,10 +236,7 @@ const Banner = () => { export default function Header({ headerStatic, className, pageProps, ...props }: { headerStatic?: boolean; className?: string; pageProps?: any }) { const [sticky, setSticky] = useState(false); const [isOpen, setIsOpen] = useState(false); - - const pop = () => { - setSticky(window.pageYOffset > 0); - }; + const pathname = usePathname(); function closeModal() { setIsOpen(false); @@ -250,15 +246,27 @@ export default function Header({ headerStatic, className, pageProps, ...props }: setIsOpen(!isOpen); } + useEffect(() => { + const handleScroll = () => { + setSticky(window.pageYOffset > 0); + }; + + window.addEventListener('scroll', handleScroll); + handleScroll(); + + return () => { + window.removeEventListener('scroll', handleScroll); + }; + }, []); + return ( <>
diff --git a/site/styles/_layout.scss b/site/styles/_layout.scss index f2d1f589b..5ab6c9df1 100644 --- a/site/styles/_layout.scss +++ b/site/styles/_layout.scss @@ -193,14 +193,8 @@ padding: 0; display: flex; align-items: center; - transition: .3s background-color, .3s height, .6s box-shadow, .3s background; + transition: .6s background-color, .6s height, .6s border-color, .6s box-shadow; z-index: $zindex-header + 30; - background: $color-white; -} - -.header-static, -.header-bordered { - box-shadow: 0 0 0 1px $color-border; } .header-docs {