vertumnus/primevue-mirror
1
0
Fork 0
mirror of https://github.com/primefaces/primevue.git synced 2025-05-10 09:22:34 +00:00
Code Issues Projects Releases Packages Wiki Activity

Refactored ToggleButton

Browse source
This commit is contained in:
Cagatay Civici 2024-04-07 13:58:33 +03:00
parent 69325de4e8
commit 9ce35574a8
2 changed files with 7 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

10
components/lib/themes/primeone/base/togglebutton/index.js
View file

@ -38,16 +38,16 @@ export default {
border-radius: ${dt('rounded.sm')}; border-radius: ${dt('rounded.sm')};
} }
.p-togglebutton.p-highlight::before { .p-togglebutton.p-togglebutton-checked::before {
background: ${dt('togglebutton.checked.background')}; background: ${dt('togglebutton.checked.background')};
box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.02), 0px 1px 2px 0px rgba(0, 0, 0, 0.04); box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.02), 0px 1px 2px 0px rgba(0, 0, 0, 0.04);
} }
.p-togglebutton:not(:disabled):not(.p-highlight):hover { .p-togglebutton:not(:disabled):not(.p-togglebutton-checked):hover {
color: ${dt('togglebutton.hover.color')}; color: ${dt('togglebutton.hover.color')};
} }
.p-togglebutton.p-highlight { .p-togglebutton.p-togglebutton-checked {
color: ${dt('togglebutton.checked.color')}; color: ${dt('togglebutton.checked.color')};
} }
@ -72,11 +72,11 @@ export default {
color: ${dt('togglebutton.icon.color')}; color: ${dt('togglebutton.icon.color')};
} }
.p-togglebutton:not(:disabled):not(.p-highlight):hover .p-togglebutton-icon { .p-togglebutton:not(:disabled):not(.p-togglebutton-checked):hover .p-togglebutton-icon {
color: ${dt('togglebutton.icon.hover.color')}; color: ${dt('togglebutton.icon.hover.color')};
} }
.p-togglebutton.p-highlight .p-togglebutton-icon { .p-togglebutton.p-togglebutton-checked .p-togglebutton-icon {
color: ${dt('togglebutton.icon.checked.color')}; color: ${dt('togglebutton.icon.checked.color')};
} }

10
components/lib/togglebutton/style/ToggleButtonStyle.js
View file

@ -4,17 +4,11 @@ const classes = {
root: ({ instance, props }) => [ root: ({ instance, props }) => [
'p-togglebutton p-component', 'p-togglebutton p-component',
{ {
'p-highlight': instance.active, 'p-togglebutton-checked': instance.active,
'p-invalid': props.invalid 'p-invalid': props.invalid
} }
], ],
icon: ({ instance, props }) => [ icon: 'p-togglebutton-icon',
'p-togglebutton-icon',
{
'p-togglebutton-icon-left': props.iconPos === 'left' && instance.label,
'p-togglebutton-icon-right': props.iconPos === 'right' && instance.label
}
],
label: 'p-togglebutton-label' label: 'p-togglebutton-label'
}; };