boban
/
nimuli
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(bug-1): eliminate content-area overlap on hard-reload with collapsed sidebar 

Add .nim-content class to main content div and pre-Alpine CSS rules:
- @media min-width:768px .nim-content { margin-left:240px }
- html[data-sidebar-collapsed] .nim-content { margin-left:64px }

The blocking script (FIX-13) already sets data-sidebar-collapsed before first
paint; the new CSS applies the matching margin before Alpine initializes.
Also fix skel-topbar left position for collapsed state (was always 240px).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
main
boban 2026-05-16 18:55:26 +02:00
parent 436d80a097
commit 326caa51ce
1 changed files with 6 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
resources/views/layouts/nimuli-app.blade.php
View File

@ -88,6 +88,11 @@
z-index: 10; z-index: 10;
} }
html[data-sidebar-collapsed] .skel-sidebar { width: 64px; } html[data-sidebar-collapsed] .skel-sidebar { width: 64px; }
html[data-sidebar-collapsed] .skel-topbar { left: 64px; }
@media (min-width: 768px) {
.nim-content { margin-left: 240px; }
html[data-sidebar-collapsed] .nim-content { margin-left: 64px; }
}
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; }
@ -126,7 +131,7 @@
<!-- Main content area: shifts right based on sidebar width --> <!-- Main content area: shifts right based on sidebar width -->
<div <div
class="flex flex-col min-h-screen transition-[margin-left] duration-200 ease-in-out" class="nim-content flex flex-col min-h-screen transition-[margin-left] duration-200 ease-in-out"
:class="$store.sidebar?.collapsed ? 'md:ml-16' : 'md:ml-60'" :class="$store.sidebar?.collapsed ? 'md:ml-16' : 'md:ml-60'"
> >
@persist('topbar') @persist('topbar')