forked from Kieran/snort
sticky header in mobile size
This commit is contained in:
parent
28bf0ea581
commit
e788e01c6d
@ -56,9 +56,12 @@ export default function Index() {
|
|||||||
return (
|
return (
|
||||||
<div className="h-screen flex justify-center">
|
<div className="h-screen flex justify-center">
|
||||||
<div className={`${pageClass} w-full max-w-screen-xl overflow-x-hidden`}>
|
<div className={`${pageClass} w-full max-w-screen-xl overflow-x-hidden`}>
|
||||||
|
{!shouldHideHeader && <Header />}
|
||||||
<div className="flex flex-row w-full">
|
<div className="flex flex-row w-full">
|
||||||
<NavSidebar className="w-1/4 flex-shrink-0" />
|
<NavSidebar className="w-1/4 flex-shrink-0" />
|
||||||
<MainContent shouldHideHeader={shouldHideHeader} />
|
<div className="flex flex-1 flex-col overflow-x-hidden">
|
||||||
|
<Outlet />
|
||||||
|
</div>
|
||||||
<RightColumn className="w-1/4 flex-shrink-0" />
|
<RightColumn className="w-1/4 flex-shrink-0" />
|
||||||
</div>
|
</div>
|
||||||
<div className="md:hidden">
|
<div className="md:hidden">
|
||||||
@ -72,18 +75,9 @@ export default function Index() {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function MainContent({ shouldHideHeader }) {
|
|
||||||
return (
|
|
||||||
<div className="flex flex-1 flex-col overflow-x-hidden">
|
|
||||||
{!shouldHideHeader && <Header />}
|
|
||||||
<Outlet />
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function Header() {
|
function Header() {
|
||||||
return (
|
return (
|
||||||
<header className="sticky top-0 md:hidden">
|
<header className="sticky top-0 md:hidden z-10 backdrop-blur-lg">
|
||||||
<LogoHeader />
|
<LogoHeader />
|
||||||
<AccountHeader />
|
<AccountHeader />
|
||||||
</header>
|
</header>
|
||||||
|
Loading…
Reference in New Issue
Block a user