sidebar changes

This commit is contained in:
nvrl committed 2026-05-05 22:25:12 +02:00
1 parent 5da8ead2ff
commit 683354ec93
1 file changed
+18 -16
+18 -16
View File
@@ -70,8 +70,8 @@ const App: React.FC = () => {
const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null); const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
const [notifAnchorEl, setNotifAnchorEl] = useState<null | HTMLElement>(null); const [notifAnchorEl, setNotifAnchorEl] = useState<null | HTMLElement>(null);
const [categories, setCategories] = useState<{ name: string; slug: string }[]>([]); const [categories, setCategories] = useState<{ name: string; slug: string }[]>([]);
const [drawerOpen, setDrawerOpen] = useState(false);
const isMobile = useMediaQuery(muiTheme.breakpoints.down('md')); const isMobile = useMediaQuery(muiTheme.breakpoints.down('md'));
const [drawerOpen, setDrawerOpen] = useState(!isMobile);
useEffect(() => { useEffect(() => {
api api
@@ -110,8 +110,8 @@ const App: React.FC = () => {
const hamburger = ( const hamburger = (
<IconButton <IconButton
color="inherit" color="inherit"
onClick={() => setDrawerOpen(true)} onClick={() => setDrawerOpen((o) => !o)}
aria-label="open navigation" aria-label="toggle navigation"
sx={{ mx: 0.5 }} sx={{ mx: 0.5 }}
> >
<MenuIcon /> <MenuIcon />
@@ -217,7 +217,7 @@ const App: React.FC = () => {
}} }}
> >
<GlassAppBar> <GlassAppBar>
{isMobile && mobileAnchor === 'left' && hamburger} {mobileAnchor === 'left' && hamburger}
<Typography <Typography
variant="h6" variant="h6"
@@ -292,23 +292,25 @@ const App: React.FC = () => {
</> </>
)} )}
{isMobile && mobileAnchor === 'right' && hamburger} {mobileAnchor === 'right' && hamburger}
</Box> </Box>
</GlassAppBar> </GlassAppBar>
<SwipeableDrawer {isMobile && (
anchor={mobileAnchor} <SwipeableDrawer
open={drawerOpen} anchor={mobileAnchor}
onOpen={() => setDrawerOpen(true)} open={drawerOpen}
onClose={() => setDrawerOpen(false)} onOpen={() => setDrawerOpen(true)}
disableBackdropTransition onClose={() => setDrawerOpen(false)}
disableDiscovery disableBackdropTransition
> disableDiscovery
<NavSidebar categories={categories} onNavigate={() => setDrawerOpen(false)} /> >
</SwipeableDrawer> <NavSidebar categories={categories} onNavigate={() => setDrawerOpen(false)} />
</SwipeableDrawer>
)}
<Box sx={{ display: 'flex', flexGrow: 1, minHeight: 0 }}> <Box sx={{ display: 'flex', flexGrow: 1, minHeight: 0 }}>
{!isMobile && ( {!isMobile && drawerOpen && (
<Box <Box
component="aside" component="aside"
sx={{ sx={{