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

Refactored AutoComplete design tokens

Browse source
This commit is contained in:
Cagatay Civici 2024-05-05 18:33:04 +03:00
parent c617766c77
commit 7dcfb440e3
3 changed files with 85 additions and 76 deletions
Download patch file Download diff file Expand all files Collapse all files

93
components/lib/themes/aura/autocomplete/index.js
View file

@ -13,69 +13,34 @@ export default {
placeholderColor: '{form.field.placeholder.color}',
boxShadow: '{form.field.box.shadow}'
},
colorScheme: {
light: {
overlay: {
background: '{surface.0}',
borderColor: '{surface.200}',
color: '{surface.700}'
},
item: {
focusBackground: '{surface.100}',
selectedBackground: '{highlight.background}',
selectedFocusBackground: '{highlight.focus.background}',
color: '{surface.700}',
focusColor: '{surface.800}',
selectedColor: '{highlight.color}',
selectedFocusColor: '{highlight.focus.color}'
},
itemGroup: {
background: '{surface.0}',
color: '{surface.500}'
},
dropdown: {
width: '2.5rem',
background: '{surface.100}',
hoverBackground: '{surface.200}',
activeBackground: '{surface.300}',
borderColor: '{form.field.border.color}',
hoverBorderColor: '{form.field.border.color}',
activeBorderColor: '{form.field.border.color}',
color: '{surface.600}',
hoverColor: '{surface.700}',
activeColor: '{surface.800}'
}
},
dark: {
overlay: {
background: '{surface.900}',
borderColor: '{surface.700}',
color: '{surface.0}'
},
item: {
focusBackground: '{surface.800}',
selectedBackground: '{highlight.background}',
selectedFocusBackground: '{highlight.focus.background}',
color: '{surface.0}',
focusColor: '{surface.0}',
selectedColor: '{highlight.color}',
selectedFocusColor: '{highlight.focus.color}'
},
itemGroup: {
background: '{surface.900}',
color: '{surface.400}'
},
dropdown: {
background: '{surface.800}',
hoverBackground: '{surface.700}',
activeBackground: '{surface.600}',
borderColor: '{form.field.border.color}',
hoverBorderColor: '{form.field.border.color}',
activeBorderColor: '{form.field.border.color}',
color: '{surface.300}',
hoverColor: '{surface.200}',
activeColor: '{surface.100}'
}
}
overlay: {
background: '{overlay.select.background}',
borderColor: '{overlay.select.border.color}',
color: '{overlay.select.color}'
},
option: {
focusBackground: '{list.option.focus.background}',
selectedBackground: '{list.option.selected.background}',
selectedFocusBackground: '{list.option.selected.focus.background}',
color: '{list.option.color}',
focusColor: '{list.option.focus.color}',
selectedColor: '{list.option.selected.color}',
selectedFocusColor: '{list.option.selected.focus.color}'
},
optionGroup: {
background: '{list.option.group.background}',
color: '{list.option.group.color}'
},
dropdown: {
width: '2.5rem',
borderColor: '{form.field.border.color}',
hoverBorderColor: '{form.field.border.color}',
activeBorderColor: '{form.field.border.color}',
background: '{button.secondary.background}',
hoverBackground: '{button.secondary.hover.background}',
activeBackground: '{button.secondary.active.background}',
color: '{button.secondary.color}',
hoverColor: '{button.secondary.hover.color}',
activeColor: '{button.secondary.active.color}'
}
};