From 33a749c8d1e171898ceefeef8f49e79c69f4a8ad Mon Sep 17 00:00:00 2001
From: librelad <librelad@digitalangels.vip>
Date: Fri, 29 May 2026 00:20:09 +0100
Subject: [PATCH] =?UTF-8?q?ux(admin):=20rename=20Overview=20=E2=86=92=20Da?=
 =?UTF-8?q?shboard=20+=20add=20header=20icons?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Renames the Admin landing to "Dashboard" in both the page title and the sidebar
label, and adds a leading header icon (the grid icon, matching the Backup
dashboard) via the shared .page-header-icon-slot. System gets a cpu icon in its
header too. The slot styles come from the globally-loaded backup.css, so no new
CSS is needed.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Signed-off-by: librelad <librelad@digitalangels.vip>
---
 .../libreportal/frontend/js/components/admin/admin-overview.js | 3 ++-
 .../libreportal/frontend/js/components/admin/admin-system.js   | 1 +
 .../frontend/js/components/config/config-sidebar.js            | 2 +-
 3 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/containers/libreportal/frontend/js/components/admin/admin-overview.js b/containers/libreportal/frontend/js/components/admin/admin-overview.js
index e0ea8d9..10722b5 100644
--- a/containers/libreportal/frontend/js/components/admin/admin-overview.js
+++ b/containers/libreportal/frontend/js/components/admin/admin-overview.js
@@ -233,9 +233,10 @@ class AdminOverview {
         root.innerHTML = `
             <div class="admin-page">
                 <div class="page-header config-page-header">
+                    <div class="page-header-icon-slot"><svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="7" height="9"></rect><rect x="14" y="3" width="7" height="5"></rect><rect x="14" y="12" width="7" height="9"></rect><rect x="3" y="16" width="7" height="5"></rect></svg></div>
                     <div class="page-header-title">
                         <div class="admin-breadcrumb">Admin</div>
-                        <h1>Overview</h1>
+                        <h1>Dashboard</h1>
                         <p>System health and admin status at a glance. Manage anything from the cards below.</p>
                     </div>
                 </div>
diff --git a/containers/libreportal/frontend/js/components/admin/admin-system.js b/containers/libreportal/frontend/js/components/admin/admin-system.js
index 5e735e1..03cd48a 100644
--- a/containers/libreportal/frontend/js/components/admin/admin-system.js
+++ b/containers/libreportal/frontend/js/components/admin/admin-system.js
@@ -324,6 +324,7 @@ class AdminSystem {
         root.innerHTML = `
             <div class="admin-page sys-page">
                 <div class="page-header config-page-header">
+                    <div class="page-header-icon-slot"><svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="4" y="4" width="16" height="16" rx="2"></rect><rect x="9" y="9" width="6" height="6"></rect><line x1="9" y1="1" x2="9" y2="4"></line><line x1="15" y1="1" x2="15" y2="4"></line><line x1="9" y1="20" x2="9" y2="23"></line><line x1="15" y1="20" x2="15" y2="23"></line><line x1="20" y1="9" x2="23" y2="9"></line><line x1="20" y1="14" x2="23" y2="14"></line><line x1="1" y1="9" x2="4" y2="9"></line><line x1="1" y1="14" x2="4" y2="14"></line></svg></div>
                     <div class="page-header-title">
                         <div class="admin-breadcrumb">Admin</div>
                         <h1>System</h1>
diff --git a/containers/libreportal/frontend/js/components/config/config-sidebar.js b/containers/libreportal/frontend/js/components/config/config-sidebar.js
index 9d81402..3a9f4b7 100755
--- a/containers/libreportal/frontend/js/components/config/config-sidebar.js
+++ b/containers/libreportal/frontend/js/components/config/config-sidebar.js
@@ -24,7 +24,7 @@ class ConfigSidebar {
     const overviewItem = document.createElement('div');
     overviewItem.className = 'category';
     overviewItem.setAttribute('data-category', 'overview');
-    overviewItem.innerHTML = '<svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="2" style="margin-right:8px;vertical-align:middle"><rect x="3" y="3" width="7" height="9"></rect><rect x="14" y="3" width="7" height="5"></rect><rect x="14" y="12" width="7" height="9"></rect><rect x="3" y="16" width="7" height="5"></rect></svg> Overview';
+    overviewItem.innerHTML = '<svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="2" style="margin-right:8px;vertical-align:middle"><rect x="3" y="3" width="7" height="9"></rect><rect x="14" y="3" width="7" height="5"></rect><rect x="14" y="12" width="7" height="9"></rect><rect x="3" y="16" width="7" height="5"></rect></svg> Dashboard';
     overviewItem.addEventListener('click', function () {
       window.history.pushState({}, '', window.adminPath('overview'));
       document.querySelectorAll('.category').forEach(function (item) { item.classList.remove('active'); });