diff options
| author | Copilot <198982749+Copilot@users.noreply.github.com> | 2025-11-06 20:34:36 +0100 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2025-11-06 20:34:36 +0100 |
| commit | a24639e17b63c5ebb9b2bb26af18e17302e9360b (patch) | |
| tree | 3301a4f8f278cab61696b2cd0212cb71e0676363 /src/frontend/app/components/StopAlert.css | |
| parent | 9a2e46b6e8f0decbd1995c14d34b0b8c0d663b49 (diff) | |
Add manual stop creation and override alerts with alternate stop codes (#74)
Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: arielcostas <94913521+arielcostas@users.noreply.github.com>
Co-authored-by: Ariel Costas Guerrero <ariel@costas.dev>
Diffstat (limited to 'src/frontend/app/components/StopAlert.css')
| -rw-r--r-- | src/frontend/app/components/StopAlert.css | 89 |
1 files changed, 89 insertions, 0 deletions
diff --git a/src/frontend/app/components/StopAlert.css b/src/frontend/app/components/StopAlert.css new file mode 100644 index 0000000..0032d09 --- /dev/null +++ b/src/frontend/app/components/StopAlert.css @@ -0,0 +1,89 @@ +.stop-alert { + display: flex; + align-items: flex-start; + gap: 0.75rem; + padding: 0.75rem; + border-radius: 0.5rem; + margin: 0.75rem 0; + border: 1px solid; +} + +.stop-alert-info { + background-color: rgba(59, 130, 246, 0.1); + border-color: rgba(59, 130, 246, 0.3); + color: #1e40af; +} + +.stop-alert-error { + background-color: rgba(239, 68, 68, 0.1); + border-color: rgba(239, 68, 68, 0.3); + color: #991b1b; +} + +.stop-alert-compact { + padding: 0.5rem; + margin: 0.5rem 0; + font-size: 0.875rem; +} + +.stop-alert-icon { + flex-shrink: 0; + width: 1.25rem; + height: 1.25rem; +} + +.stop-alert-compact .stop-alert-icon { + width: 1rem; + height: 1rem; +} + +.stop-alert-content { + flex: 1; + display: flex; + flex-direction: column; + gap: 0.25rem; +} + +.stop-alert-title { + font-weight: 600; + font-size: 0.95rem; +} + +.stop-alert-compact .stop-alert-title { + font-size: 0.85rem; +} + +.stop-alert-message { + font-size: 0.9rem; + opacity: 0.9; +} + +.stop-alert-compact .stop-alert-message { + font-size: 0.8rem; +} + +.stop-alert-alternate-codes { + font-size: 0.85rem; + margin-top: 0.25rem; + font-style: italic; + opacity: 0.8; +} + +.stop-alert-compact .stop-alert-alternate-codes { + font-size: 0.75rem; +} + +/* Dark mode support */ +@media (prefers-color-scheme: dark) { + .stop-alert-info { + background-color: rgba(59, 130, 246, 0.15); + border-color: rgba(59, 130, 246, 0.4); + color: #93c5fd; + } + + .stop-alert-error { + background-color: rgba(239, 68, 68, 0.15); + border-color: rgba(239, 68, 68, 0.4); + color: #fca5a5; + } +} |