New tokens for Rating

pull/5701/head
Cagatay Civici 2024-05-07 11:58:34 +03:00
parent 04c457f3bf
commit a14ddd9b28
3 changed files with 11 additions and 5 deletions

View File

@ -5,7 +5,7 @@ const theme = ({ dt }) => `
position: relative; position: relative;
display: flex; display: flex;
align-items: center; align-items: center;
gap: 0.25rem; gap: ${dt('rating.gap')};
} }
.p-rating-option { .p-rating-option {
@ -15,19 +15,21 @@ const theme = ({ dt }) => `
outline-color: transparent; outline-color: transparent;
border-radius: 50%; border-radius: 50%;
cursor: pointer; cursor: pointer;
transition: background ${dt('transition.duration')}, color ${dt('transition.duration')}, border-color ${dt('transition.duration')}, outline-color ${dt('transition.duration')}, box-shadow ${dt('transition.duration')};
} }
.p-rating-option.p-focus-visible { .p-rating-option.p-focus-visible {
box-shadow: ${dt('focus.ring.shadow')};
outline: ${dt('focus.ring.width')} ${dt('focus.ring.style')} ${dt('focus.ring.color')}; outline: ${dt('focus.ring.width')} ${dt('focus.ring.style')} ${dt('focus.ring.color')};
outline-offset: ${dt('focus.ring.offset')}; outline-offset: ${dt('focus.ring.offset')};
} }
.p-rating-icon { .p-rating-icon {
color: ${dt('rating.icon.color')}; color: ${dt('rating.icon.color')};
transition: background-color ${dt('transition.duration')}, color ${dt('transition.duration')}, border-color ${dt('transition.duration')}, outline-color ${dt('transition.duration')}; transition: background ${dt('transition.duration')}, color ${dt('transition.duration')}, border-color ${dt('transition.duration')}, outline-color ${dt('transition.duration')}, box-shadow ${dt('transition.duration')};
font-size: 1rem; font-size: ${dt('rating.icon.size')};
width: 1rem; width: ${dt('rating.icon.size')};
height: 1rem; height: ${dt('rating.icon.size')};
} }
.p-rating:not(.p-disabled):not(.p-readonly) .p-rating-option:hover .p-rating-icon { .p-rating:not(.p-disabled):not(.p-readonly) .p-rating-option:hover .p-rating-icon {

View File

@ -1,5 +1,7 @@
export default { export default {
gap: '0.25rem',
icon: { icon: {
size: '1rem',
color: '{text.muted.color}', color: '{text.muted.color}',
hoverColor: '{primary.color}', hoverColor: '{primary.color}',
activeColor: '{primary.color}' activeColor: '{primary.color}'

View File

@ -1,5 +1,7 @@
export default { export default {
gap: '0.25rem',
icon: { icon: {
size: '1.25rem',
color: '{text.muted.color}', color: '{text.muted.color}',
hoverColor: '{primary.color}', hoverColor: '{primary.color}',
activeColor: '{primary.color}' activeColor: '{primary.color}'