feat: add conditional close button for sidebar-first variant in mobile navigation
This commit is contained in:
@@ -26,6 +26,7 @@ function CoreAppShellInner({ slots, children }: CoreAppShellInnerProps) {
|
||||
const isDoubleSidebar = features?.withDoubleSidebar;
|
||||
const isTopNav = variant === 'top-nav';
|
||||
const isFooterOffset = variant === 'header-first';
|
||||
const isSidebarFirst = variant === 'sidebar-first';
|
||||
|
||||
// Calculate Navbar Width based on states
|
||||
const navbarWidth = useMemo(() => {
|
||||
@@ -142,14 +143,18 @@ function CoreAppShellInner({ slots, children }: CoreAppShellInnerProps) {
|
||||
</Box>
|
||||
<Box hiddenFrom="sm" h="100%">
|
||||
<Flex direction="column" h="100%">
|
||||
{
|
||||
isSidebarFirst && (
|
||||
<Box p="md" style={{ borderTop: '1px solid var(--mantine-color-default-border)' }}>
|
||||
<Button fullWidth variant="default" onClick={toggleMobile}>
|
||||
Close
|
||||
</Button>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
<Box flex={1} style={{ overflowY: 'auto' }}>
|
||||
{slots.sidebarMobile || slots.sidebar}
|
||||
</Box>
|
||||
<Box p="md" style={{ borderTop: '1px solid var(--mantine-color-default-border)' }}>
|
||||
<Button fullWidth variant="default" onClick={toggleMobile}>
|
||||
Close
|
||||
</Button>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Box>
|
||||
</AppShell.Navbar>
|
||||
|
||||
Reference in New Issue
Block a user