vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Badge pt demo updates

pull/4243/head
Tuğçe Küçükoğlu 2023-08-07 16:29:11 +03:00
parent 1c5eea697a
commit e65247f541
1 changed files with 71 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

73
doc/badge/pt/PTDoc.vue
View File

@ -1,7 +1,21 @@
<template>
<DocSectionText v-bind="$attrs"> </DocSectionText>
<div class="card flex justify-content-center">
<Badge value="2" :pt="{ root: { class: 'bg-primary border-round-sm' } }" />
<div class="card flex justify-content-center align-items-center gap-2">
<Badge
value="2"
:pt="{
root: 'bg-primary border-round-xl'
}"
/>
<i
v-badge.danger="{
value: '5+',
pt: {
root: 'bg-primary'
}
}"
class="pi pi-calendar text-4xl"
/>
</div>
<DocSectionCode :code="code" />
</template>
@ -12,26 +26,69 @@ export default {
return {
code: {
basic: `
<Badge value="2"
// component
<Badge
value="2"
:pt="{
root: { class: 'bg-primary border-round-sm' }
root: 'bg-primary border-round-xl'
}"
/>
// directive
<i
v-badge.danger="{
value: '5+',
pt: {
root: 'bg-primary'
}
}"
class="pi pi-calendar text-4xl"
/>`,
options: `
<template>
<Badge value="2"
<div class="card flex justify-content-center align-items-center gap-2">
// component
<Badge
value="2"
:pt="{
root: { class: 'bg-primary border-round-sm' }
root: 'bg-primary border-round-xl'
}"
/>
// directive
<i
v-badge.danger="{
value: '5+',
pt: {
root: 'bg-primary'
}
}"
class="pi pi-calendar text-4xl"
/>
</div>
</template>`,
composition: `
<template>
<Badge value="2"
<div class="card flex justify-content-center align-items-center gap-2">
// component
<Badge
value="2"
:pt="{
root: { class: 'bg-primary border-round-sm' }
root: 'bg-primary border-round-xl'
}"
/>
// directive
<i
v-badge.danger="{
value: '5+',
pt: {
root: 'bg-primary'
}
}"
class="pi pi-calendar text-4xl"
/>
</div>
</template>`
}
};