From 12396a81c5c059e6aec9c7d177b229ea2fdd5119 Mon Sep 17 00:00:00 2001
From: Ashwin Kumar <ashwin@ashwins-air.home>
Date: Thu, 19 Mar 2026 21:08:17 +0100
Subject: [PATCH] style(dashboard-builder): align builder page shells with next
 layout

---
 .../external-dashboard-management/index.tsx   | 19 +++++++++++++++++--
 .../internal-dashboard-management/index.tsx   | 19 +++++++++++++++++--
 2 files changed, 34 insertions(+), 4 deletions(-)

diff --git a/src/routes/admin/external-dashboard-management/index.tsx b/src/routes/admin/external-dashboard-management/index.tsx
index 6d9fa35..82d7e09 100644
--- a/src/routes/admin/external-dashboard-management/index.tsx
+++ b/src/routes/admin/external-dashboard-management/index.tsx
@@ -239,12 +239,27 @@ export default function ExternalDashboardManagementPage() {
 
   return (
     <AdminShell>
+      <div class="page-hero-card page-actions">
+        <div>
+          <h1 class="page-title">External Dashboard Management</h1>
+          <p class="page-subtitle">Use the tabs and open one external dashboard at a time from the list below.</p>
+        </div>
+        <a class="btn" href="/admin">Back to Dashboard</a>
+      </div>
+
+      <div class="admin-link-tabs" style="margin-bottom:14px">
+        <a class="admin-link-tab active" href="#builder">View Dashboards</a>
+        <a class="admin-link-tab" href="#builder">Open Builder</a>
+      </div>
+
+      <div id="builder" />
+
       {/* ---------- List View ---------- */}
       <Show when={!selected()}>
         <div class="page-actions">
           <div>
-            <h1 class="page-title">External Dashboard Management</h1>
-            <p class="page-subtitle">Build and manage external role dashboards — sidebar labels, modules, and default routes.</p>
+            <h2 class="page-title" style="font-size:20px">External Dashboard List</h2>
+            <p class="page-subtitle">Choose one external role dashboard to open in the builder, or create a new one.</p>
           </div>
           <button class="btn navy" onClick={createDashboard} disabled={creating()}>
             {creating() ? 'Creating...' : 'Create External Dashboard'}
diff --git a/src/routes/admin/internal-dashboard-management/index.tsx b/src/routes/admin/internal-dashboard-management/index.tsx
index b12594e..2de710c 100644
--- a/src/routes/admin/internal-dashboard-management/index.tsx
+++ b/src/routes/admin/internal-dashboard-management/index.tsx
@@ -279,11 +279,26 @@ export default function InternalDashboardManagementPage() {
   // ---------- List view ----------
   return (
     <AdminShell>
+      <div class="page-hero-card page-actions">
+        <div>
+          <h1 class="page-title">Internal Dashboard Management</h1>
+          <p class="page-subtitle">Use the tabs and open one internal dashboard at a time from the list below.</p>
+        </div>
+        <a class="btn" href="/admin">Back to Dashboard</a>
+      </div>
+
+      <div class="admin-link-tabs" style="margin-bottom:14px">
+        <a class="admin-link-tab active" href="#builder">View Dashboards</a>
+        <a class="admin-link-tab" href="#builder">Open Builder</a>
+      </div>
+
+      <div id="builder" />
+
       <Show when={!selected()}>
         <div class="page-actions">
           <div>
-            <h1 class="page-title">Internal Dashboard Management</h1>
-            <p class="page-subtitle">Build and manage internal role dashboards — sidebar, sections, tabs, fields, and widgets.</p>
+            <h2 class="page-title" style="font-size:20px">Internal Dashboard List</h2>
+            <p class="page-subtitle">Choose one internal dashboard to open in the builder, or create a new dashboard for an internal role.</p>
           </div>
           <button class="btn navy" onClick={createDashboard} disabled={creating()}>
             {creating() ? 'Creating...' : 'Create Internal Dashboard'}