mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-02-03 21:57:58 +01:00
docs(badge): update
This commit is contained in:
@@ -8,7 +8,60 @@ links:
|
|||||||
|
|
||||||
## Usage
|
## Usage
|
||||||
|
|
||||||
## Examples
|
Use the default slot to set the label of the Badge.
|
||||||
|
|
||||||
|
::component-code
|
||||||
|
---
|
||||||
|
slots:
|
||||||
|
default: Badge
|
||||||
|
---
|
||||||
|
|
||||||
|
Badge
|
||||||
|
::
|
||||||
|
|
||||||
|
You can achieve the same result by using the `label` prop.
|
||||||
|
|
||||||
|
::component-code
|
||||||
|
---
|
||||||
|
props:
|
||||||
|
label: Badge
|
||||||
|
---
|
||||||
|
::
|
||||||
|
|
||||||
|
### Style
|
||||||
|
|
||||||
|
Use the `color` and `variant` props to change the style of the Badge.
|
||||||
|
|
||||||
|
::component-code
|
||||||
|
---
|
||||||
|
slots:
|
||||||
|
default: Badge
|
||||||
|
props:
|
||||||
|
color: primary
|
||||||
|
variant: solid
|
||||||
|
---
|
||||||
|
|
||||||
|
Badge
|
||||||
|
::
|
||||||
|
|
||||||
|
::tip
|
||||||
|
Try out the `gray` color for a neutral style.
|
||||||
|
::
|
||||||
|
|
||||||
|
### Size
|
||||||
|
|
||||||
|
Use the `size` prop to change the size of the Badge.
|
||||||
|
|
||||||
|
::component-code
|
||||||
|
---
|
||||||
|
slots:
|
||||||
|
default: Badge
|
||||||
|
props:
|
||||||
|
size: md
|
||||||
|
---
|
||||||
|
|
||||||
|
Badge
|
||||||
|
::
|
||||||
|
|
||||||
## API
|
## API
|
||||||
|
|
||||||
|
|||||||
@@ -116,16 +116,11 @@ export default defineNuxtConfig({
|
|||||||
},
|
},
|
||||||
|
|
||||||
hooks: {
|
hooks: {
|
||||||
// Related to https://github.com/nuxt/nuxt/pull/22558
|
'components:extend': (components) => {
|
||||||
// 'components:extend': (components) => {
|
const globals = components.filter(c => ['UBadge'].includes(c.pascalName))
|
||||||
// components.forEach((component) => {
|
|
||||||
// if (component.shortPath.includes('@nuxt/ui-pro')) {
|
globals.forEach(c => c.global = 'sync')
|
||||||
// component.global = true
|
}
|
||||||
// } else if (component.global) {
|
|
||||||
// component.global = 'sync'
|
|
||||||
// }
|
|
||||||
// })
|
|
||||||
// }
|
|
||||||
},
|
},
|
||||||
|
|
||||||
// vite: {
|
// vite: {
|
||||||
|
|||||||
Reference in New Issue
Block a user