2023-04-07 09:44:08 +02:00
|
|
|
.btn {
|
2023-04-09 19:03:04 +02:00
|
|
|
@apply inline-block rounded-md px-3 py-2 text-sm font-semibold text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 cursor-pointer text-center;
|
2023-04-07 09:44:08 +02:00
|
|
|
|
|
|
|
&-primary {
|
|
|
|
@apply bg-primary-600 hover:bg-primary-500 focus-visible:outline-primary-600;
|
|
|
|
}
|
|
|
|
|
|
|
|
&-dark {
|
2023-11-04 19:45:57 +01:00
|
|
|
@apply bg-primary-900 hover:bg-primary-950 dark:bg-primary-950 dark:hover:bg-primary-700 focus-visible:outline-primary-950;
|
2023-04-07 09:44:08 +02:00
|
|
|
}
|
|
|
|
|
2023-04-17 19:34:22 +02:00
|
|
|
&-gray {
|
2023-11-04 00:19:46 +01:00
|
|
|
@apply bg-gray-400 hover:bg-gray-500 dark:bg-primary-600 focus-visible:outline-primary-500;
|
2023-04-17 19:34:22 +02:00
|
|
|
}
|
|
|
|
|
2023-04-07 09:44:08 +02:00
|
|
|
&-attention {
|
|
|
|
@apply bg-[#f43f5e] hover:bg-[#ff0000] focus-visible:outline-[#ff0000];
|
|
|
|
}
|
|
|
|
|
|
|
|
&-alert {
|
|
|
|
@apply bg-[#ff0000] hover:bg-[#ff0000] focus-visible:outline-[#ff0000];
|
|
|
|
}
|
|
|
|
|
|
|
|
&-fw {
|
|
|
|
@apply w-28;
|
|
|
|
}
|
2023-04-07 12:37:33 +02:00
|
|
|
|
|
|
|
&[aria-pressed='true'] {
|
2023-04-07 21:59:25 +02:00
|
|
|
@apply outline outline-2 outline-offset-2 outline-primary-600 bg-primary-100 text-primary-950;
|
2023-04-07 12:37:33 +02:00
|
|
|
}
|
2023-04-07 09:44:08 +02:00
|
|
|
}
|