Add active state

pull/6011/head
Cagatay Civici 2024-07-03 13:30:21 +03:00
parent 04b3b2e2ff
commit 87f3c077a0
1 changed files with 16 additions and 5 deletions

View File

@ -5,7 +5,14 @@
<i>root</i>, <i>label</i> and <i>icon</i> elements to add a custom style. <i>root</i>, <i>label</i> and <i>icon</i> elements to add a custom style.
</p> </p>
<div class="card flex justify-center"> <div class="card flex justify-center">
<Button label="Search" icon="pi pi-search" unstyled pt:root="bg-teal-500 hover:bg-teal-700 cursor-pointer py-2 px-4 rounded-full border-0 flex gap-2" pt:label="text-white font-bold text-lg" pt:icon="text-white text-xl" /> <Button
label="Search"
icon="pi pi-search"
unstyled
pt:root="bg-teal-500 hover:bg-teal-700 active:bg-teal-900 cursor-pointer py-2 px-4 rounded-full border-0 flex gap-2"
pt:label="text-white font-bold text-lg"
pt:icon="text-white text-xl"
/>
</div> </div>
<DocSectionCode :code="code" hideToggleCode hideStackBlitz /> <DocSectionCode :code="code" hideToggleCode hideStackBlitz />
</DocSectionText> </DocSectionText>
@ -17,10 +24,14 @@ export default {
return { return {
code: { code: {
basic: ` basic: `
<Button label="Search" icon="pi pi-search" unstyled <Button
pt:root="bg-teal-500 hover:bg-teal-700 cursor-pointer py-3 px-4 rounded-full border-0 flex gap-2" label="Search"
pt:label="text-white font-bold text-xl" icon="pi pi-search"
pt:icon="text-white text-2xl" /> unstyled
pt:root="bg-teal-500 hover:bg-teal-700 active:bg-teal-900 cursor-pointer py-2 px-4 rounded-full border-0 flex gap-2"
pt:label="text-white font-bold text-lg"
pt:icon="text-white text-xl"
/>
` `
} }
}; };