Mirrors/tabler
1
0
Fork 0
mirror of https://github.com/tabler/tabler.git synced 2025-12-26 11:16:12 +04:00
Code Issues Projects Releases Wiki Activity

site header fixes

Browse Source
This commit is contained in:
codecalm
2023-08-01 00:26:49 +02:00
parent 5f3ffbcc23
commit e3eee16180
4 changed files with 22 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
site/app/(marketing)/docs/[[...slug]]/layout.tsx
View File

@@ -6,10 +6,8 @@ export const metadata = {
export default function DocsLayout({ children /*, meta = {}, pageProps*/ }) {
return (
<div className="border-bottom border-top">
<div className="container">
{children}
</div>
<div className="border-bottom bg-white">
<div className="container">{children}</div>
</div>
);
}

5
site/app/layout.tsx
View File

@@ -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 (
<html lang="en">
<head>
@@ -72,8 +72,7 @@ export default function RootLayout({ children, bodyClass }: { children: React.Re
</>
)}
</head>
<body>
{bodyClass}
<body className="body-gradient">
<PageProgress />
{children}
<link rel="stylesheet" href="https://rsms.me/inter/inter.css" />

26
site/components/layout/Header.tsx
View File

@@ -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 (
<>
<Banner />
<header
className={clsx(
'header',
// router.pathname.startsWith('/docs') && 'header-bordered',
// headerStatic ? 'header-static' : '',
// isVisible && 'header-sticky',
sticky && 'header-sticky',
pathname.startsWith('/docs') && 'header-docs',
className,
)}
>

8
site/styles/_layout.scss
View File

@@ -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 {