refactor(ui): btn-warning Button-Variante + gelb-Token statt inline-style
gelb-Palette ins @theme (fixt auch bisher wirkungslose gelb-* Klassen im Deadline-Banner), .btn-warning als wiederverwendbare Variante; Termin-melden- Button nutzt sie statt inline-style/arbitrary utilities. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
+23
-1
@@ -90,6 +90,18 @@
|
||||
--color-fire-900: #981b18;
|
||||
--color-fire-950: #5d0f0b;
|
||||
|
||||
/* Palette: Gelb (Signal / Warnung / Aufmerksamkeit) */
|
||||
--color-gelb-50: #fefce8;
|
||||
--color-gelb-100: #fef9c3;
|
||||
--color-gelb-200: #fef08a;
|
||||
--color-gelb-300: #fde047;
|
||||
--color-gelb-400: #facc15;
|
||||
--color-gelb-500: #eab308;
|
||||
--color-gelb-600: #ca8a04;
|
||||
--color-gelb-700: #a16207;
|
||||
--color-gelb-800: #854d0e;
|
||||
--color-gelb-900: #713f12;
|
||||
|
||||
/* Palette: Stein (Neutrals) */
|
||||
--color-stein-0: #ffffff;
|
||||
--color-stein-50: #f7f8f7;
|
||||
@@ -351,7 +363,8 @@ main ol:not(.not-prose):where(:not(.not-prose *)) li {
|
||||
.btn-primary,
|
||||
.btn-secondary,
|
||||
.btn-tertiary,
|
||||
.btn-outline {
|
||||
.btn-outline,
|
||||
.btn-warning {
|
||||
@apply inline-flex items-center gap-1 no-underline whitespace-nowrap transition-colors duration-200 font-medium px-4 py-2 rounded-xs;
|
||||
}
|
||||
|
||||
@@ -391,6 +404,15 @@ main ol:not(.not-prose):where(:not(.not-prose *)) li {
|
||||
@apply bg-stein-100;
|
||||
}
|
||||
|
||||
/* Buttons – Gelb (Signal / Aufmerksamkeit, z. B. Termin melden) */
|
||||
.btn-warning {
|
||||
@apply border border-gelb-500 bg-gelb-300 text-gelb-900 shadow-sm;
|
||||
}
|
||||
|
||||
.btn-warning:hover {
|
||||
@apply bg-gelb-400;
|
||||
}
|
||||
|
||||
/* Größen-Modifier — nach den btn-* definiert damit override greift */
|
||||
.btn-sm {
|
||||
@apply px-2 py-1 text-xs gap-1;
|
||||
|
||||
@@ -965,8 +965,7 @@
|
||||
>
|
||||
<a
|
||||
href="/termin-melden"
|
||||
class="btn-sm inline-flex items-center gap-1.5 min-h-[36px] rounded-md border px-3 font-semibold no-underline"
|
||||
style="background:#fde047;border-color:#eab308;color:#713f12"
|
||||
class="btn-warning btn-sm inline-flex items-center gap-1.5 min-h-[36px]"
|
||||
>
|
||||
<Icon icon="lucide:plus" class="size-3.5 shrink-0" aria-hidden="true" />
|
||||
Termin melden
|
||||
|
||||
Reference in New Issue
Block a user