feat(Alert): new component (#449)

This commit is contained in:
Benjamin Canac
2023-07-27 16:59:50 +02:00
committed by GitHub
parent 8298b62f21
commit ab2abae48a
14 changed files with 392 additions and 8 deletions

View File

@@ -291,6 +291,44 @@ const accordion = {
}
}
const alert = {
wrapper: 'w-full relative overflow-hidden',
title: 'text-sm font-medium',
description: 'mt-1 text-sm leading-4 opacity-90',
shadow: '',
rounded: 'rounded-lg',
padding: 'p-3',
icon: {
base: 'flex-shrink-0 w-5 h-5'
},
avatar: {
base: 'flex-shrink-0 self-center',
size: 'md'
},
color: {
white: {
solid: 'text-gray-900 dark:text-white bg-white dark:bg-gray-900 ring-1 ring-gray-200 dark:ring-gray-800'
}
},
variant: {
solid: 'bg-{color}-500 dark:bg-{color}-400 text-white dark:text-gray-900',
outline: 'text-{color}-500 dark:text-{color}-400 ring-1 ring-inset ring-{color}-500 dark:ring-{color}-400',
soft: 'bg-{color}-50 dark:bg-{color}-400 dark:bg-opacity-10 text-{color}-500 dark:text-{color}-400',
subtle: 'bg-{color}-50 dark:bg-{color}-400 dark:bg-opacity-10 text-{color}-500 dark:text-{color}-400 ring-1 ring-inset ring-{color}-500 dark:ring-{color}-400 ring-opacity-25 dark:ring-opacity-25'
},
default: {
color: 'white',
variant: 'solid',
icon: null,
closeButton: null,
actionButton: {
size: 'xs',
color: 'primary',
variant: 'link'
}
}
}
const kbd = {
base: 'inline-flex items-center justify-center text-gray-900 dark:text-white',
padding: 'px-1',
@@ -942,7 +980,7 @@ const notification = {
wrapper: 'w-full pointer-events-auto',
container: 'relative overflow-hidden',
title: 'text-sm font-medium text-gray-900 dark:text-white',
description: 'mt-1 text-sm leading-5 text-gray-500 dark:text-gray-400',
description: 'mt-1 text-sm leading-4 text-gray-500 dark:text-gray-400',
background: 'bg-white dark:bg-gray-900',
shadow: 'shadow-lg',
rounded: 'rounded-lg',
@@ -1003,6 +1041,7 @@ export default {
dropdown,
kbd,
accordion,
alert,
input,
formGroup,
textarea,