pull/3892/head
Tuğçe Küçükoğlu 2023-04-19 11:00:59 +03:00
commit 8f0a377147
11 changed files with 30 additions and 31 deletions

View File

@ -3,6 +3,6 @@
<p>{{ $attrs.description }}</p> <p>{{ $attrs.description }}</p>
</DocSectionText> </DocSectionText>
<div> <div>
<img class="w-full" src="/images/pt/accordion.jpg" /> <img class="w-full" src="https://primefaces.org/cdn/primevue/images/pt/accordion.jpg" />
</div> </div>
</template> </template>

View File

@ -3,6 +3,6 @@
<p>{{ $attrs.description }}</p> <p>{{ $attrs.description }}</p>
</DocSectionText> </DocSectionText>
<div> <div>
<img class="w-full" src="/images/pt/card.jpg" /> <img class="w-full" src="https://primefaces.org/cdn/primevue/images/pt/card.jpg" />
</div> </div>
</template> </template>

View File

@ -3,6 +3,6 @@
<p>{{ $attrs.description }}</p> <p>{{ $attrs.description }}</p>
</DocSectionText> </DocSectionText>
<div> <div>
<img class="w-full" src="/images/pt/deferred.jpg" /> <img class="w-full" src="https://primefaces.org/cdn/primevue/images/pt/deferred.jpg" />
</div> </div>
</template> </template>

View File

@ -3,6 +3,6 @@
<p>{{ $attrs.description }}</p> <p>{{ $attrs.description }}</p>
</DocSectionText> </DocSectionText>
<div> <div>
<img class="w-full" src="/images/pt/divider.jpg" /> <img class="w-full" src="https://primefaces.org/cdn/primevue/images/pt/divider.jpg" />
</div> </div>
</template> </template>

View File

@ -3,6 +3,6 @@
<p>{{ $attrs.description }}</p> <p>{{ $attrs.description }}</p>
</DocSectionText> </DocSectionText>
<div> <div>
<img class="w-full" src="/images/pt/fieldset.jpg" /> <img class="w-full" src="https://primefaces.org/cdn/primevue/images/pt/fieldset.jpg" />
</div> </div>
</template> </template>

View File

@ -3,6 +3,6 @@
<p>{{ $attrs.description }}</p> <p>{{ $attrs.description }}</p>
</DocSectionText> </DocSectionText>
<div> <div>
<img class="w-full" src="/images/pt/panel.jpg" /> <img class="w-full" src="https://primefaces.org/cdn/primevue/images/pt/panel.jpg" />
</div> </div>
</template> </template>

View File

@ -3,6 +3,6 @@
<p>{{ $attrs.description }}</p> <p>{{ $attrs.description }}</p>
</DocSectionText> </DocSectionText>
<div> <div>
<img class="w-full" src="/images/pt/scrollpanel.jpg" /> <img class="w-full" src="https://primefaces.org/cdn/primevue/images/pt/scrollpanel.jpg" />
</div> </div>
</template> </template>

View File

@ -3,6 +3,6 @@
<p>{{ $attrs.description }}</p> <p>{{ $attrs.description }}</p>
</DocSectionText> </DocSectionText>
<div> <div>
<img class="w-full" src="/images/pt/splitter.jpg" /> <img class="w-full" src="https://primefaces.org/cdn/primevue/images/pt/splitter.jpg" />
</div> </div>
</template> </template>

View File

@ -3,6 +3,6 @@
<p>{{ $attrs.description }}</p> <p>{{ $attrs.description }}</p>
</DocSectionText> </DocSectionText>
<div> <div>
<img class="w-full" src="/images/pt/tabview.jpg" /> <img class="w-full" src="https://primefaces.org/cdn/primevue/images/pt/tabview.jpg" />
</div> </div>
</template> </template>

View File

@ -1,12 +1,14 @@
<template> <template>
<DocSectionText v-bind="$attrs"> </DocSectionText> <DocSectionText v-bind="$attrs"> </DocSectionText>
<div class="card"> <div class="card">
<Toolbar :pt="{ root: { class: 'p-1' }, groupleft: { class: 'p-2 text-primary' } }"> <Toolbar :pt="{ root: { style: { background: 'linear-gradient(to right, #8e2de2, #4a00e0)', borderRadius: '24px' } } }">
<template #start> <template #start>
<span>PrimeVue</span> <Button label="New" icon="pi pi-plus" class="p-button-help" />
</template> </template>
<template #end> <template #end>
<Button label="Logout" /> <Button icon="pi pi-search" class="mr-2" />
<Button icon="pi pi-times" severity="danger" />
</template> </template>
</Toolbar> </Toolbar>
</div> </div>
@ -20,24 +22,28 @@ export default {
code: { code: {
basic: ` basic: `
<TabView> <TabView>
<Toolbar :pt="{ root: { class: 'p-1' }, groupleft: { class: 'p-2 text-primary' } }"> <Toolbar :pt="{ root: { style: { background: 'linear-gradient(to right, #8e2de2, #4a00e0)', borderRadius: '24px' } } }">
<template #start> <template #start>
<span>PrimeVue</span> <Button label="New" icon="pi pi-plus" class="p-button-help" />
</template> </template>
<template #end> <template #end>
<Button label="Logout" /> <Button icon="pi pi-search" class="mr-2" />
<Button icon="pi pi-times" severity="danger" />
</template> </template>
</Toolbar> </Toolbar>
</TabView>`, </TabView>`,
options: ` options: `
<template> <template>
<div class="card"> <div class="card">
<Toolbar :pt="{ root: { class: 'p-1' }, groupleft: { class: 'p-2 text-primary' } }"> <Toolbar :pt="{ root: { style: { background: 'linear-gradient(to right, #8e2de2, #4a00e0)', borderRadius: '24px' } } }">
<template #start> <template #start>
<span>PrimeVue</span> <Button label="New" icon="pi pi-plus" class="p-button-help" />
</template> </template>
<template #end> <template #end>
<Button label="Logout" /> <Button icon="pi pi-search" class="mr-2" />
<Button icon="pi pi-times" severity="danger" />
</template> </template>
</Toolbar> </Toolbar>
</div> </div>
@ -45,27 +51,20 @@ export default {
composition: ` composition: `
<template> <template>
<div class="card"> <div class="card">
<Toolbar :pt="{ root: { class: 'p-1' }, groupleft: { class: 'p-2 text-primary' } }"> <Toolbar :pt="{ root: { style: { background: 'linear-gradient(to right, #8e2de2, #4a00e0)', borderRadius: '24px' } } }">
<template #start> <template #start>
<span>PrimeVue</span> <Button label="New" icon="pi pi-plus" class="p-button-help" />
</template> </template>
<template #end> <template #end>
<Button label="Logout" /> <Button icon="pi pi-search" class="mr-2" />
<Button icon="pi pi-times" severity="danger" />
</template> </template>
</Toolbar> </Toolbar>
</div> </div>
</template>` </template>`
} }
}; };
},
methods: {
panelClass(props, parent, index) {
return [
{
'bg-primary': parent.state.d_activeIndex === index
}
];
}
} }
}; };
</script> </script>

View File

@ -3,6 +3,6 @@
<p>{{ $attrs.description }}</p> <p>{{ $attrs.description }}</p>
</DocSectionText> </DocSectionText>
<div> <div>
<img class="w-full" src="/images/pt/toolbar.jpg" /> <img class="w-full" src="https://primefaces.org/cdn/primevue/images/pt/toolbar.jpg" />
</div> </div>
</template> </template>