Update SplitButton template demo

pull/4806/head
tugcekucukoglu 2023-10-31 16:40:25 +03:00
parent 2a705e0c7b
commit 0851f74b43
1 changed files with 12 additions and 20 deletions

View File

@ -3,11 +3,9 @@
<p>Custom content inside a button is defined as children.</p> <p>Custom content inside a button is defined as children.</p>
</DocSectionText> </DocSectionText>
<div class="card flex justify-content-center"> <div class="card flex justify-content-center">
<SplitButton :model="items" icon="pi pi-plus" class="bg-primary border-round"> <SplitButton :model="items" icon="pi pi-plus" class="bg-primary border-round" @click="save">
<Button @click="save"> <img alt="logo" src="https://primefaces.org/cdn/primevue/images/logo.svg" style="width: 1rem" />
<img alt="logo" src="https://primefaces.org/cdn/primevue/images/logo.svg" style="width: 1rem" /> <span class="ml-2 flex align-items-center font-bold">PrimeVue</span>
<span class="ml-2 flex align-items-center font-bold">PrimeVue</span>
</Button>
</SplitButton> </SplitButton>
</div> </div>
<DocSectionCode :code="code" /> <DocSectionCode :code="code" />
@ -43,22 +41,18 @@ export default {
], ],
code: { code: {
basic: ` basic: `
<SplitButton :model="items" icon="pi pi-plus" class="bg-primary border-round"> <SplitButton :model="items" icon="pi pi-plus" class="bg-primary border-round" @click="save">
<Button @click="save"> <img alt="logo" src="https://primefaces.org/cdn/primevue/images/logo.svg" style="width: 1rem" />
<img alt="logo" src="/images/logo.svg" style="width: 1rem" /> <span class="ml-2 flex align-items-center font-bold">PrimeVue</span>
<span class="ml-2 flex align-items-center font-bold">PrimeVue</span>
</Button>
</SplitButton> </SplitButton>
`, `,
options: ` options: `
<template> <template>
<div class="card flex justify-content-center"> <div class="card flex justify-content-center">
<Toast /> <Toast />
<SplitButton :model="items" icon="pi pi-plus" class="bg-primary border-round"> <SplitButton :model="items" icon="pi pi-plus" class="bg-primary border-round" @click="save">
<Button @click="save"> <img alt="logo" src="https://primefaces.org/cdn/primevue/images/logo.svg" style="width: 1rem" />
<img alt="logo" src="https://primefaces.org/cdn/primevue/images/logo.svg" style="width: 1rem" /> <span class="ml-2 flex align-items-center font-bold">PrimeVue</span>
<span class="ml-2 flex align-items-center font-bold">PrimeVue</span>
</Button>
</SplitButton> </SplitButton>
</div> </div>
</template> </template>
@ -105,11 +99,9 @@ export default {
<template> <template>
<div class="card flex justify-content-center"> <div class="card flex justify-content-center">
<Toast /> <Toast />
<SplitButton :model="items" icon="pi pi-plus" class="bg-primary border-round"> <SplitButton :model="items" icon="pi pi-plus" class="bg-primary border-round" @click="save">
<Button @click="save"> <img alt="logo" src="https://primefaces.org/cdn/primevue/images/logo.svg" style="width: 1rem" />
<img alt="logo" src="https://primefaces.org/cdn/primevue/images/logo.svg" style="width: 1rem" /> <span class="ml-2 flex align-items-center font-bold">PrimeVue</span>
<span class="ml-2 flex align-items-center font-bold">PrimeVue</span>
</Button>
</SplitButton> </SplitButton>
</div> </div>
</template> </template>