From d2d43e109766f0e8d7b3e98b0ef2de27d459d753 Mon Sep 17 00:00:00 2001 From: boban Date: Sun, 17 May 2026 13:40:16 +0200 Subject: [PATCH] =?UTF-8?q?feat(BUG-2):=20redesign=20sidebar=20from=20temp?= =?UTF-8?q?late=20=E2=80=94=20Geist=20font,=20section=20nav,=20CSS-driven?= =?UTF-8?q?=20collapse?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Implement user-provided template design: - Split nav into Workspace / Account sections with labels - New CSS design tokens (--nim-*) for sidebar without breaking app vars - Active indicator: left glow bar via ::before, CSS class nim-nav-active - Collapsed tooltip via CSS ::after content: attr(data-label) - Geist font for sidebar via Google Fonts - 264px expanded / 72px collapsed sidebar widths - All collapse state driven by html[data-sidebar-collapsed] critical CSS (no Alpine reactivity needed, works across @persist boundary) - Mobile: always full expanded sidebar regardless of collapse state - Icon partial at partials/sidebar-icon with 24px viewBox icons Co-Authored-By: Claude Sonnet 4.6 --- resources/views/components/sidebar.blade.php | 472 ++++++++---------- resources/views/layouts/nimuli-app.blade.php | 163 ++++-- .../views/partials/sidebar-icon.blade.php | 22 + 3 files changed, 341 insertions(+), 316 deletions(-) create mode 100644 resources/views/partials/sidebar-icon.blade.php diff --git a/resources/views/components/sidebar.blade.php b/resources/views/components/sidebar.blade.php index 87dd5e1..8fa7363 100644 --- a/resources/views/components/sidebar.blade.php +++ b/resources/views/components/sidebar.blade.php @@ -1,187 +1,140 @@ @php $workspace = current_workspace(); $workspaces = auth()->check() ? auth()->user()->workspaces()->orderBy('name')->get() : collect(); - $wsUlid = $workspace?->ulid; - $nav = $workspace ? [ - [ - 'label' => 'Dashboard', - 'route' => 'w.dashboard', - 'params' => [$wsUlid], - 'match' => 'w.dashboard', - 'icon' => 'dashboard', - ], - [ - 'label' => 'Links', - 'route' => 'w.links.index', - 'params' => [$wsUlid], - 'match' => 'w.links.*', - 'icon' => 'links', - ], - [ - 'label' => 'QR Codes', - 'route' => 'w.qr.index', - 'params' => [$wsUlid], - 'match' => 'w.qr.*', - 'icon' => 'qr', - ], - [ - 'label' => 'Link-in-Bio', - 'route' => 'w.bio.index', - 'params' => [$wsUlid], - 'match' => 'w.bio.*', - 'icon' => 'bio', - ], - [ - 'label' => 'Analytics', - 'route' => 'w.analytics.index', - 'params' => [$wsUlid], - 'match' => 'w.analytics.*', - 'icon' => 'analytics', - ], - [ - 'label' => 'Domains', - 'route' => 'w.domains.index', - 'params' => [$wsUlid], - 'match' => 'w.domains.*', - 'icon' => 'domains', - ], - [ - 'label' => 'Settings', - 'route' => 'w.settings.index', - 'params' => [$wsUlid], - 'match' => 'w.settings.*', - 'icon' => 'settings', - ], - [ - 'label' => 'Billing', - 'route' => 'w.billing.index', - 'params' => [$wsUlid], - 'match' => 'w.billing.*', - 'icon' => 'billing', - ], - [ - 'label' => 'Team', - 'route' => 'w.team.index', - 'params' => [$wsUlid], - 'match' => 'w.team.*', - 'icon' => 'team', - ], - [ - 'label' => 'AI', - 'route' => 'w.ai.insights', - 'params' => [$wsUlid], - 'match' => 'w.ai.*', - 'icon' => 'ai', - ], + $wsNav = $workspace ? [ + ['label' => 'Dashboard', 'route' => 'w.dashboard', 'params' => [$wsUlid], 'match' => 'w.dashboard', 'icon' => 'dashboard', 'exact' => true], + ['label' => 'Links', 'route' => 'w.links.index', 'params' => [$wsUlid], 'match' => 'w.links.*', 'icon' => 'links'], + ['label' => 'QR Codes', 'route' => 'w.qr.index', 'params' => [$wsUlid], 'match' => 'w.qr.*', 'icon' => 'qr'], + ['label' => 'Link-in-Bio','route' => 'w.bio.index', 'params' => [$wsUlid], 'match' => 'w.bio.*', 'icon' => 'bio'], + ['label' => 'Analytics', 'route' => 'w.analytics.index','params' => [$wsUlid], 'match' => 'w.analytics.*', 'icon' => 'analytics'], + ['label' => 'Domains', 'route' => 'w.domains.index', 'params' => [$wsUlid], 'match' => 'w.domains.*', 'icon' => 'domains'], ] : [ - [ - 'label' => 'Dashboard', - 'route' => 'dashboard', - 'params' => [], - 'match' => 'dashboard', - 'icon' => 'dashboard', - ], + ['label' => 'Dashboard', 'route' => 'dashboard', 'params' => [], 'match' => 'dashboard', 'icon' => 'dashboard', 'exact' => true], ]; - // Plan usage - $plan = $workspace?->plan; + $accountNav = $workspace ? [ + ['label' => 'Settings', 'route' => 'w.settings.index', 'params' => [$wsUlid], 'match' => 'w.settings.*', 'icon' => 'settings'], + ['label' => 'Billing', 'route' => 'w.billing.index', 'params' => [$wsUlid], 'match' => 'w.billing.*', 'icon' => 'billing'], + ['label' => 'Team', 'route' => 'w.team.index', 'params' => [$wsUlid], 'match' => 'w.team.*', 'icon' => 'team'], + ['label' => 'AI', 'route' => 'w.ai.insights', 'params' => [$wsUlid], 'match' => 'w.ai.*', 'icon' => 'ai'], + ] : []; + + $plan = $workspace?->plan; $linksUsed = $workspace ? $workspace->links()->count() : 0; $linkLimit = $plan?->link_limit ?? 50; - $usagePct = $linkLimit > 0 ? min(100, round(($linksUsed / $linkLimit) * 100)) : 0; + $usagePct = $linkLimit > 0 ? min(100, round(($linksUsed / $linkLimit) * 100)) : 0; - // User initials $userName = auth()->user()?->name ?? ''; $initials = collect(explode(' ', trim($userName)))->map(fn($w) => strtoupper(substr($w, 0, 1)))->take(2)->implode(''); @endphp diff --git a/resources/views/layouts/nimuli-app.blade.php b/resources/views/layouts/nimuli-app.blade.php index 6db1fd5..eec2bd3 100644 --- a/resources/views/layouts/nimuli-app.blade.php +++ b/resources/views/layouts/nimuli-app.blade.php @@ -14,6 +14,9 @@ + + +