From b241df93a8c291642b2d66d2d493d0aed456c240 Mon Sep 17 00:00:00 2001 From: boban Date: Sun, 17 May 2026 13:14:47 +0200 Subject: [PATCH] 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 --- resources/views/layouts/nimuli-app.blade.php | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/resources/views/layouts/nimuli-app.blade.php b/resources/views/layouts/nimuli-app.blade.php index 77e54b4..6db1fd5 100644 --- a/resources/views/layouts/nimuli-app.blade.php +++ b/resources/views/layouts/nimuli-app.blade.php @@ -95,12 +95,14 @@ html[data-sidebar-collapsed] .nim-content { margin-left: 55px; } html[data-sidebar-collapsed] .sidebar-aside { width: 4rem; } } - /* Sidebar collapsed/expanded visibility — CSS-driven, bypasses persist Alpine issue */ - html[data-sidebar-collapsed] .nim-sb-expanded { display: none !important; } + /* Sidebar collapse visibility — desktop only; mobile always shows expanded state */ .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; } - html[data-sidebar-collapsed] .sidebar-nav-link { justify-content: center; padding-left: 0.5rem; padding-right: 0.5rem; gap: 0; } + @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; } + } body.app-ready .app-spinner, body.app-ready .skel-sidebar, body.app-ready .skel-topbar { display: none; }