wehub-resource-sync
70 lines
1.3 KiB
CSS
70 lines
1.3 KiB
CSS
/* Alert component styles */
|
|
|
|
/* Base alert styles */
|
|
.alert {
|
|
@apply flex w-full flex-row items-start justify-start gap-4 bg-surface px-4 py-3 shadow-surface;
|
|
border-radius: min(32px, var(--radius-3xl));
|
|
}
|
|
|
|
/* Alert elements */
|
|
.alert__content {
|
|
@apply flex h-full grow flex-col items-start;
|
|
}
|
|
|
|
.alert__indicator {
|
|
@apply flex items-center justify-center p-1 select-none;
|
|
|
|
[data-slot="alert-default-icon"] {
|
|
@apply box-content size-4;
|
|
}
|
|
}
|
|
|
|
.alert__title {
|
|
@apply text-sm leading-6 font-medium;
|
|
}
|
|
|
|
.alert__description {
|
|
@apply text-sm text-muted;
|
|
}
|
|
|
|
/* Variant modifiers */
|
|
.alert--default .alert__indicator {
|
|
@apply text-foreground;
|
|
}
|
|
|
|
.alert--default .alert__title {
|
|
@apply text-foreground;
|
|
}
|
|
|
|
.alert--accent .alert__indicator {
|
|
@apply text-accent-soft-foreground;
|
|
}
|
|
|
|
.alert--accent .alert__title {
|
|
@apply text-accent-soft-foreground;
|
|
}
|
|
|
|
.alert--success .alert__indicator {
|
|
@apply text-success-soft-foreground;
|
|
}
|
|
|
|
.alert--success .alert__title {
|
|
@apply text-success-soft-foreground;
|
|
}
|
|
|
|
.alert--warning .alert__indicator {
|
|
@apply text-warning-soft-foreground;
|
|
}
|
|
|
|
.alert--warning .alert__title {
|
|
@apply text-warning-soft-foreground;
|
|
}
|
|
|
|
.alert--danger .alert__indicator {
|
|
@apply text-danger-soft-foreground;
|
|
}
|
|
|
|
.alert--danger .alert__title {
|
|
@apply text-danger-soft-foreground;
|
|
}
|