arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-25 09:20:36 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(Badge): rename outline to subtle + add soft variants

Browse Source
This commit is contained in:
Benjamin Canac
2023-07-27 18:17:22 +02:00
parent 572b7a5984
commit 5bd5dc2bca
2 changed files with 5 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/content/2.elements/4.badge.md
View File

@@ -31,6 +31,8 @@ props:
Use the `color` and `variant` props to change the visual style of the Badge. Use the `color` and `variant` props to change the visual style of the Badge.
- `variant` can be `solid` (default), `outline`, `soft` or `subtle`.
::component-card ::component-card
--- ---
props: props:

4
src/runtime/app.config.ts
View File

@@ -132,7 +132,9 @@ const badge = {
}, },
variant: { variant: {
solid: 'bg-{color}-500 dark:bg-{color}-400 text-white dark:text-gray-900', solid: 'bg-{color}-500 dark:bg-{color}-400 text-white dark:text-gray-900',
outline: '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-10 dark:ring-opacity-20' 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: { default: {
size: 'sm', size: 'sm',