mirror of
https://github.com/primefaces/primevue.git
synced 2025-05-10 17:32:36 +00:00
Tokens for TieredMenu
This commit is contained in:
parent
32c592b74e
commit
3cc7a5d44c
8 changed files with 145 additions and 65 deletions
|
@ -184,6 +184,9 @@ export default {
|
|||
submenuLabel: {
|
||||
padding: '0.5rem 0.75rem',
|
||||
fontWeight: '600'
|
||||
},
|
||||
submenuIcon: {
|
||||
size: '0.875rem'
|
||||
}
|
||||
},
|
||||
overlay: {
|
||||
|
@ -304,16 +307,24 @@ export default {
|
|||
navigation: {
|
||||
item: {
|
||||
focusBackground: '{surface.100}',
|
||||
activeBackground: '{surface.100}',
|
||||
color: '{text.color}',
|
||||
focusColor: '{text.hover.color}',
|
||||
activeColor: '{text.hover.color}',
|
||||
icon: {
|
||||
color: '{surface.400}',
|
||||
focusColor: '{surface.500}'
|
||||
focusColor: '{surface.500}',
|
||||
activeColor: '{surface.500}',
|
||||
}
|
||||
},
|
||||
submenuLabel: {
|
||||
background: '{surface.0}',
|
||||
color: '{text.muted.color}'
|
||||
},
|
||||
submenuIcon: {
|
||||
color: '{surface.400}',
|
||||
focusColor: '{surface.500}',
|
||||
activeColor: '{surface.500}'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
@ -415,16 +426,24 @@ export default {
|
|||
navigation: {
|
||||
item: {
|
||||
focusBackground: '{surface.800}',
|
||||
activeBackground: '{surface.800}',
|
||||
color: '{text.color}',
|
||||
focusColor: '{text.hover.color}',
|
||||
activeColor: '{text.hover.color}',
|
||||
icon: {
|
||||
color: '{surface.500}',
|
||||
focusColor: '{surface.400}'
|
||||
focusColor: '{surface.400}',
|
||||
activeColor: '{surface.400}'
|
||||
}
|
||||
},
|
||||
submenuLabel: {
|
||||
background: '{surface.900}',
|
||||
color: '{text.muted.color}'
|
||||
},
|
||||
submenuIcon: {
|
||||
color: '{surface.500}',
|
||||
focusColor: '{surface.400}',
|
||||
activeColor: '{surface.400}'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -3,11 +3,13 @@ export default {
|
|||
background: '{content.background}',
|
||||
borderColor: '{content.border.color}',
|
||||
color: '{content.color}',
|
||||
padding: '{navigation.list.padding}',
|
||||
borderRadius: '{content.border.radius}',
|
||||
gap: '{navigation.list.gap}',
|
||||
shadow: '{overlay.navigation.shadow}'
|
||||
},
|
||||
list: {
|
||||
padding: '{navigation.list.padding}',
|
||||
gap: '{navigation.list.gap}'
|
||||
},
|
||||
item: {
|
||||
focusBackground: '{navigation.item.focus.background}',
|
||||
color: '{navigation.item.color}',
|
||||
|
|
|
@ -2,19 +2,40 @@ export default {
|
|||
root: {
|
||||
background: '{content.background}',
|
||||
borderColor: '{content.border.color}',
|
||||
color: '{content.color}'
|
||||
color: '{content.color}',
|
||||
borderRadius: '{content.border.radius}',
|
||||
shadow: '{overlay.navigation.shadow}'
|
||||
},
|
||||
list: {
|
||||
padding: '{navigation.list.padding}',
|
||||
gap: '{navigation.list.gap}'
|
||||
},
|
||||
item: {
|
||||
focusBackground: '{navigation.item.focus.background}',
|
||||
activeBackground: '{navigation.item.active.background}',
|
||||
color: '{navigation.item.color}',
|
||||
focusColor: '{navigation.item.focus.color}',
|
||||
activeColor: '{navigation.item.active.color}',
|
||||
padding: '{navigation.item.padding}',
|
||||
borderRadius: '{navigation.item.border.radius}',
|
||||
gap: '{navigation.item.gap}',
|
||||
icon: {
|
||||
color: '{navigation.item.icon.color}',
|
||||
hoverColor: '{navigation.item.icon.hover.color}'
|
||||
focusColor: '{navigation.item.icon.focus.color}',
|
||||
focusColor: '{navigation.item.icon.active.color}'
|
||||
}
|
||||
},
|
||||
submenuItem: {
|
||||
color: '{navigation.submenu.color}'
|
||||
submenuLabel: {
|
||||
padding: '{navigation.submenu.label.padding}',
|
||||
fontWeight: '{navigation.submenu.label.font.weight}',
|
||||
bakcground: '{navigation.submenu.label.background.}',
|
||||
color: '{navigation.submenu.label.color}'
|
||||
},
|
||||
submenuIcon: {
|
||||
size: '{navigation.submenu.icon.size}',
|
||||
color: '{navigation.submenu.icon.color}',
|
||||
focusColor: '{navigation.submenu.icon.focus.color}',
|
||||
focusColor: '{navigation.submenu.icon.active.color}'
|
||||
},
|
||||
separator: {
|
||||
borderColor: '{content.border.color}'
|
||||
|
|
|
@ -183,6 +183,9 @@ export default {
|
|||
submenuLabel: {
|
||||
padding: '0.625rem 1rem',
|
||||
fontWeight: '600'
|
||||
},
|
||||
submenuIcon: {
|
||||
size: '0.875rem'
|
||||
}
|
||||
},
|
||||
overlay: {
|
||||
|
@ -306,16 +309,24 @@ export default {
|
|||
navigation: {
|
||||
item: {
|
||||
focusBackground: '{surface.100}',
|
||||
activeBackground: '{surface.100}',
|
||||
color: '{text.color}',
|
||||
focusColor: '{text.hover.color}',
|
||||
activeColor: '{text.hover.color}',
|
||||
icon: {
|
||||
color: '{surface.400}',
|
||||
focusColor: '{surface.500}'
|
||||
focusColor: '{surface.500}',
|
||||
activeColor: '{surface.500}'
|
||||
}
|
||||
},
|
||||
submenuLabel: {
|
||||
background: '{surface.0}',
|
||||
color: '{text.color}'
|
||||
},
|
||||
submenuIcon: {
|
||||
color: '{surface.400}',
|
||||
focusColor: '{surface.500}',
|
||||
activeColor: '{surface.500}'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
@ -420,16 +431,24 @@ export default {
|
|||
navigation: {
|
||||
item: {
|
||||
focusBackground: '{surface.800}',
|
||||
activeBackground: '{surface.800}',
|
||||
color: '{text.color}',
|
||||
focusColor: '{text.hover.color}',
|
||||
activeColor: '{text.hover.color}',
|
||||
icon: {
|
||||
color: '{surface.500}',
|
||||
focusColor: '{surface.400}'
|
||||
focusColor: '{surface.400}',
|
||||
activeColor: '{surface.400}'
|
||||
}
|
||||
},
|
||||
submenuLabel: {
|
||||
background: '{surface.900}',
|
||||
color: '{text.color}'
|
||||
},
|
||||
submenuIcon: {
|
||||
color: '{surface.500}',
|
||||
focusColor: '{surface.400}',
|
||||
activeColor: '{surface.400}'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -3,11 +3,13 @@ export default {
|
|||
background: '{content.background}',
|
||||
borderColor: '{content.border.color}',
|
||||
color: '{content.color}',
|
||||
padding: '{navigation.list.padding}',
|
||||
borderRadius: '{content.border.radius}',
|
||||
gap: '{navigation.list.gap}',
|
||||
shadow: '{overlay.navigation.shadow}'
|
||||
},
|
||||
list: {
|
||||
padding: '{navigation.list.padding}',
|
||||
gap: '{navigation.list.gap}'
|
||||
},
|
||||
item: {
|
||||
focusBackground: '{navigation.item.focus.background}',
|
||||
color: '{navigation.item.color}',
|
||||
|
@ -23,7 +25,7 @@ export default {
|
|||
submenuLabel: {
|
||||
padding: '{navigation.submenu.label.padding}',
|
||||
fontWeight: '{navigation.submenu.label.font.weight}',
|
||||
bakcground: '{navigation.submenu.label.background.}',
|
||||
background: '{navigation.submenu.label.background.}',
|
||||
color: '{navigation.submenu.label.color}'
|
||||
},
|
||||
separator: {
|
||||
|
|
|
@ -2,19 +2,40 @@ export default {
|
|||
root: {
|
||||
background: '{content.background}',
|
||||
borderColor: '{content.border.color}',
|
||||
color: '{content.color}'
|
||||
color: '{content.color}',
|
||||
borderRadius: '{content.border.radius}',
|
||||
shadow: '{overlay.navigation.shadow}'
|
||||
},
|
||||
list: {
|
||||
padding: '{navigation.list.padding}',
|
||||
gap: '{navigation.list.gap}'
|
||||
},
|
||||
item: {
|
||||
focusBackground: '{navigation.item.focus.background}',
|
||||
activeBackground: '{navigation.item.active.background}',
|
||||
color: '{navigation.item.color}',
|
||||
focusColor: '{navigation.item.focus.color}',
|
||||
activeColor: '{navigation.item.active.color}',
|
||||
padding: '{navigation.item.padding}',
|
||||
borderRadius: '{navigation.item.border.radius}',
|
||||
gap: '{navigation.item.gap}',
|
||||
icon: {
|
||||
color: '{navigation.item.icon.color}',
|
||||
hoverColor: '{navigation.item.icon.hover.color}'
|
||||
focusColor: '{navigation.item.icon.focus.color}',
|
||||
focusColor: '{navigation.item.icon.active.color}'
|
||||
}
|
||||
},
|
||||
submenuItem: {
|
||||
color: '{navigation.submenu.color}'
|
||||
submenuLabel: {
|
||||
padding: '{navigation.submenu.label.padding}',
|
||||
fontWeight: '{navigation.submenu.label.font.weight}',
|
||||
bakcground: '{navigation.submenu.label.background.}',
|
||||
color: '{navigation.submenu.label.color}'
|
||||
},
|
||||
submenuIcon: {
|
||||
size: '{navigation.submenu.icon.size}',
|
||||
color: '{navigation.submenu.icon.color}',
|
||||
focusColor: '{navigation.submenu.icon.focus.color}',
|
||||
focusColor: '{navigation.submenu.icon.active.color}'
|
||||
},
|
||||
separator: {
|
||||
borderColor: '{content.border.color}'
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue