v0.8.10
This commit is contained in:
+32
-3
@@ -82,14 +82,15 @@ body { margin: 0; min-height: 100vh; color: var(--text); }
|
||||
button, input, select { font: inherit; }
|
||||
button { cursor: pointer; }
|
||||
button:disabled { opacity: .5; cursor: wait; }
|
||||
.topbar { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 72px; padding: 12px max(18px, env(safe-area-inset-left)); border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--nav-bg) 94%, transparent); backdrop-filter: blur(14px); }
|
||||
.brand { display: flex; align-items: center; min-width: 0; }
|
||||
.topbar { position: sticky; top: 0; z-index: 20; display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: 1rem; min-height: 72px; padding: 12px max(18px, env(safe-area-inset-left)); border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--nav-bg) 94%, transparent); backdrop-filter: blur(14px); }
|
||||
.brand { display: flex; align-items: center; justify-self:start; min-width: 0; }
|
||||
.brand strong, .brand small { display: block; }
|
||||
.brand strong { font-size: 15px; letter-spacing: -.01em; white-space: nowrap; }
|
||||
.brand small { margin-top: 2px; color: var(--muted); font-size: 11px; }
|
||||
.brand.large { margin-bottom: 1rem; }
|
||||
.brand.large strong { font-size: 21px; }
|
||||
.top-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
|
||||
.top-actions { display: flex; align-items: center; justify-content: flex-end; justify-self:end; gap: 7px; }
|
||||
.toolbar-runtime-status { justify-self:center; padding:7px 10px; border:1px solid var(--line); border-radius:999px; color:var(--text-soft); background:var(--surface-muted); font-size:11px; font-weight:750; font-variant-numeric:tabular-nums; white-space:nowrap; }
|
||||
.toolbar-select { width: auto; min-width: 58px; min-height: 40px; padding: 7px 28px 7px 10px; border-radius: 11px; }
|
||||
.theme-select { min-width: 94px; }
|
||||
button { border: 0; border-radius: 13px; padding: 11px 15px; color: var(--text); background: var(--surface-2); transition: transform .15s ease, background .15s ease, opacity .15s ease; }
|
||||
@@ -122,6 +123,7 @@ h3 { margin-bottom: 10px; }
|
||||
.metric span { display: block; margin-bottom: 8px; color: var(--muted); font-size: 12px; }
|
||||
.metric strong { font-size: 24px; letter-spacing: -.03em; }
|
||||
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin: 8px 0 18px; }
|
||||
.section-heading-actions { display:flex; align-items:center; justify-content:flex-end; gap:8px; }
|
||||
.device-grid, .list-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 14px; }
|
||||
.device-card, .panel, .list-card { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
|
||||
.device-card { overflow: hidden; padding: 20px; }
|
||||
@@ -829,6 +831,33 @@ body.simulation-standalone [data-view="simulation"] { min-height:calc(100vh - 36
|
||||
.temporary-active-summary .danger { width:100%; white-space:normal; }
|
||||
}
|
||||
|
||||
/* Dashboard sections: horizontal tabs, one vertically scrollable panel at a time. */
|
||||
.dashboard-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:0 0 12px; padding:6px; border:1px solid var(--line); border-radius:17px; background:var(--surface); }
|
||||
.dashboard-tabs button { min-width:0; min-height:40px; padding:8px 10px; border:1px solid transparent; border-radius:12px; color:var(--muted); background:transparent; font-size:12px; font-weight:750; }
|
||||
.dashboard-tabs button.active { border-color:var(--accent-border); color:var(--accent); background:var(--accent-soft); }
|
||||
.dashboard-tab-panel[hidden] { display:none !important; }
|
||||
.dashboard-tab-panel.active { display:block; animation:reveal .18s ease; }
|
||||
.dashboard-section-panel { margin-bottom:18px; }
|
||||
.dashboard-section-head.compact-head { align-items:center; margin-bottom:12px; }
|
||||
.dashboard-section-head.compact-head h2 { font-size:19px; }
|
||||
.dashboard-section-panel > .device-grid,
|
||||
.dashboard-section-panel > .list-grid,
|
||||
.dashboard-section-panel > .automation-plan-grid { margin-bottom:0; }
|
||||
.notification-alert-types { display:grid; gap:10px; }
|
||||
.notification-alert-types > .field-note { margin:0; }
|
||||
.notification-alert-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 14px; }
|
||||
.notification-alert-grid .check { min-height:36px; }
|
||||
|
||||
@media (max-width:700px) {
|
||||
.topbar { gap:7px; padding-inline:10px; }
|
||||
.toolbar-runtime-status { padding:6px 8px; font-size:10px; }
|
||||
.section-heading { align-items:stretch; flex-direction:column; }
|
||||
.section-heading-actions { display:grid; grid-template-columns:1fr 1fr; width:100%; }
|
||||
.dashboard-tabs { gap:5px; padding:5px; }
|
||||
.dashboard-tabs button { min-height:42px; padding:6px 5px; font-size:10px; line-height:1.15; }
|
||||
.notification-alert-grid { grid-template-columns:1fr; }
|
||||
}
|
||||
|
||||
/* 0.6.9 dashboard density and fit fixes */
|
||||
[data-view="dashboard"] .dashboard-summary-card {
|
||||
min-height:0;
|
||||
|
||||
Reference in New Issue
Block a user