Replace sidebar with responsive app shell

2026-03-21 13:16:19 +01:00
parent 4f1ef770c7
commit b3c846d1ef
8 changed files with 268 additions and 47 deletions
--- a/src/RolemasterDb.App/Components/Shell/AppShell.razor
+++ b/src/RolemasterDb.App/Components/Shell/AppShell.razor
@@ -0,0 +1,41 @@
+<div class="app-shell">
+    <header class="app-shell-header">
+        <div class="app-shell-bar">
+            <div class="app-shell-brand-block">
+                <a class="app-shell-brand" href="/">
+                    <span class="app-shell-brand-mark">RM</span>
+                    <span class="app-shell-brand-copy">
+                        <strong>Rolemaster DB</strong>
+                        <span>Reference and lookup workspace</span>
+                    </span>
+                </a>
+            </div>
+
+            <div class="app-shell-header-nav">
+                <ShellPrimaryNav />
+            </div>
+
+            <div class="app-shell-header-actions">
+                @HeaderActions
+            </div>
+        </div>
+    </header>
+
+    <main id="app-main" class="app-shell-main">
+        <div class="content-shell">
+            @ChildContent
+        </div>
+    </main>
+
+    <nav class="app-shell-mobile-nav" aria-label="Primary">
+        <ShellPrimaryNav IsBottomNav="true" />
+    </nav>
+</div>
+
+@code {
+    [Parameter]
+    public RenderFragment? ChildContent { get; set; }
+
+    [Parameter]
+    public RenderFragment? HeaderActions { get; set; }
+}