ico/pingql
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

test: change status page look

Browse Source
This commit is contained in:
nate
2026-04-09 20:23:20 +04:00
parent c8715bb9aa
commit 3e8c13b712
2 changed files with 24 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/status/src/static/app.css
+7 -2
View File
@@ -41,8 +41,9 @@ h1 { font-size: 1.75rem; font-weight: 700; margin: 0 0 0.5rem; }
.json-link:hover { color: #60a5fa; }
.rss-link:hover { color: #f59e0b; }
.muted { color: var(--muted); font-size: 0.875rem; }
.overall { padding: 1rem 1.25rem; border-radius: 10px; color: var(--overall-fg); font-weight: 600; font-size: 1rem; margin: 1.5rem 0 2rem; display: flex; align-items: center; gap: 0.75rem; }
.overall .dot { width: 12px; height: 12px; border-radius: 50%; background: var(--overall-fg); opacity: 0.9; }
.overall { padding: 1rem 1.25rem; border-radius: 10px; font-weight: 600; font-size: 1rem; margin: 1.5rem 0 2rem; display: flex; align-items: center; gap: 0.75rem; border: 1px solid; }
.overall .dot { width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0; animation: pulse-dot 2s ease-in-out infinite; }
@keyframes pulse-dot { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
.group-title { font-size: 0.85rem; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: 0.05em; margin: 2rem 0 0.75rem; }
.monitors { display: flex; flex-direction: column; gap: 0.5rem; }
/* All monitors share one structure: a clickable header row + a collapsible
@@ -54,6 +55,10 @@ h1 { font-size: 1.75rem; font-weight: 700; margin: 0 0 0.5rem; }
.monitor-name .name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.monitor-meta { display: flex; gap: 1rem; align-items: center; font-size: 0.85rem; color: var(--muted); }
.uptime-pct { font-variant-numeric: tabular-nums; font-weight: 600; color: var(--fg); }
.uptime-pct.good { color: var(--bar-up); }
.uptime-pct.warn { color: var(--bar-partial); }
.uptime-pct.bad { color: var(--bar-down); }
.uptime-pct.empty { color: var(--muted); }
.maintenance-pill {
display: inline-flex; align-items: center; gap: 0.3rem;
padding: 0.15rem 0.55rem; border-radius: 999px;