58 lines
735 B
Svelte
58 lines
735 B
Svelte
<style>
|
|
/* Common */
|
|
.alert {
|
|
@apply mb-1;
|
|
@apply border-l-4;
|
|
@apply text-gray-600;
|
|
@apply text-sm;
|
|
@apply px-4;
|
|
@apply py-2;
|
|
}
|
|
|
|
.icon {
|
|
@apply h-5;
|
|
@apply w-5;
|
|
}
|
|
|
|
.content {
|
|
@apply text-sm;
|
|
@apply w-full;
|
|
}
|
|
|
|
.link {
|
|
@apply whitespace-nowrap;
|
|
@apply font-bold;
|
|
}
|
|
|
|
.text {
|
|
@apply border-none;
|
|
}
|
|
/* Info */
|
|
.info {
|
|
@apply border-blue-400;
|
|
@apply bg-blue-50;
|
|
}
|
|
|
|
/* Warning */
|
|
.warning {
|
|
@apply border-yellow-300;
|
|
@apply bg-yellow-50;
|
|
}
|
|
|
|
/* Error */
|
|
.error {
|
|
@apply border-red-400;
|
|
@apply bg-red-50;
|
|
}
|
|
</style>
|
|
|
|
<script lang="ts">
|
|
export let type = 'info';
|
|
let classNames = '';
|
|
export { classNames as class };
|
|
</script>
|
|
|
|
<div class="alert {type} {classNames}">
|
|
<slot />
|
|
</div>
|