diff --git a/static/style.css b/static/style.css index 3455da7..6bc4d83 100644 --- a/static/style.css +++ b/static/style.css @@ -15,6 +15,7 @@ } * { box-sizing: border-box; margin: 0; padding: 0; } +[x-cloak] { display: none !important; } body { background: var(--bg); @@ -571,6 +572,33 @@ textarea:focus { color: var(--text); } +/* ─── Auto-refresh controls ───────────────────────────── */ + +.auto-refresh-controls { + display: inline-flex; + align-items: center; + gap: 8px; + font-size: 0.8em; + color: var(--text-muted); +} +.auto-refresh-controls .label-text { + user-select: none; +} +.interval-select { + background: var(--surface); + color: var(--text-muted); + border: 1px solid var(--border); + border-radius: 4px; + padding: 2px 6px; + font-size: 1em; + font-family: var(--font); +} +.interval-select:focus { outline: none; border-color: var(--accent); } +.interval-select:disabled { opacity: 0.4; cursor: not-allowed; } +.toggle-sm .slider { width: 28px; height: 16px; } +.toggle-sm .slider::after { width: 12px; height: 12px; } +.toggle-sm input:checked + .slider::after { transform: translateX(12px); } + /* ─── Responsive ───────────────────────────────────────── */ @media (max-width: 768px) { diff --git a/templates/web/layout.html b/templates/web/layout.html index a0401b9..f3743d3 100644 --- a/templates/web/layout.html +++ b/templates/web/layout.html @@ -9,13 +9,58 @@ - +

Warpgate

Uptime: {{ uptime }}  |  Config: {{ config_path }}
+
+ Auto-refresh + + +