watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2026-02-15 10:05:36 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Keep sidenav menu scrollable with fixed user footer

Browse source
This commit is contained in:
Mike Cao 2026-02-12 17:46:31 -08:00
parent fee155c65b
commit 9e9e44519d
2 changed files with 20 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/app/(main)/App.tsx
View file

@ -47,10 +47,10 @@ export function App({ children }) {
<Row display={{ base: 'flex', lg: 'none' }} alignItems="center" gap padding="3">
<MobileNav />
</Row>
<Column display={{ base: 'none', lg: 'flex' }}>
<Column display={{ base: 'none', lg: 'flex' }} minHeight="0" style={{ overflow: 'hidden' }}>
<SideNav />
</Column>
<Column overflowX="hidden" position="relative">
<Column overflowX="hidden" minHeight="0" position="relative">
<TopNav />
<Column alignItems="center">{children}</Column>
</Column>

36
src/app/(main)/SideNav.tsx
View file

@ -54,11 +54,11 @@ export function SideNav(props: any) {
<Column
{...props}
backgroundColor="surface-base"
justifyContent="space-between"
border
borderRadius
paddingX="2"
height="100%"
flexGrow="1"
minHeight="0"
margin="2"
style={{
width: isCollapsed ? '55px' : '240px',
@ -66,22 +66,22 @@ export function SideNav(props: any) {
overflow: 'hidden',
}}
>
<Column style={{ minHeight: 0, overflowY: 'auto', overflowX: 'hidden' }}>
<Row
alignItems="center"
justifyContent="space-between"
height="60px"
style={{ flexShrink: 0 }}
>
<Row paddingX="3" alignItems="center" justifyContent="space-between" flexGrow={1}>
{!isCollapsed && (
<IconLabel icon={<Logo />}>
<Text weight="bold">umami</Text>
</IconLabel>
)}
<PanelButton />
</Row>
<Row
alignItems="center"
justifyContent="space-between"
height="60px"
style={{ flexShrink: 0 }}
>
<Row paddingX="3" alignItems="center" justifyContent="space-between" flexGrow="1">
{!isCollapsed && (
<IconLabel icon={<Logo />}>
<Text weight="bold">umami</Text>
</IconLabel>
)}
<PanelButton />
</Row>
</Row>
<Column flexGrow="1" minHeight="0" style={{ overflowY: 'auto', overflowX: 'hidden' }}>
{websiteId ? (
<WebsiteNav websiteId={websiteId} isCollapsed={isCollapsed} />
) : pathname.includes('/settings') ? (
@ -117,7 +117,7 @@ export function SideNav(props: any) {
</Column>
)}
</Column>
<Row marginBottom="4">
<Row marginBottom="4" style={{ flexShrink: 0 }}>
<UserButton showText={!isCollapsed} />
</Row>
</Column>