Add btn--secondary style

This commit is contained in:
Timothée Goguely 2024-10-09 18:21:58 +02:00
parent c0338cd72e
commit 663f841fff

View file

@ -34,10 +34,6 @@
--border-color: var(--color-primary-10); --border-color: var(--color-primary-10);
--color: var(--color-primary); --color: var(--color-primary);
} }
.btn--primary:hover {
--background: var(--color-primary-10);
--border-color: var(--color-primary-20);
}
.btn--primary.active, .btn--primary.active,
.btn--primary:active, .btn--primary:active,
.btn--primary[aria-pressed="true"], .btn--primary[aria-pressed="true"],
@ -52,6 +48,12 @@ input[type="checkbox"]:checked + .btn--primary {
--border-color: var(--color-primary-hover); --border-color: var(--color-primary-hover);
} }
.btn--secondary {
--background: var(--color-black-10);
--border-color: transparent;
--color: var(--color-black);
}
.btn--black { .btn--black {
--background: var(--color-black); --background: var(--color-black);
--color: var(--color-white); --color: var(--color-white);
@ -94,6 +96,9 @@ input[type="checkbox"]:checked + .btn--primary {
.btn--grey:hover { .btn--grey:hover {
--background: var(--color-grey-800); --background: var(--color-grey-800);
} }
.btn--secondary:hover {
--background: var(--color-black-20);
}
} }
.btn:focus-visible { .btn:focus-visible {