1/*
2 * Progress
3 *
4 * Native <progress> with cross-browser pseudo-element theming.
5 * Fill color follows `data-status="warning"` / `data-status="error"`;
6 * default is success.
7 */
8
9@layer components {
10 .admin-progress {
11 @apply h-1.5 w-full bg-admin-muted rounded-full overflow-hidden border-0 appearance-none;
12 }
13 .admin-progress::-webkit-progress-bar {
14 @apply bg-admin-muted rounded-full;
15 }
16 .admin-progress::-webkit-progress-value {
17 @apply bg-admin-success rounded-full;
18 }
19 .admin-progress::-moz-progress-bar {
20 @apply bg-admin-success rounded-full;
21 }
22
23 .admin-progress[data-status="warning"]::-webkit-progress-value { @apply bg-admin-warning; }
24 .admin-progress[data-status="warning"]::-moz-progress-bar { @apply bg-admin-warning; }
25 .admin-progress[data-status="error"]::-webkit-progress-value { @apply bg-admin-danger; }
26 .admin-progress[data-status="error"]::-moz-progress-bar { @apply bg-admin-danger; }
27}