mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-19 06:21:46 +01:00
docs(badge): update
This commit is contained in:
@@ -8,7 +8,60 @@ links:
|
||||
|
||||
## 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
|
||||
|
||||
|
||||
@@ -116,16 +116,11 @@ export default defineNuxtConfig({
|
||||
},
|
||||
|
||||
hooks: {
|
||||
// Related to https://github.com/nuxt/nuxt/pull/22558
|
||||
// 'components:extend': (components) => {
|
||||
// components.forEach((component) => {
|
||||
// if (component.shortPath.includes('@nuxt/ui-pro')) {
|
||||
// component.global = true
|
||||
// } else if (component.global) {
|
||||
// component.global = 'sync'
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
'components:extend': (components) => {
|
||||
const globals = components.filter(c => ['UBadge'].includes(c.pascalName))
|
||||
|
||||
globals.forEach(c => c.global = 'sync')
|
||||
}
|
||||
},
|
||||
|
||||
// vite: {
|
||||
|
||||
Reference in New Issue
Block a user