fix(BUG-2): scope sidebar collapse CSS to desktop media query

nim-sb-expanded/nim-sb-collapsed/sidebar-nav-link collapse rules were
applied globally. On mobile, switching from a desktop-collapsed state
hid all nav labels because data-sidebar-collapsed was still set.
Wrap the rules in @media (min-width: 768px) so mobile always shows
the full expanded sidebar regardless of collapse state.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
main
boban 2026-05-17 13:14:47 +02:00
parent 3c24c19b19
commit b241df93a8
1 changed files with 6 additions and 4 deletions

View File

@ -95,12 +95,14 @@
html[data-sidebar-collapsed] .nim-content { margin-left: 55px; } html[data-sidebar-collapsed] .nim-content { margin-left: 55px; }
html[data-sidebar-collapsed] .sidebar-aside { width: 4rem; } html[data-sidebar-collapsed] .sidebar-aside { width: 4rem; }
} }
/* Sidebar collapsed/expanded visibility — CSS-driven, bypasses persist Alpine issue */ /* Sidebar collapse visibility — desktop only; mobile always shows expanded state */
html[data-sidebar-collapsed] .nim-sb-expanded { display: none !important; }
.nim-sb-collapsed { display: none !important; } .nim-sb-collapsed { display: none !important; }
html[data-sidebar-collapsed] .nim-sb-collapsed { display: flex !important; }
.sidebar-nav-link { gap: 0.75rem; padding-left: 0.75rem; padding-right: 0.75rem; } .sidebar-nav-link { gap: 0.75rem; padding-left: 0.75rem; padding-right: 0.75rem; }
@media (min-width: 768px) {
html[data-sidebar-collapsed] .nim-sb-expanded { display: none !important; }
html[data-sidebar-collapsed] .nim-sb-collapsed { display: flex !important; }
html[data-sidebar-collapsed] .sidebar-nav-link { justify-content: center; padding-left: 0.5rem; padding-right: 0.5rem; gap: 0; } html[data-sidebar-collapsed] .sidebar-nav-link { justify-content: center; padding-left: 0.5rem; padding-right: 0.5rem; gap: 0; }
}
body.app-ready .app-spinner, body.app-ready .app-spinner,
body.app-ready .skel-sidebar, body.app-ready .skel-sidebar,
body.app-ready .skel-topbar { display: none; } body.app-ready .skel-topbar { display: none; }