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

Update passthrough demo

pull/4186/head
mertsincan 2023-07-11 12:11:42 +01:00
parent 08801b82e9
commit e3dd7b8958
1 changed files with 39 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
doc/passthrough/BasicDoc.vue
View File

@ -12,9 +12,15 @@
header="Header"
toggleable
:pt="{
header: (opts) => {
return { class: opts.state.d_collapsed ? 'bg-primary border-primary' : 'bg-primary-reverse border-primary' };
},
header: (options) => ({
class: [
'border-primary',
{
'bg-primary': options.state.d_collapsed,
'bg-primary-reverse': !options.state.d_collapsed
}
]
}),
content: { class: 'border-primary text-lg text-primary-700' },
title: { class: 'text-xl' },
toggler: { class: 'bg-primary hover:bg-primary-reverse' }
@ -37,12 +43,18 @@ export default {
basic: `
<Panel header="Header" toggleable
:pt="{
header: (opts: PanelPassThroughMethodOptions) => {
return { class: opts.state.d_collapsed ? 'bg-primary border-primary' : 'bg-primary-reverse border-primary' };
header: (options) => ({
class: [
'border-primary',
{
'bg-primary': options.state.d_collapsed,
'bg-primary-reverse': !options.state.d_collapsed,
},
],
}),
content: { class: 'border-primary text-lg text-primary-700' },
title: { class: 'text-xl' },
toggler: { class: 'bg-primary hover:bg-primary-reverse' }
toggler: { class: 'bg-primary hover:bg-primary-reverse' },
}">
<p class="m-0">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
@ -54,12 +66,18 @@ export default {
<div class="card">
<Panel header="Header" toggleable
:pt="{
header: (opts: PanelPassThroughMethodOptions) => {
return { class: opts.state.d_collapsed ? 'bg-primary border-primary' : 'bg-primary-reverse border-primary' };
header: (options) => ({
class: [
'border-primary',
{
'bg-primary': options.state.d_collapsed,
'bg-primary-reverse': !options.state.d_collapsed,
},
],
}),
content: { class: 'border-primary text-lg text-primary-700' },
title: { class: 'text-xl' },
toggler: { class: 'bg-primary hover:bg-primary-reverse' }
toggler: { class: 'bg-primary hover:bg-primary-reverse' },
}">
<p class="m-0">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
@ -76,12 +94,18 @@ export default {
<div class="card">
<Panel header="Header" toggleable
:pt="{
header: (opts: PanelPassThroughMethodOptions) => {
return { class: opts.state.d_collapsed ? 'bg-primary border-primary' : 'bg-primary-reverse border-primary' };
header: (options) => ({
class: [
'border-primary',
{
'bg-primary': options.state.d_collapsed,
'bg-primary-reverse': !options.state.d_collapsed,
},
],
}),
content: { class: 'border-primary text-lg text-primary-700' },
title: { class: 'text-xl' },
toggler: { class: 'bg-primary hover:bg-primary-reverse' }
toggler: { class: 'bg-primary hover:bg-primary-reverse' },
}">
<p class="m-0">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.