diff options
| author | Copilot <198982749+Copilot@users.noreply.github.com> | 2025-11-07 19:58:44 +0100 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2025-11-07 19:58:44 +0100 |
| commit | febe700d4564e5c0fec0dfbda7dcfcdff0af589b (patch) | |
| tree | edfbc079b70bf7ae831851804f87b1a409633a4f /src/frontend/app/components/ServiceAlerts.css | |
| parent | d08e350a4b44c755f65d50227329e212efafb1b2 (diff) | |
[WIP] Fix stop alert colours in dark mode and consolidate styling (#84)
Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: arielcostas <94913521+arielcostas@users.noreply.github.com>
Diffstat (limited to 'src/frontend/app/components/ServiceAlerts.css')
| -rw-r--r-- | src/frontend/app/components/ServiceAlerts.css | 39 |
1 files changed, 9 insertions, 30 deletions
diff --git a/src/frontend/app/components/ServiceAlerts.css b/src/frontend/app/components/ServiceAlerts.css index 484b45b..7c271f9 100644 --- a/src/frontend/app/components/ServiceAlerts.css +++ b/src/frontend/app/components/ServiceAlerts.css @@ -13,42 +13,21 @@ } .service-alert.info { - background-color: #e3f2fd; - border-color: #2196f3; - color: #0d47a1; + background-color: var(--alert-info-bg); + border-color: var(--alert-info-border); + color: var(--alert-info-text); } .service-alert.warning { - background-color: #fff3e0; - border-color: #ff9800; - color: #e65100; + background-color: var(--alert-warning-bg); + border-color: var(--alert-warning-border); + color: var(--alert-warning-text); } .service-alert.error { - background-color: #ffebee; - border-color: #f44336; - color: #b71c1c; -} - -/* Dark mode adjustments */ -@media (prefers-color-scheme: dark) { - .service-alert.info { - background-color: #0d47a1; - border-color: #2196f3; - color: #e3f2fd; - } - - .service-alert.warning { - background-color: #e65100; - border-color: #ff9800; - color: #fff3e0; - } - - .service-alert.error { - background-color: #b71c1c; - border-color: #f44336; - color: #ffebee; - } + background-color: var(--alert-error-bg); + border-color: var(--alert-error-border); + color: var(--alert-error-text); } .alert-icon { |