Kieran/snort
5
14
Fork 14
Code Issues 54 Pull Requests 1 Packages Projects Releases 24 Wiki Activity

sticky header in mobile size
Some checks failed
continuous-integration/drone/pr Build is failing
Details

Browse Source
This commit is contained in:
Martti Malmi 2023-11-22 15:02:45 +02:00
parent 28bf0ea581
commit e788e01c6d
1 changed files with 5 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
packages/app/src/Pages/Layout/index.tsx
View File

@ -56,9 +56,12 @@ export default function Index() {
return (
<div className="h-screen flex justify-center">
<div className={`${pageClass} w-full max-w-screen-xl overflow-x-hidden`}>
{!shouldHideHeader && <Header />}
<div className="flex flex-row w-full">
<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" />
</div>
<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() {
return (
<header className="sticky top-0 md:hidden">
<header className="sticky top-0 md:hidden z-10 backdrop-blur-lg">
<LogoHeader />
<AccountHeader />
</header>