From cada7ab6c280921bb947f63b6c84276cdc27983f Mon Sep 17 00:00:00 2001
From: Jocadbz <joaquimmadureira@protonmail.com>
Date: Tue, 9 Jun 2026 18:55:03 -0300
Subject: [PATCH] Add empty-state messages to overview page

Grid sections for Racks and Devices now show a dashed 'No X yet' message
when the collection is empty, using Go template {{else}} blocks. CSS
styles the placeholder with muted text and a dashed border.
---
 static/style.css        | 3 +++
 templates/overview.html | 4 ++++
 2 files changed, 7 insertions(+)

diff --git a/static/style.css b/static/style.css
index e3a97eb..4ce3518 100644
--- a/static/style.css
+++ b/static/style.css
@@ -185,3 +185,6 @@ section { margin-bottom: 2em; }
 
 /* TOOLBAR */
 .toolbar { margin-bottom: 1em; }
+
+/* EMPTY STATE */
+.empty-state { padding: 2em 1em; text-align: center; color: var(--text-muted); font-style: italic; border: 1px dashed var(--border); border-radius: 4px; grid-column: 1 / -1; }
diff --git a/templates/overview.html b/templates/overview.html
index e30170e..44aea58 100644
--- a/templates/overview.html
+++ b/templates/overview.html
@@ -11,6 +11,8 @@
     <span>{{.RackType}} / {{.Depth}} / {{.HeightUnits}}U</span>
     {{if .Comment}}<small>{{.Comment}}</small>{{end}}
 </a>
+{{else}}
+<div class="empty-state">No racks yet. Create one below.</div>
 {{end}}
 </div>
 <details>
@@ -33,6 +35,8 @@
     {{if .Model}}<span>{{.Model.Manufacturer}} {{.Model.Name}}</span>{{end}}
     {{if .UsageDescription}}<small>{{.UsageDescription}}</small>{{end}}
 </a>
+{{else}}
+<div class="empty-state">No devices yet. Create one or add a rack first.</div>
 {{end}}
 </div>
 <details>