refactor(ui): use CSS variable for turquoise in flash animations

Replaces hardcoded rgba(0,199,177,...) with color-mix using
var(--color-turquoise) for dark mode compatibility.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-07 11:58:04 +02:00
parent e01ef56c48
commit 10fdaf7d00
2 changed files with 5 additions and 5 deletions

View File

@@ -38,7 +38,7 @@ let sorted = $derived([...blocks].sort((a, b) => a.sortOrder - b.sortOrder));
<style>
@keyframes flash {
0% {
background-color: rgba(0, 199, 177, 0.18);
background-color: color-mix(in srgb, var(--color-turquoise) 18%, transparent);
}
100% {
background-color: transparent;
@@ -52,7 +52,7 @@ let sorted = $derived([...blocks].sort((a, b) => a.sortOrder - b.sortOrder));
@media (prefers-reduced-motion: reduce) {
.flash-highlight {
animation: none;
background-color: rgba(0, 199, 177, 0.18);
background-color: color-mix(in srgb, var(--color-turquoise) 18%, transparent);
}
}
</style>