Refactored ToggleButton

pull/5677/head
Cagatay Civici 2024-04-07 13:58:33 +03:00
parent 69325de4e8
commit 9ce35574a8
2 changed files with 7 additions and 13 deletions

View File

@ -38,16 +38,16 @@ export default {
border-radius: ${dt('rounded.sm')};
}
.p-togglebutton.p-highlight::before {
.p-togglebutton.p-togglebutton-checked::before {
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);
}
.p-togglebutton:not(:disabled):not(.p-highlight):hover {
.p-togglebutton:not(:disabled):not(.p-togglebutton-checked):hover {
color: ${dt('togglebutton.hover.color')};
}
.p-togglebutton.p-highlight {
.p-togglebutton.p-togglebutton-checked {
color: ${dt('togglebutton.checked.color')};
}
@ -72,11 +72,11 @@ export default {
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')};
}
.p-togglebutton.p-highlight .p-togglebutton-icon {
.p-togglebutton.p-togglebutton-checked .p-togglebutton-icon {
color: ${dt('togglebutton.icon.checked.color')};
}

View File

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