60 lines
2.2 KiB
CSS
60 lines
2.2 KiB
CSS
/* Small additions Pico's classless build doesn't cover: color-coded state
|
|
badges, the error banner, and a compact stat-tile grid for the overview
|
|
page. Everything else relies on Pico's classless defaults. */
|
|
|
|
.badge {
|
|
display: inline-block;
|
|
padding: 0.15rem 0.55rem;
|
|
border-radius: 999px;
|
|
font-size: 0.8rem;
|
|
font-weight: 600;
|
|
line-height: 1.4;
|
|
white-space: nowrap;
|
|
}
|
|
.badge-queued { background: #e2e8f0; color: #334155; }
|
|
.badge-inprogress { background: #dbeafe; color: #1d4ed8; }
|
|
.badge-pass { background: #dcfce7; color: #15803d; }
|
|
.badge-partial { background: #ffedd5; color: #c2410c; }
|
|
.badge-fail { background: #fee2e2; color: #b91c1c; }
|
|
.badge-cancelled { background: #ede9fe; color: #6d28d9; }
|
|
.badge-idle { background: #dcfce7; color: #15803d; }
|
|
.badge-unreachable { background: #fee2e2; color: #b91c1c; }
|
|
.badge-unregistered { background: #e2e8f0; color: #334155; }
|
|
|
|
.stat-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
|
|
gap: 1rem;
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.stat-tile {
|
|
border: 1px solid var(--pico-muted-border-color, #ddd);
|
|
border-radius: 0.5rem;
|
|
padding: 0.75rem 1rem;
|
|
text-align: center;
|
|
}
|
|
.stat-tile .value { display: block; font-size: 1.6rem; font-weight: 700; }
|
|
.stat-tile .label { display: block; font-size: 0.8rem; opacity: 0.75; }
|
|
|
|
#error-banner:empty { display: none; }
|
|
.error-banner {
|
|
padding: 0.6rem 1rem;
|
|
margin-bottom: 1rem;
|
|
border-radius: 0.4rem;
|
|
font-size: 0.9rem;
|
|
}
|
|
.error-banner-client { background: #fef9c3; color: #854d0e; border: 1px solid #fde68a; }
|
|
.error-banner-server { background: #fee2e2; color: #991b1b; border: 1px solid #fecaca; }
|
|
|
|
nav.dashboard-nav ul { display: flex; gap: 1.25rem; list-style: none; padding: 0; margin: 0 0 1.5rem 0; }
|
|
nav.dashboard-nav a[aria-current="page"] { font-weight: 700; text-decoration: underline; }
|
|
|
|
.actions-cell { white-space: nowrap; }
|
|
.actions-cell button { margin-right: 0.35rem; font-size: 0.85rem; padding: 0.25rem 0.6rem; }
|
|
.actions-cell button.secondary { --pico-primary-background: #64748b; }
|
|
.actions-cell button.contrast { --pico-primary-background: #b91c1c; }
|
|
|
|
table.compact th, table.compact td { padding: 0.4rem 0.6rem; }
|
|
|
|
.muted { opacity: 0.65; font-size: 0.85rem; }
|