mitchell/hamlab
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 14 Wiki Activity

Dashboard customize mode: reorder/hide modules and individual rows, layout saved server-side (GET/PUT /api/prefs/dashboard)

Browse Source 
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
Mitchell-Johnson
2026-09-17 13:46:41 -07:00
co-authored by Claude Fable 5.1
parent 7053cce7fe
commit eb70daf129
7 changed files with 351 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/styles.css
+15
View File
@@ -106,3 +106,18 @@ button { font: inherit; color: inherit; background: none; border: 0; cursor: poi
.status { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; }
.rail .group-head.active { background: var(--bg3); box-shadow: inset 3px 0 0 var(--accent); }
@media (max-width: 800px) { .dash { padding: 8px; gap: 8px; } .kpis, .cards { gap: 8px; } .cards { grid-template-columns: 1fr; } }
/* dashboard: customize mode */
.dash-bar { display: flex; align-items: center; gap: 8px; min-height: 28px; }
.dash-bar .hint { color: var(--muted); font-size: 12px; }
.btn { padding: 5px 10px; background: var(--bg3); border: 1px solid var(--border); border-radius: 5px; font-size: 12px; color: var(--fg); }
.btn.on { background: var(--accent); color: #111; border-color: var(--accent); }
.mod-tools { display: flex; gap: 4px; margin: -4px -4px 6px auto; justify-content: flex-end; }
.mod-tools button { padding: 2px 7px; background: var(--bg3); border: 1px solid var(--border); border-radius: 4px; font-size: 12px; color: var(--muted); }
.mod-tools button:hover:not(:disabled) { color: var(--fg); } .mod-tools button:disabled { opacity: .35; cursor: default; }
.editing .tile, .editing .card { border-style: dashed; }
.hide-item { padding: 0 6px; color: var(--muted); font-size: 12px; border-radius: 4px; } .hide-item:hover { color: var(--bad); background: var(--bg3); }
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip { padding: 3px 9px; background: var(--bg3); border: 1px solid var(--border); border-radius: 12px; font-size: 12px; color: var(--muted); }
.chip:hover { color: var(--fg); border-color: var(--accent2); }
.chips.inline { margin-top: 6px; }