vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Migrated to new api

pull/5507/head
Cagatay Civici 2024-02-20 23:46:42 +03:00
parent ea10aea82b
commit 719cc84a60
64 changed files with 2302 additions and 2442 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
components/lib/themes/primeone/presets/aura/accordion/index.js
View File

@ -1,31 +1,29 @@
export default {
variables: {
colorScheme: {
light: {
header: {
background: '{surface.0}',
textColor: '{surface.500}',
textColorHover: '{surface.700}',
textColorActive: '{surface.700}'
},
content: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
}
colorScheme: {
light: {
header: {
background: '{surface.0}',
textColor: '{surface.500}',
textColorHover: '{surface.700}',
textColorActive: '{surface.700}'
},
dark: {
header: {
background: '{surface.900}',
textColor: '{surface.400}',
textColorHover: '{surface.0}',
textColorActive: '{surface.0}'
},
content: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
}
content: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
}
},
dark: {
header: {
background: '{surface.900}',
textColor: '{surface.400}',
textColorHover: '{surface.0}',
textColorActive: '{surface.0}'
},
content: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
}
}
}

24
components/lib/themes/primeone/presets/aura/avatar/index.js
View File

@ -1,17 +1,15 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.200}',
borderColor: '{surface.0}'
}
},
dark: {
root: {
background: '{surface.700}',
borderColor: '{surface.900}'
}
colorScheme: {
light: {
root: {
background: '{surface.200}',
borderColor: '{surface.0}'
}
},
dark: {
root: {
background: '{surface.700}',
borderColor: '{surface.900}'
}
}
}

118
components/lib/themes/primeone/presets/aura/badge/index.js
View File

@ -1,65 +1,63 @@
export default {
variables: {
colorScheme: {
light: {
primary: {
background: '{primary.color}',
textColor: '{primary.inverseColor}'
},
secondary: {
background: '{surface.100}',
textColor: '{surface.600}'
},
success: {
background: '{green.500}',
textColor: '{surface.0}'
},
info: {
background: '{sky.500}',
textColor: '{surface.0}'
},
warn: {
background: '{orange.500}',
textColor: '{surface.0}'
},
danger: {
background: '{red.500}',
textColor: '{surface.0}'
},
contrast: {
background: '{surface.950}',
textColor: '{surface.0}'
}
colorScheme: {
light: {
primary: {
background: '{primary.color}',
textColor: '{primary.inverseColor}'
},
dark: {
primary: {
background: '{primary.color}',
textColor: '{primary.inverseColor}'
},
secondary: {
background: '{surface.800}',
textColor: '{surface.300}'
},
success: {
background: '{green.400}',
textColor: '{green.950}'
},
info: {
background: '{sky.400}',
textColor: '{sky.950}'
},
warn: {
background: '{orange.400}',
textColor: '{orange.950}'
},
danger: {
background: '{red.400}',
textColor: '{red.950}'
},
contrast: {
background: '{surface.0}',
textColor: '{surface.950}'
}
secondary: {
background: '{surface.100}',
textColor: '{surface.600}'
},
success: {
background: '{green.500}',
textColor: '{surface.0}'
},
info: {
background: '{sky.500}',
textColor: '{surface.0}'
},
warn: {
background: '{orange.500}',
textColor: '{surface.0}'
},
danger: {
background: '{red.500}',
textColor: '{surface.0}'
},
contrast: {
background: '{surface.950}',
textColor: '{surface.0}'
}
},
dark: {
primary: {
background: '{primary.color}',
textColor: '{primary.inverseColor}'
},
secondary: {
background: '{surface.800}',
textColor: '{surface.300}'
},
success: {
background: '{green.400}',
textColor: '{green.950}'
},
info: {
background: '{sky.400}',
textColor: '{sky.950}'
},
warn: {
background: '{orange.400}',
textColor: '{orange.950}'
},
danger: {
background: '{red.400}',
textColor: '{red.950}'
},
contrast: {
background: '{surface.0}',
textColor: '{surface.950}'
}
}
}

46
components/lib/themes/primeone/presets/aura/breadcrumb/index.js
View File

@ -1,31 +1,29 @@
export default {
variables: {
colorScheme: {
colorScheme: {
root: {
background: '{surface.0}'
},
light: {
item: {
textColor: '{surface.500}',
textColorHover: '{surface.700}',
iconColor: '{surface.400}'
},
separator: {
color: '{surface.400}'
}
},
dark: {
root: {
background: '{surface.0}'
background: '{surface.900}'
},
light: {
item: {
textColor: '{surface.500}',
textColorHover: '{surface.700}',
iconColor: '{surface.400}'
},
separator: {
color: '{surface.400}'
}
item: {
textColor: '{surface.400}',
textColorHover: '{surface.0}',
iconColor: '{surface.500}'
},
dark: {
root: {
background: '{surface.900}'
},
item: {
textColor: '{surface.400}',
textColorHover: '{surface.0}',
iconColor: '{surface.500}'
},
separator: {
color: '{surface.500}'
}
separator: {
color: '{surface.500}'
}
}
}

762
components/lib/themes/primeone/presets/aura/button/index.js
View File

@ -1,395 +1,393 @@
export default {
variables: {
colorScheme: {
light: {
root: {
primary: {
background: '{primary.color}',
backgroundHover: '{primary.hoverColor}',
backgroundActive: '{primary.activeColor}',
borderColor: '{primary.color}',
borderColorHover: '{primary.hoverColor}',
borderColorActive: '{primary.activeColor}',
textColor: '{primary.inverseColor}',
textColorHover: '{primary.inverseColor}',
textColorActive: '{primary.inverseColor}'
},
secondary: {
background: '{surface.100}',
backgroundHover: '{surface.200}',
backgroundActive: '{surface.300}',
borderColor: '{surface.100}',
borderColorHover: '{surface.200}',
borderColorActive: '{surface.300}',
textColor: '{surface.600}',
textColorHover: '{surface.700}',
textColorActive: '{surface.800}'
},
info: {
background: '{sky.500}',
backgroundHover: '{sky.600}',
backgroundActive: '{sky.700}',
borderColor: '{sky.500}',
borderColorHover: '{sky.600}',
borderColorActive: '{sky.700}',
textColor: '#ffffff',
textColorHover: '#ffffff',
textColorActive: '#ffffff'
},
success: {
background: '{green.500}',
backgroundHover: '{green.600}',
backgroundActive: '{green.700}',
borderColor: '{green.500}',
borderColorHover: '{green.600}',
borderColorActive: '{green.700}',
textColor: '#ffffff',
textColorHover: '#ffffff',
textColorActive: '#ffffff'
},
warn: {
background: '{orange.500}',
backgroundHover: '{orange.600}',
backgroundActive: '{orange.700}',
borderColor: '{orange.500}',
borderColorHover: '{orange.600}',
borderColorActive: '{orange.700}',
textColor: '#ffffff',
textColorHover: '#ffffff',
textColorActive: '#ffffff'
},
help: {
background: '{purple.500}',
backgroundHover: '{purple.600}',
backgroundActive: '{purple.700}',
borderColor: '{purple.500}',
borderColorHover: '{purple.600}',
borderColorActive: '{purple.700}',
textColor: '#ffffff',
textColorHover: '#ffffff',
textColorActive: '#ffffff'
},
danger: {
background: '{red.500}',
backgroundHover: '{red.600}',
backgroundActive: '{red.700}',
borderColor: '{red.500}',
borderColorHover: '{red.600}',
borderColorActive: '{red.700}',
textColor: '#ffffff',
textColorHover: '#ffffff',
textColorActive: '#ffffff'
},
contrast: {
background: '{surface.950}',
backgroundHover: '{surface.900}',
backgroundActive: '{surface.800}',
borderColor: '{surface.950}',
borderColorHover: '{surface.900}',
borderColorActive: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}',
textColorActive: '{surface.0}'
}
colorScheme: {
light: {
root: {
primary: {
background: '{primary.color}',
backgroundHover: '{primary.hoverColor}',
backgroundActive: '{primary.activeColor}',
borderColor: '{primary.color}',
borderColorHover: '{primary.hoverColor}',
borderColorActive: '{primary.activeColor}',
textColor: '{primary.inverseColor}',
textColorHover: '{primary.inverseColor}',
textColorActive: '{primary.inverseColor}'
},
outlined: {
primary: {
backgroundHover: '{primary.50}',
backgroundActive: '{primary.100}',
borderColor: '{primary.200}',
textColor: '{primary.color}'
},
secondary: {
backgroundHover: '{surface.50}',
backgroundActive: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.500}'
},
success: {
backgroundHover: '{green.50}',
backgroundActive: '{green.100}',
borderColor: '{green.200}',
textColor: '{green.500}'
},
info: {
backgroundHover: '{sky.50}',
backgroundActive: '{sky.100}',
borderColor: '{sky.200}',
textColor: '{sky.500}'
},
warn: {
backgroundHover: '{orange.50}',
backgroundActive: '{orange.100}',
borderColor: '{orange.200}',
textColor: '{orange.500}'
},
help: {
backgroundHover: '{purple.50}',
backgroundActive: '{purple.100}',
borderColor: '{purple.200}',
textColor: '{purple.500}'
},
danger: {
backgroundHover: '{red.50}',
backgroundActive: '{red.100}',
borderColor: '{red.200}',
textColor: '{red.500}'
},
contrast: {
backgroundHover: '{surface.50}',
backgroundActive: '{surface.100}',
borderColor: '{surface.700}',
textColor: '{surface.950}'
},
plain: {
backgroundHover: '{surface.50}',
backgroundActive: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
}
secondary: {
background: '{surface.100}',
backgroundHover: '{surface.200}',
backgroundActive: '{surface.300}',
borderColor: '{surface.100}',
borderColorHover: '{surface.200}',
borderColorActive: '{surface.300}',
textColor: '{surface.600}',
textColorHover: '{surface.700}',
textColorActive: '{surface.800}'
},
text: {
primary: {
backgroundHover: '{primary.50}',
backgroundActive: '{primary.100}',
textColor: '{primary.color}'
},
secondary: {
backgroundHover: '{surface.50}',
backgroundActive: '{surface.100}',
textColor: '{surface.500}'
},
success: {
backgroundHover: '{green.50}',
backgroundActive: '{green.100}',
textColor: '{green.500}'
},
info: {
backgroundHover: '{sky.50}',
backgroundActive: '{sky.100}',
textColor: '{sky.500}'
},
warn: {
backgroundHover: '{orange.50}',
backgroundActive: '{orange.100}',
textColor: '{orange.500}'
},
help: {
backgroundHover: '{purple.50}',
backgroundActive: '{purple.100}',
textColor: '{purple.600}'
},
danger: {
backgroundHover: '{red.50}',
backgroundActive: '{red.100}',
textColor: '{red.500}'
},
plain: {
backgroundHover: '{surface.50}',
backgroundActive: '{surface.100}',
textColor: '{surface.700}'
}
info: {
background: '{sky.500}',
backgroundHover: '{sky.600}',
backgroundActive: '{sky.700}',
borderColor: '{sky.500}',
borderColorHover: '{sky.600}',
borderColorActive: '{sky.700}',
textColor: '#ffffff',
textColorHover: '#ffffff',
textColorActive: '#ffffff'
},
link: {
textColor: '{primary.color}',
textColorHover: '{primary.color}',
textColorActive: '{primary.color}'
success: {
background: '{green.500}',
backgroundHover: '{green.600}',
backgroundActive: '{green.700}',
borderColor: '{green.500}',
borderColorHover: '{green.600}',
borderColorActive: '{green.700}',
textColor: '#ffffff',
textColorHover: '#ffffff',
textColorActive: '#ffffff'
},
warn: {
background: '{orange.500}',
backgroundHover: '{orange.600}',
backgroundActive: '{orange.700}',
borderColor: '{orange.500}',
borderColorHover: '{orange.600}',
borderColorActive: '{orange.700}',
textColor: '#ffffff',
textColorHover: '#ffffff',
textColorActive: '#ffffff'
},
help: {
background: '{purple.500}',
backgroundHover: '{purple.600}',
backgroundActive: '{purple.700}',
borderColor: '{purple.500}',
borderColorHover: '{purple.600}',
borderColorActive: '{purple.700}',
textColor: '#ffffff',
textColorHover: '#ffffff',
textColorActive: '#ffffff'
},
danger: {
background: '{red.500}',
backgroundHover: '{red.600}',
backgroundActive: '{red.700}',
borderColor: '{red.500}',
borderColorHover: '{red.600}',
borderColorActive: '{red.700}',
textColor: '#ffffff',
textColorHover: '#ffffff',
textColorActive: '#ffffff'
},
contrast: {
background: '{surface.950}',
backgroundHover: '{surface.900}',
backgroundActive: '{surface.800}',
borderColor: '{surface.950}',
borderColorHover: '{surface.900}',
borderColorActive: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}',
textColorActive: '{surface.0}'
}
},
dark: {
root: {
primary: {
background: '{primary.color}',
backgroundHover: '{primary.hoverColor}',
backgroundActive: '{primary.activeColor}',
borderColor: '{primary.color}',
borderColorHover: '{primary.hoverColor}',
borderColorActive: '{primary.activeColor}',
textColor: '{primary.inverseColor}',
textColorHover: '{primary.inverseColor}',
textColorActive: '{primary.inverseColor}'
},
secondary: {
background: '{surface.800}',
backgroundHover: '{surface.700}',
backgroundActive: '{surface.600}',
borderColor: '{surface.800}',
borderColorHover: '{surface.700}',
borderColorActive: '{surface.600}',
textColor: '{surface.300}',
textColorHover: '{surface.200}',
textColorActive: '{surface.100}'
},
info: {
background: '{sky.400}',
backgroundHover: '{sky.300}',
backgroundActive: '{sky.200}',
borderColor: '{sky.400}',
borderColorHover: '{sky.300}',
borderColorActive: '{sky.200}',
textColor: '{sky.950}',
textColorHover: '{sky.950}',
textColorActive: '{sky.950}'
},
success: {
background: '{green.400}',
backgroundHover: '{green.300}',
backgroundActive: '{green.200}',
borderColor: '{green.400}',
borderColorHover: '{green.300}',
borderColorActive: '{green.200}',
textColor: '{green.950}',
textColorHover: '{green.950}',
textColorActive: '{green.950}'
},
warn: {
background: '{orange.400}',
backgroundHover: '{orange.300}',
backgroundActive: '{orange.200}',
borderColor: '{orange.400}',
borderColorHover: '{orange.300}',
borderColorActive: '{orange.200}',
textColor: '{orange.950}',
textColorHover: '{orange.950}',
textColorActive: '{orange.950}'
},
help: {
background: '{purple.400}',
backgroundHover: '{purple.300}',
backgroundActive: '{purple.200}',
borderColor: '{purple.400}',
borderColorHover: '{purple.300}',
borderColorActive: '{purple.200}',
textColor: '{purple.950}',
textColorHover: '{purple.950}',
textColorActive: '{purple.950}'
},
danger: {
background: '{red.400}',
backgroundHover: '{red.300}',
backgroundActive: '{red.200}',
borderColor: '{red.400}',
borderColorHover: '{red.300}',
borderColorActive: '{red.200}',
textColor: '{red.950}',
textColorHover: '{red.950}',
textColorActive: '{red.950}'
},
contrast: {
background: '{surface.0}',
backgroundHover: '{surface.100}',
backgroundActive: '{surface.200}',
borderColor: '{surface.0}',
borderColorHover: '{surface.100}',
borderColorActive: '{surface.200}',
textColor: '{surface.950}',
textColorHover: '{surface.950}',
textColorActive: '{surface.950}'
}
outlined: {
primary: {
backgroundHover: '{primary.50}',
backgroundActive: '{primary.100}',
borderColor: '{primary.200}',
textColor: '{primary.color}'
},
outlined: {
primary: {
backgroundHover: 'color-mix(in srgb, {primary.color}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {primary.color}, transparent 84%)',
borderColor: '{primary.900}',
textColor: '{primary.color}'
},
secondary: {
backgroundHover: 'rgba(255,255,255,0.04)',
backgroundActive: 'rgba(255,255,255,0.16)',
borderColor: '{surface.700}',
textColor: '{surface.400}'
},
success: {
backgroundHover: 'color-mix(in srgb, {green.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {green.400}, transparent 84%)',
borderColor: '{green.900}',
textColor: '{green.400}'
},
info: {
backgroundHover: 'color-mix(in srgb, {sky.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {sky.400}, transparent 84%)',
borderColor: '{sky.900}',
textColor: '{sky.400}'
},
warn: {
backgroundHover: 'color-mix(in srgb, {orange.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {orange.400}, transparent 84%)',
borderColor: '{orange.900}',
textColor: '{orange.400}'
},
help: {
backgroundHover: 'color-mix(in srgb, {help.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {help.400}, transparent 84%)',
borderColor: '{purple.900}',
textColor: '{purple.400}'
},
danger: {
backgroundHover: 'color-mix(in srgb, {danger.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {danger.400}, transparent 84%)',
borderColor: '{red.900}',
textColor: '{red.400}'
},
contrast: {
backgroundHover: '{surface.800}',
backgroundActive: '{surface.700}',
borderColor: '{surface.500}',
textColor: '{surface.0}'
},
plain: {
backgroundHover: '{surface.800}',
backgroundActive: '{surface.700}',
borderColor: '{surface.600}',
textColor: '{surface.0}'
}
secondary: {
backgroundHover: '{surface.50}',
backgroundActive: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.500}'
},
text: {
primary: {
backgroundHover: 'color-mix(in srgb, {primary.color}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {primary.color}, transparent 84%)',
textColor: '{primary.color}'
},
secondary: {
backgroundHover: '{surface.800}',
backgroundActive: '{surface.700}',
textColor: '{surface.400}'
},
success: {
backgroundHover: 'color-mix(in srgb, {green.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {green.400}, transparent 84%)',
textColor: '{green.400}'
},
info: {
backgroundHover: 'color-mix(in srgb, {sky.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {sky.400}, transparent 84%)',
textColor: '{sky.400}'
},
warn: {
backgroundHover: 'color-mix(in srgb, {orange.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {orange.400}, transparent 84%)',
textColor: '{orange.400}'
},
help: {
backgroundHover: 'color-mix(in srgb, {purple.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {purple.400}, transparent 84%)',
textColor: '{purple.400}'
},
danger: {
backgroundHover: 'color-mix(in srgb, {red.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {red.400}, transparent 84%)',
textColor: '{red.400}'
},
plain: {
backgroundHover: '{surface.800}',
backgroundActive: '{surface.700}',
textColor: '{surface.0}'
}
success: {
backgroundHover: '{green.50}',
backgroundActive: '{green.100}',
borderColor: '{green.200}',
textColor: '{green.500}'
},
link: {
textColor: '{primary.color}',
textColorHover: '{primary.color}',
textColorActive: '{primary.color}'
info: {
backgroundHover: '{sky.50}',
backgroundActive: '{sky.100}',
borderColor: '{sky.200}',
textColor: '{sky.500}'
},
warn: {
backgroundHover: '{orange.50}',
backgroundActive: '{orange.100}',
borderColor: '{orange.200}',
textColor: '{orange.500}'
},
help: {
backgroundHover: '{purple.50}',
backgroundActive: '{purple.100}',
borderColor: '{purple.200}',
textColor: '{purple.500}'
},
danger: {
backgroundHover: '{red.50}',
backgroundActive: '{red.100}',
borderColor: '{red.200}',
textColor: '{red.500}'
},
contrast: {
backgroundHover: '{surface.50}',
backgroundActive: '{surface.100}',
borderColor: '{surface.700}',
textColor: '{surface.950}'
},
plain: {
backgroundHover: '{surface.50}',
backgroundActive: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
}
},
text: {
primary: {
backgroundHover: '{primary.50}',
backgroundActive: '{primary.100}',
textColor: '{primary.color}'
},
secondary: {
backgroundHover: '{surface.50}',
backgroundActive: '{surface.100}',
textColor: '{surface.500}'
},
success: {
backgroundHover: '{green.50}',
backgroundActive: '{green.100}',
textColor: '{green.500}'
},
info: {
backgroundHover: '{sky.50}',
backgroundActive: '{sky.100}',
textColor: '{sky.500}'
},
warn: {
backgroundHover: '{orange.50}',
backgroundActive: '{orange.100}',
textColor: '{orange.500}'
},
help: {
backgroundHover: '{purple.50}',
backgroundActive: '{purple.100}',
textColor: '{purple.600}'
},
danger: {
backgroundHover: '{red.50}',
backgroundActive: '{red.100}',
textColor: '{red.500}'
},
plain: {
backgroundHover: '{surface.50}',
backgroundActive: '{surface.100}',
textColor: '{surface.700}'
}
},
link: {
textColor: '{primary.color}',
textColorHover: '{primary.color}',
textColorActive: '{primary.color}'
}
},
dark: {
root: {
primary: {
background: '{primary.color}',
backgroundHover: '{primary.hoverColor}',
backgroundActive: '{primary.activeColor}',
borderColor: '{primary.color}',
borderColorHover: '{primary.hoverColor}',
borderColorActive: '{primary.activeColor}',
textColor: '{primary.inverseColor}',
textColorHover: '{primary.inverseColor}',
textColorActive: '{primary.inverseColor}'
},
secondary: {
background: '{surface.800}',
backgroundHover: '{surface.700}',
backgroundActive: '{surface.600}',
borderColor: '{surface.800}',
borderColorHover: '{surface.700}',
borderColorActive: '{surface.600}',
textColor: '{surface.300}',
textColorHover: '{surface.200}',
textColorActive: '{surface.100}'
},
info: {
background: '{sky.400}',
backgroundHover: '{sky.300}',
backgroundActive: '{sky.200}',
borderColor: '{sky.400}',
borderColorHover: '{sky.300}',
borderColorActive: '{sky.200}',
textColor: '{sky.950}',
textColorHover: '{sky.950}',
textColorActive: '{sky.950}'
},
success: {
background: '{green.400}',
backgroundHover: '{green.300}',
backgroundActive: '{green.200}',
borderColor: '{green.400}',
borderColorHover: '{green.300}',
borderColorActive: '{green.200}',
textColor: '{green.950}',
textColorHover: '{green.950}',
textColorActive: '{green.950}'
},
warn: {
background: '{orange.400}',
backgroundHover: '{orange.300}',
backgroundActive: '{orange.200}',
borderColor: '{orange.400}',
borderColorHover: '{orange.300}',
borderColorActive: '{orange.200}',
textColor: '{orange.950}',
textColorHover: '{orange.950}',
textColorActive: '{orange.950}'
},
help: {
background: '{purple.400}',
backgroundHover: '{purple.300}',
backgroundActive: '{purple.200}',
borderColor: '{purple.400}',
borderColorHover: '{purple.300}',
borderColorActive: '{purple.200}',
textColor: '{purple.950}',
textColorHover: '{purple.950}',
textColorActive: '{purple.950}'
},
danger: {
background: '{red.400}',
backgroundHover: '{red.300}',
backgroundActive: '{red.200}',
borderColor: '{red.400}',
borderColorHover: '{red.300}',
borderColorActive: '{red.200}',
textColor: '{red.950}',
textColorHover: '{red.950}',
textColorActive: '{red.950}'
},
contrast: {
background: '{surface.0}',
backgroundHover: '{surface.100}',
backgroundActive: '{surface.200}',
borderColor: '{surface.0}',
borderColorHover: '{surface.100}',
borderColorActive: '{surface.200}',
textColor: '{surface.950}',
textColorHover: '{surface.950}',
textColorActive: '{surface.950}'
}
},
outlined: {
primary: {
backgroundHover: 'color-mix(in srgb, {primary.color}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {primary.color}, transparent 84%)',
borderColor: '{primary.900}',
textColor: '{primary.color}'
},
secondary: {
backgroundHover: 'rgba(255,255,255,0.04)',
backgroundActive: 'rgba(255,255,255,0.16)',
borderColor: '{surface.700}',
textColor: '{surface.400}'
},
success: {
backgroundHover: 'color-mix(in srgb, {green.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {green.400}, transparent 84%)',
borderColor: '{green.900}',
textColor: '{green.400}'
},
info: {
backgroundHover: 'color-mix(in srgb, {sky.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {sky.400}, transparent 84%)',
borderColor: '{sky.900}',
textColor: '{sky.400}'
},
warn: {
backgroundHover: 'color-mix(in srgb, {orange.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {orange.400}, transparent 84%)',
borderColor: '{orange.900}',
textColor: '{orange.400}'
},
help: {
backgroundHover: 'color-mix(in srgb, {help.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {help.400}, transparent 84%)',
borderColor: '{purple.900}',
textColor: '{purple.400}'
},
danger: {
backgroundHover: 'color-mix(in srgb, {danger.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {danger.400}, transparent 84%)',
borderColor: '{red.900}',
textColor: '{red.400}'
},
contrast: {
backgroundHover: '{surface.800}',
backgroundActive: '{surface.700}',
borderColor: '{surface.500}',
textColor: '{surface.0}'
},
plain: {
backgroundHover: '{surface.800}',
backgroundActive: '{surface.700}',
borderColor: '{surface.600}',
textColor: '{surface.0}'
}
},
text: {
primary: {
backgroundHover: 'color-mix(in srgb, {primary.color}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {primary.color}, transparent 84%)',
textColor: '{primary.color}'
},
secondary: {
backgroundHover: '{surface.800}',
backgroundActive: '{surface.700}',
textColor: '{surface.400}'
},
success: {
backgroundHover: 'color-mix(in srgb, {green.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {green.400}, transparent 84%)',
textColor: '{green.400}'
},
info: {
backgroundHover: 'color-mix(in srgb, {sky.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {sky.400}, transparent 84%)',
textColor: '{sky.400}'
},
warn: {
backgroundHover: 'color-mix(in srgb, {orange.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {orange.400}, transparent 84%)',
textColor: '{orange.400}'
},
help: {
backgroundHover: 'color-mix(in srgb, {purple.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {purple.400}, transparent 84%)',
textColor: '{purple.400}'
},
danger: {
backgroundHover: 'color-mix(in srgb, {red.400}, transparent 96%)',
backgroundActive: 'color-mix(in srgb, {red.400}, transparent 84%)',
textColor: '{red.400}'
},
plain: {
backgroundHover: '{surface.800}',
backgroundActive: '{surface.700}',
textColor: '{surface.0}'
}
},
link: {
textColor: '{primary.color}',
textColorHover: '{primary.color}',
textColorActive: '{primary.color}'
}
}
}

34
components/lib/themes/primeone/presets/aura/card/index.js
View File

@ -1,23 +1,21 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
textColor: '{surface.700}'
},
subtitle: {
textColor: '{surface.500}'
}
colorScheme: {
light: {
root: {
background: '{surface.0}',
textColor: '{surface.700}'
},
dark: {
root: {
background: '{surface.900}',
textColor: '{surface.0}'
},
subtitle: {
textColor: '{surface.400}'
}
subtitle: {
textColor: '{surface.500}'
}
},
dark: {
root: {
background: '{surface.900}',
textColor: '{surface.0}'
},
subtitle: {
textColor: '{surface.400}'
}
}
}

46
components/lib/themes/primeone/presets/aura/carousel/index.js
View File

@ -1,29 +1,27 @@
export default {
variables: {
colorScheme: {
light: {
navigator: {
color: '{surface.500}',
colorHover: '{surface.600}',
backgroundHover: '{surface.100}'
},
indicator: {
background: '{surface.200}',
backgroundHover: '{surface.300}',
backgroundActive: '{primary.color}'
}
colorScheme: {
light: {
navigator: {
color: '{surface.500}',
colorHover: '{surface.600}',
backgroundHover: '{surface.100}'
},
dark: {
navigator: {
color: '{surface.400}',
colorHover: '{surface.300}',
backgroundHover: '{surface.800}'
},
indicator: {
background: '{surface.700}',
backgroundHover: '{surface.600}',
backgroundActive: '{primary.color}'
}
indicator: {
background: '{surface.200}',
backgroundHover: '{surface.300}',
backgroundActive: '{primary.color}'
}
},
dark: {
navigator: {
color: '{surface.400}',
colorHover: '{surface.300}',
backgroundHover: '{surface.800}'
},
indicator: {
background: '{surface.700}',
backgroundHover: '{surface.600}',
backgroundActive: '{primary.color}'
}
}
}

48
components/lib/themes/primeone/presets/aura/checkbox/index.js
View File

@ -1,29 +1,25 @@
export default {
variables: {
common: {
root: {
borderRadius: '{rounded.sm}',
width: '1.25rem',
height: '1.25rem',
background: '{form.field.background}',
backgroundChecked: '{primary.color}',
backgroundCheckedHover: '{primary.hover.color}',
backgroundDisabled: '{form.field.background.disabled}',
backgroundFilled: '{form.field.background.filled}',
borderColor: '{form.field.border.color}',
borderColorHover: '{form.field.border.color.hover}',
borderColorChecked: '{primary.color}',
borderColorCheckedHover: '{primary.hover.color}',
borderColorInvalid: '{form.field.border.color.invalid}',
boxShadow: '{form.field.box.shadow}'
},
icon: {
size: '0.875rem',
color: '{form.field.text.color}',
colorChecked: '{primary.inverse.color}',
colorCheckedHover: '{primary.inverse.color}',
colorDisabled: '{form.field.text.disabled}'
}
}
root: {
borderRadius: '{rounded.sm}',
width: '1.25rem',
height: '1.25rem',
background: '{form.field.background}',
backgroundChecked: '{primary.color}',
backgroundCheckedHover: '{primary.hover.color}',
backgroundDisabled: '{form.field.background.disabled}',
backgroundFilled: '{form.field.background.filled}',
borderColor: '{form.field.border.color}',
borderColorHover: '{form.field.border.color.hover}',
borderColorChecked: '{primary.color}',
borderColorCheckedHover: '{primary.hover.color}',
borderColorInvalid: '{form.field.border.color.invalid}',
boxShadow: '{form.field.box.shadow}'
},
icon: {
size: '0.875rem',
color: '{form.field.text.color}',
colorChecked: '{primary.inverse.color}',
colorCheckedHover: '{primary.inverse.color}',
colorDisabled: '{form.field.text.disabled}'
}
};

24
components/lib/themes/primeone/presets/aura/chip/index.js
View File

@ -1,17 +1,15 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.100}',
textColor: '{surface.800}'
}
},
dark: {
root: {
background: '{surface.700}',
textColor: '{surface.0}'
}
colorScheme: {
light: {
root: {
background: '{surface.100}',
textColor: '{surface.800}'
}
},
dark: {
root: {
background: '{surface.700}',
textColor: '{surface.0}'
}
}
}

58
components/lib/themes/primeone/presets/aura/chips/index.js
View File

@ -1,37 +1,33 @@
export default {
variables: {
common: {
root: {
background: '{form.field.background}',
backgroundDisabled: '{form.field.background.disabled}',
backgroundFilled: '{form.field.background.filled}',
backgroundFilledFocus: '{form.field.background.filled.focus}',
borderColor: '{form.field.border.color}',
borderColorHover: '{form.field.border.color.hover}',
borderColorFocus: '{form.field.border.color.focus}',
borderColorInvalid: '{form.field.border.color.invalid}',
textColor: '{form.field.text.color}',
textColorDisabled: '{form.field.text.disabled}',
placeholderTextColor: '{form.field.placeholder.text.color}',
boxShadow: '{form.field.box.shadow}'
root: {
background: '{form.field.background}',
backgroundDisabled: '{form.field.background.disabled}',
backgroundFilled: '{form.field.background.filled}',
backgroundFilledFocus: '{form.field.background.filled.focus}',
borderColor: '{form.field.border.color}',
borderColorHover: '{form.field.border.color.hover}',
borderColorFocus: '{form.field.border.color.focus}',
borderColorInvalid: '{form.field.border.color.invalid}',
textColor: '{form.field.text.color}',
textColorDisabled: '{form.field.text.disabled}',
placeholderTextColor: '{form.field.placeholder.text.color}',
boxShadow: '{form.field.box.shadow}'
},
colorScheme: {
light: {
chip: {
background: '{surface.100}',
backgroundFocus: '{surface.200}',
textColor: '{surface.800}',
textColorFocus: '{surface.900}'
}
},
colorScheme: {
light: {
chip: {
background: '{surface.100}',
backgroundFocus: '{surface.200}',
textColor: '{surface.800}',
textColorFocus: '{surface.900}'
}
},
dark: {
chip: {
background: '{surface.700}',
backgroundFocus: '{surface.600}',
textColor: '{surface.0}',
textColorFocus: '{surface.0}'
}
dark: {
chip: {
background: '{surface.700}',
backgroundFocus: '{surface.600}',
textColor: '{surface.0}',
textColorFocus: '{surface.0}'
}
}
}

34
components/lib/themes/primeone/presets/aura/colorpicker/index.js
View File

@ -1,23 +1,21 @@
export default {
variables: {
colorScheme: {
light: {
panel: {
background: '{surface.800}',
borderColor: '{surface.900}'
},
handle: {
color: '{surface.0}'
}
colorScheme: {
light: {
panel: {
background: '{surface.800}',
borderColor: '{surface.900}'
},
dark: {
panel: {
background: '{surface.900}',
borderColor: '{surface.700}'
},
handle: {
color: '{surface.0}'
}
handle: {
color: '{surface.0}'
}
},
dark: {
panel: {
background: '{surface.900}',
borderColor: '{surface.700}'
},
handle: {
color: '{surface.0}'
}
}
}

28
components/lib/themes/primeone/presets/aura/confirmpopup/index.js
View File

@ -1,19 +1,17 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
}
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
}
}
}

74
components/lib/themes/primeone/presets/aura/contextmenu/index.js
View File

@ -1,47 +1,45 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
item: {
backgroundFocus: '{surface.100}',
text: {
color: '{surface.700}',
colorFocus: '{surface.800}'
},
item: {
backgroundFocus: '{surface.100}',
text: {
color: '{surface.700}',
colorFocus: '{surface.800}'
},
icon: {
color: '{surface.400}',
colorFocus: '{surface.500}'
}
},
separator: {
borderColor: '{surface.200}'
icon: {
color: '{surface.400}',
colorFocus: '{surface.500}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
separator: {
borderColor: '{surface.200}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
item: {
backgroundFocus: '{surface.800}',
text: {
color: '{surface.0}',
colorFocus: '{surface.0}'
},
item: {
backgroundFocus: '{surface.800}',
text: {
color: '{surface.0}',
colorFocus: '{surface.0}'
},
icon: {
color: '{surface.500}',
colorFocus: '{surface.400}'
}
},
separator: {
borderColor: '{surface.700}'
icon: {
color: '{surface.500}',
colorFocus: '{surface.400}'
}
},
separator: {
borderColor: '{surface.700}'
}
}
}

186
components/lib/themes/primeone/presets/aura/datatable/index.js
View File

@ -1,99 +1,97 @@
export default {
variables: {
colorScheme: {
light: {
header: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
headerCell: {
background: '{surface.0}',
backgroundHover: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
},
row: {
background: '{surface.0}',
backgroundStriped: '{surface.50}',
backgroundHover: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
},
bodyCell: {
borderColor: '{surface.200}',
borderColorSelected: '{primary.100}'
},
footerCell: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
footer: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
dropPointColor: '{primary.color}',
resizerColor: '{primary.color}',
sortIcon: {
color: '{surface.500}',
colorHover: '{surface.600}'
},
rowAction: {
backgroundHover: '{surface.100}',
backgroundHoverHighlight: '{surface.0}',
color: '{surface.500}',
colorHover: '{surface.500}'
}
colorScheme: {
light: {
header: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
dark: {
header: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
},
headerCell: {
background: '{surface.900}',
backgroundHover: '{surface.800}',
borderColor: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
},
row: {
background: '{surface.900}',
backgroundStriped: '{surface.950}',
backgroundHover: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
},
bodyCell: {
borderColor: '{surface.800}',
borderColorSelected: '{primary.900}'
},
footerCell: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
},
footer: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
},
dropPointColor: '{primary.color}',
resizerColor: '{primary.color}',
sortIcon: {
color: '{surface.400}',
colorHover: '{surface.300}'
},
rowAction: {
backgroundHover: '{surface.800}',
backgroundHoverHighlight: '{surface.900}',
color: '{surface.400}',
colorHover: '{surface.300}'
}
headerCell: {
background: '{surface.0}',
backgroundHover: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
},
row: {
background: '{surface.0}',
backgroundStriped: '{surface.50}',
backgroundHover: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
},
bodyCell: {
borderColor: '{surface.200}',
borderColorSelected: '{primary.100}'
},
footerCell: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
footer: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
dropPointColor: '{primary.color}',
resizerColor: '{primary.color}',
sortIcon: {
color: '{surface.500}',
colorHover: '{surface.600}'
},
rowAction: {
backgroundHover: '{surface.100}',
backgroundHoverHighlight: '{surface.0}',
color: '{surface.500}',
colorHover: '{surface.500}'
}
},
dark: {
header: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
},
headerCell: {
background: '{surface.900}',
backgroundHover: '{surface.800}',
borderColor: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
},
row: {
background: '{surface.900}',
backgroundStriped: '{surface.950}',
backgroundHover: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
},
bodyCell: {
borderColor: '{surface.800}',
borderColorSelected: '{primary.900}'
},
footerCell: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
},
footer: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
},
dropPointColor: '{primary.color}',
resizerColor: '{primary.color}',
sortIcon: {
color: '{surface.400}',
colorHover: '{surface.300}'
},
rowAction: {
backgroundHover: '{surface.800}',
backgroundHoverHighlight: '{surface.900}',
color: '{surface.400}',
colorHover: '{surface.300}'
}
}
}

62
components/lib/themes/primeone/presets/aura/dataview/index.js
View File

@ -1,37 +1,35 @@
export default {
variables: {
colorScheme: {
light: {
header: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
content: {
background: '{surface.0}',
textColor: '{surface.700}'
},
footer: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
}
colorScheme: {
light: {
header: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
dark: {
header: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
content: {
background: '{surface.900}',
textColor: '{surface.0}'
},
footer: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
}
content: {
background: '{surface.0}',
textColor: '{surface.700}'
},
footer: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
}
},
dark: {
header: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
content: {
background: '{surface.900}',
textColor: '{surface.0}'
},
footer: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
}
}
}

46
components/lib/themes/primeone/presets/aura/dialog/index.js
View File

@ -1,29 +1,27 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
headerIcon: {
color: '{surface.500}',
colorHover: '{surface.600}',
backgroundHover: '{surface.100}'
}
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
headerIcon: {
color: '{surface.400}',
colorHover: '{surface.300}',
backgroundHover: '{surface.800}'
}
headerIcon: {
color: '{surface.500}',
colorHover: '{surface.600}',
backgroundHover: '{surface.100}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
headerIcon: {
color: '{surface.400}',
colorHover: '{surface.300}',
backgroundHover: '{surface.800}'
}
}
}

34
components/lib/themes/primeone/presets/aura/divider/index.js
View File

@ -1,23 +1,21 @@
export default {
variables: {
colorScheme: {
light: {
root: {
borderColor: '{surface.200}'
},
content: {
background: '{surface.0}',
textColor: '{surface.700}'
}
colorScheme: {
light: {
root: {
borderColor: '{surface.200}'
},
dark: {
root: {
borderColor: '{surface.700}'
},
content: {
background: '{surface.900}',
textColor: '{surface.0}'
}
content: {
background: '{surface.0}',
textColor: '{surface.700}'
}
},
dark: {
root: {
borderColor: '{surface.700}'
},
content: {
background: '{surface.900}',
textColor: '{surface.0}'
}
}
}

62
components/lib/themes/primeone/presets/aura/fieldset/index.js
View File

@ -1,37 +1,35 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
legend: {
backgroundHover: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
},
toggleIcon: {
color: '{surface.500}',
colorHover: '{surface.600}'
}
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
legend: {
backgroundHover: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
},
toggleIcon: {
color: '{surface.400}',
colorHover: '{surface.300}'
}
legend: {
backgroundHover: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
},
toggleIcon: {
color: '{surface.500}',
colorHover: '{surface.600}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
legend: {
backgroundHover: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
},
toggleIcon: {
color: '{surface.400}',
colorHover: '{surface.300}'
}
}
}

154
components/lib/themes/primeone/presets/aura/galleria/index.js
View File

@ -1,83 +1,81 @@
export default {
variables: {
colorScheme: {
light: {
navigator: {
backgroundHover: 'rgba(255, 255, 255, 0.1)',
color: '{surface.100}'
},
thumbnailNavigator: {
backgroundHover: '{surface.200}',
color: '{surface.600}',
colorHover: '{surface.700}'
},
thumbnailContainer: {
background: '{surface.50}'
},
caption: {
background: 'rgba(0, 0, 0, 0.5)',
textColor: '{surface.100}'
},
indicator: {
background: '{surface.200}',
backgroundHover: '{surface.300}',
backgroundActive: '{primary.color}'
},
insetIndicators: {
background: 'rgba(0, 0, 0, 0.5)'
},
insetIndicator: {
background: 'rgba(255, 255, 255, 0.4)',
backgroundHover: 'rgba(255, 255, 255, 0.4)',
backgroundActive: '{primary.color}'
},
mask: {
background: 'rgba(0,0,0,0.9)'
},
close: {
backgroundHover: 'rgba(255,255,255,0.1)',
color: '{surface.50}',
colorHover: '{surface.0}'
}
colorScheme: {
light: {
navigator: {
backgroundHover: 'rgba(255, 255, 255, 0.1)',
color: '{surface.100}'
},
dark: {
navigator: {
backgroundHover: 'rgba(255, 255, 255, 0.1)',
color: '{surface.400}'
},
thumbnailNavigator: {
backgroundHover: '{surface.800}',
color: '{surface.400}',
colorHover: '{surface.300}'
},
thumbnailContainer: {
background: '{surface.950}'
},
caption: {
background: 'rgba(0, 0, 0, 0.5)',
textColor: '{surface.100}'
},
indicator: {
background: '{surface.200}',
backgroundHover: '{surface.300}',
backgroundActive: '{primary.color}'
},
insetIndicators: {
background: 'rgba(0, 0, 0, 0.5)'
},
insetIndicator: {
background: 'rgba(255, 255, 255, 0.4)',
backgroundHover: 'rgba(255, 255, 255, 0.4)',
backgroundActive: '{primary.color}'
},
mask: {
background: 'rgba(0,0,0,0.9)'
},
close: {
backgroundHover: 'rgba(255,255,255,0.1)',
color: '{surface.50}',
colorHover: '{surface.0}'
}
thumbnailNavigator: {
backgroundHover: '{surface.200}',
color: '{surface.600}',
colorHover: '{surface.700}'
},
thumbnailContainer: {
background: '{surface.50}'
},
caption: {
background: 'rgba(0, 0, 0, 0.5)',
textColor: '{surface.100}'
},
indicator: {
background: '{surface.200}',
backgroundHover: '{surface.300}',
backgroundActive: '{primary.color}'
},
insetIndicators: {
background: 'rgba(0, 0, 0, 0.5)'
},
insetIndicator: {
background: 'rgba(255, 255, 255, 0.4)',
backgroundHover: 'rgba(255, 255, 255, 0.4)',
backgroundActive: '{primary.color}'
},
mask: {
background: 'rgba(0,0,0,0.9)'
},
close: {
backgroundHover: 'rgba(255,255,255,0.1)',
color: '{surface.50}',
colorHover: '{surface.0}'
}
},
dark: {
navigator: {
backgroundHover: 'rgba(255, 255, 255, 0.1)',
color: '{surface.400}'
},
thumbnailNavigator: {
backgroundHover: '{surface.800}',
color: '{surface.400}',
colorHover: '{surface.300}'
},
thumbnailContainer: {
background: '{surface.950}'
},
caption: {
background: 'rgba(0, 0, 0, 0.5)',
textColor: '{surface.100}'
},
indicator: {
background: '{surface.200}',
backgroundHover: '{surface.300}',
backgroundActive: '{primary.color}'
},
insetIndicators: {
background: 'rgba(0, 0, 0, 0.5)'
},
insetIndicator: {
background: 'rgba(255, 255, 255, 0.4)',
backgroundHover: 'rgba(255, 255, 255, 0.4)',
backgroundActive: '{primary.color}'
},
mask: {
background: 'rgba(0,0,0,0.9)'
},
close: {
backgroundHover: 'rgba(255,255,255,0.1)',
color: '{surface.50}',
colorHover: '{surface.0}'
}
}
}

54
components/lib/themes/primeone/presets/aura/image/index.js
View File

@ -1,33 +1,31 @@
export default {
variables: {
colorScheme: {
light: {
previewIndicator: {
background: '{maskBackground}',
textColor: '{surface.200}'
},
mask: {
background: 'rgba(0,0,0,0.9)'
},
action: {
backgroundHover: 'rgba(255,255,255,0.1)',
color: '{surface.50}',
colorHover: '{surface.0}'
}
colorScheme: {
light: {
previewIndicator: {
background: '{maskBackground}',
textColor: '{surface.200}'
},
dark: {
previewIndicator: {
background: '{maskBackground}',
textColor: '{surface.200}'
},
mask: {
background: 'rgba(0,0,0,0.9)'
},
action: {
backgroundHover: 'rgba(255,255,255,0.1)',
color: '{surface.50}',
colorHover: '{surface.0}'
}
mask: {
background: 'rgba(0,0,0,0.9)'
},
action: {
backgroundHover: 'rgba(255,255,255,0.1)',
color: '{surface.50}',
colorHover: '{surface.0}'
}
},
dark: {
previewIndicator: {
background: '{maskBackground}',
textColor: '{surface.200}'
},
mask: {
background: 'rgba(0,0,0,0.9)'
},
action: {
backgroundHover: 'rgba(255,255,255,0.1)',
color: '{surface.50}',
colorHover: '{surface.0}'
}
}
}

150
components/lib/themes/primeone/presets/aura/inlinemessage/index.js
View File

@ -1,81 +1,79 @@
export default {
variables: {
colorScheme: {
light: {
info: {
background: 'color-mix(in srgb, {blue.50}, transparent 5%)',
borderColor: '{blue.200}',
textColor: '{blue.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)'
},
success: {
background: 'color-mix(in srgb, {green.50}, transparent 5%)',
borderColor: '{green.200}',
textColor: '{green.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)'
},
warn: {
background: 'color-mix(in srgb,{yellow.50}, transparent 5%)',
borderColor: '{yellow.200}',
textColor: '{yellow.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)'
},
error: {
background: 'color-mix(in srgb, {red.50}, transparent 5%)',
borderColor: '{red.200}',
textColor: '{red.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)'
},
secondary: {
background: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)'
},
contrast: {
background: '{surface.900}',
borderColor: '{surface.950}',
textColor: '{surface.50}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)'
}
colorScheme: {
light: {
info: {
background: 'color-mix(in srgb, {blue.50}, transparent 5%)',
borderColor: '{blue.200}',
textColor: '{blue.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)'
},
dark: {
info: {
background: 'color-mix(in srgb, {blue.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)',
textColor: '{blue.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)'
},
success: {
background: 'color-mix(in srgb, {green.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)',
textColor: '{green.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)'
},
warn: {
background: 'color-mix(in srgb, {yellow.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)',
textColor: '{yellow.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)'
},
error: {
background: 'color-mix(in srgb, {red.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)',
textColor: '{red.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)'
},
secondary: {
background: '{surface.800}',
borderColor: '{surface.700}',
textColor: '{surface.300}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)'
},
contrast: {
background: '{surface.0}',
borderColor: '{surface.100}',
textColor: '{surface.950}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)'
}
success: {
background: 'color-mix(in srgb, {green.50}, transparent 5%)',
borderColor: '{green.200}',
textColor: '{green.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)'
},
warn: {
background: 'color-mix(in srgb,{yellow.50}, transparent 5%)',
borderColor: '{yellow.200}',
textColor: '{yellow.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)'
},
error: {
background: 'color-mix(in srgb, {red.50}, transparent 5%)',
borderColor: '{red.200}',
textColor: '{red.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)'
},
secondary: {
background: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)'
},
contrast: {
background: '{surface.900}',
borderColor: '{surface.950}',
textColor: '{surface.50}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)'
}
},
dark: {
info: {
background: 'color-mix(in srgb, {blue.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)',
textColor: '{blue.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)'
},
success: {
background: 'color-mix(in srgb, {green.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)',
textColor: '{green.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)'
},
warn: {
background: 'color-mix(in srgb, {yellow.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)',
textColor: '{yellow.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)'
},
error: {
background: 'color-mix(in srgb, {red.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)',
textColor: '{red.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)'
},
secondary: {
background: '{surface.800}',
borderColor: '{surface.700}',
textColor: '{surface.300}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)'
},
contrast: {
background: '{surface.0}',
borderColor: '{surface.100}',
textColor: '{surface.950}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)'
}
}
}

24
components/lib/themes/primeone/presets/aura/inplace/index.js
View File

@ -1,17 +1,15 @@
export default {
variables: {
colorScheme: {
light: {
display: {
backgroundHover: '{surface.100}',
textColorHover: '{surface.800}'
}
},
dark: {
display: {
backgroundHover: '{surface.800}',
textColorHover: '{surface.0}'
}
colorScheme: {
light: {
display: {
backgroundHover: '{surface.100}',
textColorHover: '{surface.800}'
}
},
dark: {
display: {
backgroundHover: '{surface.800}',
textColorHover: '{surface.0}'
}
}
}

12
components/lib/themes/primeone/presets/aura/inputgroup/index.js
View File

@ -1,11 +1,7 @@
export default {
variables: {
common: {
addon: {
background: '{form.field.background.color}',
borderColor: '{form.field.border.color}',
textColor: '{form.field.placeholder.color}'
}
}
addon: {
background: '{form.field.background.color}',
borderColor: '{form.field.border.color}',
textColor: '{form.field.placeholder.color}'
}
};

66
components/lib/themes/primeone/presets/aura/inputswitch/index.js
View File

@ -1,39 +1,37 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.300}',
backgroundInvalid: '{red.400}',
backgroundHover: '{surface.400}',
backgroundChecked: '{primary.500}',
backgroundCheckedHover: '{primary.600}',
borderRadius: '30px'
},
handle: {
background: '{surface.0}',
backgroundHover: '{surface.0}',
backgroundChecked: '{surface.0}',
backgroundCheckedHover: '{surface.0}',
backgroundInvalid: '{surface.0}'
}
colorScheme: {
light: {
root: {
background: '{surface.300}',
backgroundInvalid: '{red.400}',
backgroundHover: '{surface.400}',
backgroundChecked: '{primary.500}',
backgroundCheckedHover: '{primary.600}',
borderRadius: '30px'
},
dark: {
root: {
background: '{surface.700}',
backgroundInvalid: '{red.300}',
backgroundHover: '{surface.600}',
backgroundChecked: '{primary.400}',
backgroundCheckedHover: '{primary.300}',
borderRadius: '30px'
},
handle: {
background: '{surface.400}',
backgroundHover: '{surface.300}',
backgroundChecked: '{surface.900}',
backgroundCheckedHover: '{surface.900}',
backgroundInvalid: '{surface.900}'
}
handle: {
background: '{surface.0}',
backgroundHover: '{surface.0}',
backgroundChecked: '{surface.0}',
backgroundCheckedHover: '{surface.0}',
backgroundInvalid: '{surface.0}'
}
},
dark: {
root: {
background: '{surface.700}',
backgroundInvalid: '{red.300}',
backgroundHover: '{surface.600}',
backgroundChecked: '{primary.400}',
backgroundCheckedHover: '{primary.300}',
borderRadius: '30px'
},
handle: {
background: '{surface.400}',
backgroundHover: '{surface.300}',
backgroundChecked: '{surface.900}',
backgroundCheckedHover: '{surface.900}',
backgroundInvalid: '{surface.900}'
}
}
}

30
components/lib/themes/primeone/presets/aura/inputtext/index.js
View File

@ -1,20 +1,16 @@
export default {
variables: {
common: {
root: {
background: '{form.field.background}',
backgroundDisabled: '{form.field.background.disabled}',
backgroundFilled: '{form.field.background.filled}',
backgroundFilledFocus: '{form.field.background.filled.focus}',
borderColor: '{form.field.border.color}',
borderColorHover: '{form.field.border.color.hover}',
borderColorFocus: '{form.field.border.color.focus}',
borderColorInvalid: '{form.field.border.color.invalid}',
textColor: '{form.field.text.color}',
textColorDisabled: '{form.field.text.disabled}',
placeholderTextColor: '{form.field.placeholder.text.color}',
boxShadow: '{form.field.box.shadow}'
}
}
root: {
background: '{form.field.background}',
backgroundDisabled: '{form.field.background.disabled}',
backgroundFilled: '{form.field.background.filled}',
backgroundFilledFocus: '{form.field.background.filled.focus}',
borderColor: '{form.field.border.color}',
borderColorHover: '{form.field.border.color.hover}',
borderColorFocus: '{form.field.border.color.focus}',
borderColorInvalid: '{form.field.border.color.invalid}',
textColor: '{form.field.text.color}',
textColorDisabled: '{form.field.text.disabled}',
placeholderTextColor: '{form.field.placeholder.text.color}',
boxShadow: '{form.field.box.shadow}'
}
};

106
components/lib/themes/primeone/presets/aura/megamenu/index.js
View File

@ -1,63 +1,61 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
item: {
backgroundFocus: '{surface.100}',
text: {
color: '{surface.700}',
colorFocus: '{surface.800}'
},
item: {
backgroundFocus: '{surface.100}',
text: {
color: '{surface.700}',
colorFocus: '{surface.800}'
},
icon: {
color: '{surface.400}',
colorFocus: '{surface.500}'
}
},
submenuHeader: {
textColor: '{surface.400}'
},
separator: {
borderColor: '{surface.200}'
},
mobileToggle: {
color: '{surface.500}',
colorHover: '{surface.600}',
backgroundHover: '{surface.100}'
icon: {
color: '{surface.400}',
colorFocus: '{surface.500}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
submenuHeader: {
textColor: '{surface.400}'
},
separator: {
borderColor: '{surface.200}'
},
mobileToggle: {
color: '{surface.500}',
colorHover: '{surface.600}',
backgroundHover: '{surface.100}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
item: {
backgroundFocus: '{surface.800}',
text: {
color: '{surface.0}',
colorFocus: '{surface.0}'
},
item: {
backgroundFocus: '{surface.800}',
text: {
color: '{surface.0}',
colorFocus: '{surface.0}'
},
icon: {
color: '{surface.500}',
colorFocus: '{surface.400}'
}
},
submenuHeader: {
textColor: '{surface.500}'
},
separator: {
borderColor: '{surface.700}'
},
toggleIcon: {
color: '{surface.400}',
colorHover: '{surface.300}',
backgroundHover: '{surface.800}'
icon: {
color: '{surface.500}',
colorFocus: '{surface.400}'
}
},
submenuHeader: {
textColor: '{surface.500}'
},
separator: {
borderColor: '{surface.700}'
},
toggleIcon: {
color: '{surface.400}',
colorHover: '{surface.300}',
backgroundHover: '{surface.800}'
}
}
}

86
components/lib/themes/primeone/presets/aura/menu/index.js
View File

@ -1,53 +1,51 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
item: {
backgroundFocus: '{surface.100}',
text: {
color: '{surface.700}',
colorFocus: '{surface.800}'
},
item: {
backgroundFocus: '{surface.100}',
text: {
color: '{surface.700}',
colorFocus: '{surface.800}'
},
icon: {
color: '{surface.400}',
colorFocus: '{surface.500}'
}
},
submenuHeader: {
textColor: '{surface.400}'
},
separator: {
borderColor: '{surface.200}'
icon: {
color: '{surface.400}',
colorFocus: '{surface.500}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
submenuHeader: {
textColor: '{surface.400}'
},
separator: {
borderColor: '{surface.200}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
item: {
backgroundFocus: '{surface.800}',
text: {
color: '{surface.0}',
colorFocus: '{surface.0}'
},
item: {
backgroundFocus: '{surface.800}',
text: {
color: '{surface.0}',
colorFocus: '{surface.0}'
},
icon: {
color: '{surface.500}',
colorFocus: '{surface.400}'
}
},
submenuHeader: {
textColor: '{surface.500}'
},
separator: {
borderColor: '{surface.700}'
icon: {
color: '{surface.500}',
colorFocus: '{surface.400}'
}
},
submenuHeader: {
textColor: '{surface.500}'
},
separator: {
borderColor: '{surface.700}'
}
}
}

94
components/lib/themes/primeone/presets/aura/menubar/index.js
View File

@ -1,57 +1,55 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
item: {
backgroundFocus: '{surface.100}',
text: {
color: '{surface.700}',
colorFocus: '{surface.800}'
},
item: {
backgroundFocus: '{surface.100}',
text: {
color: '{surface.700}',
colorFocus: '{surface.800}'
},
icon: {
color: '{surface.400}',
colorFocus: '{surface.500}'
}
},
separator: {
borderColor: '{surface.200}'
},
mobileToggle: {
color: '{surface.500}',
colorHover: '{surface.600}',
backgroundHover: '{surface.100}'
icon: {
color: '{surface.400}',
colorFocus: '{surface.500}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
separator: {
borderColor: '{surface.200}'
},
mobileToggle: {
color: '{surface.500}',
colorHover: '{surface.600}',
backgroundHover: '{surface.100}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
item: {
backgroundFocus: '{surface.800}',
text: {
color: '{surface.0}',
colorFocus: '{surface.0}'
},
item: {
backgroundFocus: '{surface.800}',
text: {
color: '{surface.0}',
colorFocus: '{surface.0}'
},
icon: {
color: '{surface.500}',
colorFocus: '{surface.400}'
}
},
separator: {
borderColor: '{surface.700}'
},
mobileToggle: {
color: '{surface.400}',
colorHover: '{surface.300}',
backgroundHover: '{surface.800}'
icon: {
color: '{surface.500}',
colorFocus: '{surface.400}'
}
},
separator: {
borderColor: '{surface.700}'
},
mobileToggle: {
color: '{surface.400}',
colorHover: '{surface.300}',
backgroundHover: '{surface.800}'
}
}
}

174
components/lib/themes/primeone/presets/aura/message/index.js
View File

@ -1,93 +1,91 @@
export default {
variables: {
colorScheme: {
light: {
info: {
background: 'color-mix(in srgb, {blue.50}, transparent 5%)',
borderColor: '{blue.200}',
textColor: '{blue.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)',
closeBackgroundHover: '{blue.100}'
},
success: {
background: 'color-mix(in srgb, {green.50}, transparent 5%)',
borderColor: '{green.200}',
textColor: '{green.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)',
closeBackgroundHover: '{green.100}'
},
warn: {
background: 'color-mix(in srgb,{yellow.50}, transparent 5%)',
borderColor: '{yellow.200}',
textColor: '{yellow.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)',
closeBackgroundHover: '{yellow.100}'
},
error: {
background: 'color-mix(in srgb, {red.50}, transparent 5%)',
borderColor: '{red.200}',
textColor: '{red.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)',
closeBackgroundHover: '{red.100}'
},
secondary: {
background: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)',
closeBackgroundHover: '{surface.200}'
},
contrast: {
background: '{surface.900}',
borderColor: '{surface.950}',
textColor: '{surface.50}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)',
closeBackgroundHover: '{surface.800}'
}
colorScheme: {
light: {
info: {
background: 'color-mix(in srgb, {blue.50}, transparent 5%)',
borderColor: '{blue.200}',
textColor: '{blue.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)',
closeBackgroundHover: '{blue.100}'
},
dark: {
info: {
background: 'color-mix(in srgb, {blue.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)',
textColor: '{blue.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
success: {
background: 'color-mix(in srgb, {green.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)',
textColor: '{green.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
warn: {
background: 'color-mix(in srgb, {yellow.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)',
textColor: '{yellow.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
error: {
background: 'color-mix(in srgb, {red.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)',
textColor: '{red.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
secondary: {
background: '{surface.800}',
borderColor: '{surface.700}',
textColor: '{surface.300}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)',
closeBackgroundHover: '{surface.700}'
},
contrast: {
background: '{surface.0}',
borderColor: '{surface.100}',
textColor: '{surface.950}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)',
closeBackgroundHover: '{surface.100}'
}
success: {
background: 'color-mix(in srgb, {green.50}, transparent 5%)',
borderColor: '{green.200}',
textColor: '{green.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)',
closeBackgroundHover: '{green.100}'
},
warn: {
background: 'color-mix(in srgb,{yellow.50}, transparent 5%)',
borderColor: '{yellow.200}',
textColor: '{yellow.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)',
closeBackgroundHover: '{yellow.100}'
},
error: {
background: 'color-mix(in srgb, {red.50}, transparent 5%)',
borderColor: '{red.200}',
textColor: '{red.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)',
closeBackgroundHover: '{red.100}'
},
secondary: {
background: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)',
closeBackgroundHover: '{surface.200}'
},
contrast: {
background: '{surface.900}',
borderColor: '{surface.950}',
textColor: '{surface.50}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)',
closeBackgroundHover: '{surface.800}'
}
},
dark: {
info: {
background: 'color-mix(in srgb, {blue.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)',
textColor: '{blue.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
success: {
background: 'color-mix(in srgb, {green.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)',
textColor: '{green.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
warn: {
background: 'color-mix(in srgb, {yellow.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)',
textColor: '{yellow.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
error: {
background: 'color-mix(in srgb, {red.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)',
textColor: '{red.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
secondary: {
background: '{surface.800}',
borderColor: '{surface.700}',
textColor: '{surface.300}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)',
closeBackgroundHover: '{surface.700}'
},
contrast: {
background: '{surface.0}',
borderColor: '{surface.100}',
textColor: '{surface.950}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)',
closeBackgroundHover: '{surface.100}'
}
}
}

20
components/lib/themes/primeone/presets/aura/metergroup/index.js
View File

@ -1,15 +1,13 @@
export default {
variables: {
colorScheme: {
light: {
meters: {
background: '{surface.200}'
}
},
dark: {
meters: {
background: '{surface.700}'
}
colorScheme: {
light: {
meters: {
background: '{surface.200}'
}
},
dark: {
meters: {
background: '{surface.700}'
}
}
}

110
components/lib/themes/primeone/presets/aura/orderlist/index.js
View File

@ -1,61 +1,59 @@
export default {
variables: {
colorScheme: {
light: {
list: {
background: '{surface.0}',
borderColor: '{surface.200}'
},
header: {
textColor: '{surface.500}'
},
item: {
background: 'transparent',
backgroundHover: '{surface.100}',
backgroundFocus: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}',
textColorFocus: '{surface.800}'
},
control: {
background: '{surface.100}',
backgroundHover: '{surface.200}',
backgroundActive: '{surface.300}',
borderColor: '{surface.100}',
borderColorHover: '{surface.200}',
borderColorActive: '{surface.300}',
textColor: '{surface.600}',
textColorHover: '{surface.700}',
textColorActive: '{surface.800}'
}
colorScheme: {
light: {
list: {
background: '{surface.0}',
borderColor: '{surface.200}'
},
dark: {
list: {
background: '{surface.900}',
borderColor: '{surface.700}'
},
header: {
textColor: '{surface.400}'
},
item: {
background: 'transparent',
backgroundHover: '{surface.800}',
backgroundFocus: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}',
textColorFocus: '{surface.0}'
},
control: {
background: '{surface.800}',
backgroundHover: '{surface.700}',
backgroundActive: '{surface.600}',
borderColor: '{surface.800}',
borderColorHover: '{surface.700}',
borderColorActive: '{surface.600}',
textColor: '{surface.300}',
textColorHover: '{surface.200}',
textColorActive: '{surface.100}'
}
header: {
textColor: '{surface.500}'
},
item: {
background: 'transparent',
backgroundHover: '{surface.100}',
backgroundFocus: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}',
textColorFocus: '{surface.800}'
},
control: {
background: '{surface.100}',
backgroundHover: '{surface.200}',
backgroundActive: '{surface.300}',
borderColor: '{surface.100}',
borderColorHover: '{surface.200}',
borderColorActive: '{surface.300}',
textColor: '{surface.600}',
textColorHover: '{surface.700}',
textColorActive: '{surface.800}'
}
},
dark: {
list: {
background: '{surface.900}',
borderColor: '{surface.700}'
},
header: {
textColor: '{surface.400}'
},
item: {
background: 'transparent',
backgroundHover: '{surface.800}',
backgroundFocus: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}',
textColorFocus: '{surface.0}'
},
control: {
background: '{surface.800}',
backgroundHover: '{surface.700}',
backgroundActive: '{surface.600}',
borderColor: '{surface.800}',
borderColorHover: '{surface.700}',
borderColorActive: '{surface.600}',
textColor: '{surface.300}',
textColorHover: '{surface.200}',
textColorActive: '{surface.100}'
}
}
}

38
components/lib/themes/primeone/presets/aura/organizationchart/index.js
View File

@ -1,24 +1,22 @@
export default {
variables: {
colorScheme: {
light: {
node: {
background: '{surface.0}',
backgroundHover: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
},
toggleIcon: {
background: '{surface.0}',
borderColor: '{surface.200}',
color: '{surface.500}'
},
connector: {
color: '{surface.200}'
}
colorScheme: {
light: {
node: {
background: '{surface.0}',
backgroundHover: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
},
dark: {}
}
toggleIcon: {
background: '{surface.0}',
borderColor: '{surface.200}',
color: '{surface.500}'
},
connector: {
color: '{surface.200}'
}
},
dark: {}
}
};

46
components/lib/themes/primeone/presets/aura/overlaypanel/index.js
View File

@ -1,29 +1,27 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
closeIcon: {
color: '{surface.500}',
colorHover: '{surface.600}',
backgroundHover: '{surface.100}'
}
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
closeIcon: {
color: '{surface.400}',
colorHover: '{surface.300}',
backgroundHover: '{surface.800}'
}
closeIcon: {
color: '{surface.500}',
colorHover: '{surface.600}',
backgroundHover: '{surface.100}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
closeIcon: {
color: '{surface.400}',
colorHover: '{surface.300}',
backgroundHover: '{surface.800}'
}
}
}

54
components/lib/themes/primeone/presets/aura/paginator/index.js
View File

@ -1,33 +1,31 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
textColor: '{surface.700}'
},
navigator: {
backgroundHover: '{surface.100}',
color: '{surface.500}',
colorHover: '{surface.600}'
},
currentPageReport: {
textColor: '{surface.500}'
}
colorScheme: {
light: {
root: {
background: '{surface.0}',
textColor: '{surface.700}'
},
dark: {
root: {
background: '{surface.900}',
textColor: '{surface.0}'
},
navigator: {
backgroundHover: '{surface.800}',
color: '{surface.400}',
colorHover: '{surface.300}'
},
currentPageReport: {
textColor: '{surface.400}'
}
navigator: {
backgroundHover: '{surface.100}',
color: '{surface.500}',
colorHover: '{surface.600}'
},
currentPageReport: {
textColor: '{surface.500}'
}
},
dark: {
root: {
background: '{surface.900}',
textColor: '{surface.0}'
},
navigator: {
backgroundHover: '{surface.800}',
color: '{surface.400}',
colorHover: '{surface.300}'
},
currentPageReport: {
textColor: '{surface.400}'
}
}
}

46
components/lib/themes/primeone/presets/aura/panel/index.js
View File

@ -1,29 +1,27 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
headerIcon: {
color: '{surface.500}',
colorHover: '{surface.600}',
backgroundHover: '{surface.100}'
}
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
headerIcon: {
color: '{surface.400}',
colorHover: '{surface.300}',
backgroundHover: '{surface.800}'
}
headerIcon: {
color: '{surface.500}',
colorHover: '{surface.600}',
backgroundHover: '{surface.100}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
headerIcon: {
color: '{surface.400}',
colorHover: '{surface.300}',
backgroundHover: '{surface.800}'
}
}
}

66
components/lib/themes/primeone/presets/aura/panelmenu/index.js
View File

@ -1,40 +1,38 @@
export default {
variables: {
colorScheme: {
light: {
panel: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
item: {
backgroundFocus: '{surface.100}',
text: {
color: '{surface.700}',
colorFocus: '{surface.800}'
},
icon: {
color: '{surface.400}',
colorFocus: '{surface.500}'
}
}
colorScheme: {
light: {
panel: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
dark: {
panel: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
item: {
backgroundFocus: '{surface.100}',
text: {
color: '{surface.700}',
colorFocus: '{surface.800}'
},
item: {
backgroundFocus: '{surface.800}',
text: {
color: '{surface.0}',
colorFocus: '{surface.0}'
},
icon: {
color: '{surface.500}',
colorFocus: '{surface.400}'
}
icon: {
color: '{surface.400}',
colorFocus: '{surface.500}'
}
}
},
dark: {
panel: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
item: {
backgroundFocus: '{surface.800}',
text: {
color: '{surface.0}',
colorFocus: '{surface.0}'
},
icon: {
color: '{surface.500}',
colorFocus: '{surface.400}'
}
}
}

70
components/lib/themes/primeone/presets/aura/password/index.js
View File

@ -1,41 +1,39 @@
export default {
variables: {
colorScheme: {
light: {
meter: {
borderColor: '{surface.200}'
},
icon: {
color: '{surface.500}'
},
strength: {
backgroundWeak: '{red.500}',
backgroundMedium: '{amber.500}',
backgroundStrong: '{green.500}'
},
overlay: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
}
colorScheme: {
light: {
meter: {
borderColor: '{surface.200}'
},
dark: {
meter: {
borderColor: '{surface.700}'
},
icon: {
color: '{surface.400}'
},
strength: {
backgroundWeak: '{red.400}',
backgroundMedium: '{amber.400}',
backgroundStrong: '{green.400}'
},
overlay: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
}
icon: {
color: '{surface.500}'
},
strength: {
backgroundWeak: '{red.500}',
backgroundMedium: '{amber.500}',
backgroundStrong: '{green.500}'
},
overlay: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
}
},
dark: {
meter: {
borderColor: '{surface.700}'
},
icon: {
color: '{surface.400}'
},
strength: {
backgroundWeak: '{red.400}',
backgroundMedium: '{amber.400}',
backgroundStrong: '{green.400}'
},
overlay: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
}
}
}

110
components/lib/themes/primeone/presets/aura/picklist/index.js
View File

@ -1,61 +1,59 @@
export default {
variables: {
colorScheme: {
light: {
list: {
background: '{surface.0}',
borderColor: '{surface.200}'
},
header: {
textColor: '{surface.500}'
},
item: {
background: 'transparent',
backgroundHover: '{surface.100}',
backgroundFocus: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}',
textColorFocus: '{surface.800}'
},
control: {
background: '{surface.100}',
backgroundHover: '{surface.200}',
backgroundActive: '{surface.300}',
borderColor: '{surface.100}',
borderColorHover: '{surface.200}',
borderColorActive: '{surface.300}',
textColor: '{surface.600}',
textColorHover: '{surface.700}',
textColorActive: '{surface.800}'
}
colorScheme: {
light: {
list: {
background: '{surface.0}',
borderColor: '{surface.200}'
},
dark: {
list: {
background: '{surface.900}',
borderColor: '{surface.700}'
},
header: {
textColor: '{surface.400}'
},
item: {
background: 'transparent',
backgroundHover: '{surface.800}',
backgroundFocus: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}',
textColorFocus: '{surface.0}'
},
control: {
background: '{surface.800}',
backgroundHover: '{surface.700}',
backgroundActive: '{surface.600}',
borderColor: '{surface.800}',
borderColorHover: '{surface.700}',
borderColorActive: '{surface.600}',
textColor: '{surface.300}',
textColorHover: '{surface.200}',
textColorActive: '{surface.100}'
}
header: {
textColor: '{surface.500}'
},
item: {
background: 'transparent',
backgroundHover: '{surface.100}',
backgroundFocus: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}',
textColorFocus: '{surface.800}'
},
control: {
background: '{surface.100}',
backgroundHover: '{surface.200}',
backgroundActive: '{surface.300}',
borderColor: '{surface.100}',
borderColorHover: '{surface.200}',
borderColorActive: '{surface.300}',
textColor: '{surface.600}',
textColorHover: '{surface.700}',
textColorActive: '{surface.800}'
}
},
dark: {
list: {
background: '{surface.900}',
borderColor: '{surface.700}'
},
header: {
textColor: '{surface.400}'
},
item: {
background: 'transparent',
backgroundHover: '{surface.800}',
backgroundFocus: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}',
textColorFocus: '{surface.0}'
},
control: {
background: '{surface.800}',
backgroundHover: '{surface.700}',
backgroundActive: '{surface.600}',
borderColor: '{surface.800}',
borderColorHover: '{surface.700}',
borderColorActive: '{surface.600}',
textColor: '{surface.300}',
textColorHover: '{surface.200}',
textColorActive: '{surface.100}'
}
}
}

20
components/lib/themes/primeone/presets/aura/progressbar/index.js
View File

@ -1,15 +1,13 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.200}'
}
},
dark: {
root: {
background: '{surface.700}'
}
colorScheme: {
light: {
root: {
background: '{surface.200}'
}
},
dark: {
root: {
background: '{surface.700}'
}
}
}

32
components/lib/themes/primeone/presets/aura/progressspinner/index.js
View File

@ -1,21 +1,19 @@
export default {
variables: {
colorScheme: {
light: {
root: {
'color-1': '{red.500}',
'color-2': '{blue.500}',
'color-3': '{green.500}',
'color-4': '{yellow.500}'
}
},
dark: {
root: {
'color-1': '{red.400}',
'color-2': '{blue.400}',
'color-3': '{green.400}',
'color-4': '{yellow.400}'
}
colorScheme: {
light: {
root: {
'color-1': '{red.500}',
'color-2': '{blue.500}',
'color-3': '{green.500}',
'color-4': '{yellow.500}'
}
},
dark: {
root: {
'color-1': '{red.400}',
'color-2': '{blue.400}',
'color-3': '{green.400}',
'color-4': '{yellow.400}'
}
}
}

44
components/lib/themes/primeone/presets/aura/radiobutton/index.js
View File

@ -1,27 +1,23 @@
export default {
variables: {
common: {
root: {
width: '1.25rem',
height: '1.25rem',
background: '{form.field.background}',
backgroundChecked: '{form.field.background}',
backgroundCheckedHover: '{form.field.background}',
backgroundDisabled: '{form.field.background.disabled}',
backgroundFilled: '{form.field.background.filled}',
borderColor: '{form.field.border.color}',
borderColorHover: '{form.field.border.color.hover}',
borderColorChecked: '{primary.color}',
borderColorCheckedHover: '{primary.hover.color}',
borderColorInvalid: '{form.field.border.color.invalid}',
boxShadow: '{form.field.box.shadow}'
},
icon: {
size: '0.75rem',
colorChecked: '{primary.color}',
colorCheckedHover: '{primary.hover.color}',
colorDisabled: '{form.field.text.disabled}'
}
}
root: {
width: '1.25rem',
height: '1.25rem',
background: '{form.field.background}',
backgroundChecked: '{form.field.background}',
backgroundCheckedHover: '{form.field.background}',
backgroundDisabled: '{form.field.background.disabled}',
backgroundFilled: '{form.field.background.filled}',
borderColor: '{form.field.border.color}',
borderColorHover: '{form.field.border.color.hover}',
borderColorChecked: '{primary.color}',
borderColorCheckedHover: '{primary.hover.color}',
borderColorInvalid: '{form.field.border.color.invalid}',
boxShadow: '{form.field.box.shadow}'
},
icon: {
size: '0.75rem',
colorChecked: '{primary.color}',
colorCheckedHover: '{primary.hover.color}',
colorDisabled: '{form.field.text.disabled}'
}
};

28
components/lib/themes/primeone/presets/aura/rating/index.js
View File

@ -1,19 +1,17 @@
export default {
variables: {
colorScheme: {
light: {
icon: {
color: '{surface.500}',
colorHover: '{primary.color}',
colorActive: '{primary.color}'
}
},
dark: {
icon: {
color: '{surface.400}',
colorHover: '{primary.color}',
colorActive: '{primary.color}'
}
colorScheme: {
light: {
icon: {
color: '{surface.500}',
colorHover: '{primary.color}',
colorActive: '{primary.color}'
}
},
dark: {
icon: {
color: '{surface.400}',
colorHover: '{primary.color}',
colorActive: '{primary.color}'
}
}
}

20
components/lib/themes/primeone/presets/aura/scrollpanel/index.js
View File

@ -1,15 +1,13 @@
export default {
variables: {
colorScheme: {
light: {
bar: {
background: '{surface.100}'
}
},
dark: {
bar: {
background: '{surface.800}'
}
colorScheme: {
light: {
bar: {
background: '{surface.100}'
}
},
dark: {
bar: {
background: '{surface.800}'
}
}
}

32
components/lib/themes/primeone/presets/aura/scrolltop/index.js
View File

@ -1,21 +1,19 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.800}',
backgroundHover: '{surface.700}',
textColor: '{surface.100}',
textColorHover: '{surface.0}'
}
},
dark: {
root: {
background: '{surface.800}',
backgroundHover: '{surface.700}',
textColor: '{surface.300}',
textColorHover: '{surface.200}'
}
colorScheme: {
light: {
root: {
background: '{surface.800}',
backgroundHover: '{surface.700}',
textColor: '{surface.100}',
textColorHover: '{surface.0}'
}
},
dark: {
root: {
background: '{surface.800}',
backgroundHover: '{surface.700}',
textColor: '{surface.300}',
textColorHover: '{surface.200}'
}
}
}

54
components/lib/themes/primeone/presets/aura/selectbutton/index.js
View File

@ -1,33 +1,31 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.100}',
backgroundDisabled: '{form.field.background.disabled}',
borderColorInvalid: '{form.field.border.color.invalid}'
},
item: {
backgroundChecked: '{surface.0}',
textColor: '{surface.500}',
textColorHover: '{surface.700}',
textColorChecked: '{surface.900}',
textColorDisabled: '{form.field.text.color.disabled}'
}
colorScheme: {
light: {
root: {
background: '{surface.100}',
backgroundDisabled: '{form.field.background.disabled}',
borderColorInvalid: '{form.field.border.color.invalid}'
},
dark: {
root: {
background: '{surface.950}',
backgroundDisabled: '{form.field.background.disabled}',
borderColorInvalid: '{form.field.border.color.invalid}'
},
item: {
backgroundChecked: '{surface.800}',
textColor: '{surface.400}',
textColorHover: '{surface.300}',
textColorChecked: '{surface.0}',
textColorDisabled: '{form.field.text.color.disabled}'
}
item: {
backgroundChecked: '{surface.0}',
textColor: '{surface.500}',
textColorHover: '{surface.700}',
textColorChecked: '{surface.900}',
textColorDisabled: '{form.field.text.color.disabled}'
}
},
dark: {
root: {
background: '{surface.950}',
backgroundDisabled: '{form.field.background.disabled}',
borderColorInvalid: '{form.field.border.color.invalid}'
},
item: {
backgroundChecked: '{surface.800}',
textColor: '{surface.400}',
textColorHover: '{surface.300}',
textColorChecked: '{surface.0}',
textColorDisabled: '{form.field.text.color.disabled}'
}
}
}

46
components/lib/themes/primeone/presets/aura/sidebar/index.js
View File

@ -1,29 +1,27 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
headerIcon: {
color: '{surface.500}',
colorHover: '{surface.600}',
backgroundHover: '{surface.100}'
}
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
headerIcon: {
color: '{surface.400}',
colorHover: '{surface.300}',
backgroundHover: '{surface.800}'
}
headerIcon: {
color: '{surface.500}',
colorHover: '{surface.600}',
backgroundHover: '{surface.100}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
headerIcon: {
color: '{surface.400}',
colorHover: '{surface.300}',
backgroundHover: '{surface.800}'
}
}
}

24
components/lib/themes/primeone/presets/aura/skeleton/index.js
View File

@ -1,17 +1,15 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.200}',
animationBackground: 'rgba(255,255,255,0.4)'
}
},
dark: {
root: {
background: 'rgba(255, 255, 255, 0.06)',
animationBackground: 'rgba(255, 255, 255, 0.04)'
}
colorScheme: {
light: {
root: {
background: '{surface.200}',
animationBackground: 'rgba(255,255,255,0.4)'
}
},
dark: {
root: {
background: 'rgba(255, 255, 255, 0.06)',
animationBackground: 'rgba(255, 255, 255, 0.04)'
}
}
}

50
components/lib/themes/primeone/presets/aura/slider/index.js
View File

@ -1,31 +1,29 @@
export default {
variables: {
colorScheme: {
light: {
track: {
background: '{surface.200}'
},
handle: {
background: '{surface.200}',
backgroundHover: '{surface.200}',
contentBackground: '{surface.0}'
},
range: {
background: '{primary.color}'
}
colorScheme: {
light: {
track: {
background: '{surface.200}'
},
dark: {
track: {
background: '{surface.700}'
},
handle: {
background: '{surface.700}',
backgroundHover: '{surface.700}',
contentBackground: '{surface.950}'
},
range: {
background: '{primary.color}'
}
handle: {
background: '{surface.200}',
backgroundHover: '{surface.200}',
contentBackground: '{surface.0}'
},
range: {
background: '{primary.color}'
}
},
dark: {
track: {
background: '{surface.700}'
},
handle: {
background: '{surface.700}',
backgroundHover: '{surface.700}',
contentBackground: '{surface.950}'
},
range: {
background: '{primary.color}'
}
}
}

22
components/lib/themes/primeone/presets/aura/speeddial/index.js
View File

@ -1,15 +1,13 @@
export default {
variables: {
colorScheme: {
light: {
item: {
background: '{surface.100}',
backgroundHover: '{surface.200}',
textColor: '{surface.600}',
textColorHover: '{surface.700}'
}
},
dark: {}
}
colorScheme: {
light: {
item: {
background: '{surface.100}',
backgroundHover: '{surface.200}',
textColor: '{surface.600}',
textColorHover: '{surface.700}'
}
},
dark: {}
}
};

38
components/lib/themes/primeone/presets/aura/splitter/index.js
View File

@ -1,25 +1,23 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
gutter: {
background: '{surface.200}'
}
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
gutter: {
background: '{surface.700}'
}
gutter: {
background: '{surface.200}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
gutter: {
background: '{surface.700}'
}
}
}

62
components/lib/themes/primeone/presets/aura/steps/index.js
View File

@ -1,37 +1,35 @@
export default {
variables: {
colorScheme: {
light: {
connector: {
borderColor: '{surface.200}'
},
item: {
textColor: '{surface.700}',
textColorActive: '{primary.color}'
},
marker: {
background: '{surface.0}',
backgroundActive: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.500}',
textColorActive: '{primary.color}'
}
colorScheme: {
light: {
connector: {
borderColor: '{surface.200}'
},
dark: {
connector: {
borderColor: '{surface.700}'
},
item: {
textColor: '{surface.0}',
textColorActive: '{primary.color}'
},
marker: {
background: '{surface.900}',
backgroundActive: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.400}',
textColorActive: '{primary.color}'
}
item: {
textColor: '{surface.700}',
textColorActive: '{primary.color}'
},
marker: {
background: '{surface.0}',
backgroundActive: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.500}',
textColorActive: '{primary.color}'
}
},
dark: {
connector: {
borderColor: '{surface.700}'
},
item: {
textColor: '{surface.0}',
textColorActive: '{primary.color}'
},
marker: {
background: '{surface.900}',
backgroundActive: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.400}',
textColorActive: '{primary.color}'
}
}
}

42
components/lib/themes/primeone/presets/aura/tabmenu/index.js
View File

@ -1,27 +1,25 @@
export default {
variables: {
colorScheme: {
light: {
nav: {
background: '{surface.0}',
borderColor: '{surface.200}'
},
header: {
borderColor: '{surface.200}',
textColor: '{surface.500}',
textColorHover: '{surface.700}'
}
colorScheme: {
light: {
nav: {
background: '{surface.0}',
borderColor: '{surface.200}'
},
dark: {
nav: {
background: '{surface.900}',
borderColor: '{surface.700}'
},
header: {
borderColor: '{surface.700}',
textColor: '{surface.400}',
textColorHover: '{surface.0}'
}
header: {
borderColor: '{surface.200}',
textColor: '{surface.500}',
textColorHover: '{surface.700}'
}
},
dark: {
nav: {
background: '{surface.900}',
borderColor: '{surface.700}'
},
header: {
borderColor: '{surface.700}',
textColor: '{surface.400}',
textColorHover: '{surface.0}'
}
}
}

82
components/lib/themes/primeone/presets/aura/tabview/index.js
View File

@ -1,47 +1,45 @@
export default {
variables: {
colorScheme: {
light: {
nav: {
background: '{surface.0}',
borderColor: '{surface.200}'
},
header: {
borderColor: '{surface.200}',
textColor: '{surface.500}',
textColorHover: '{surface.700}'
},
navigatorIcon: {
background: '{surface.0}',
color: '{surface.500}',
colorHover: '{surface.700}',
boxShadow: '0px 0px 10px 50px rgba(255, 255, 255, 0.6)'
},
content: {
background: '{surface.0}',
textColor: '{surface.700}'
}
colorScheme: {
light: {
nav: {
background: '{surface.0}',
borderColor: '{surface.200}'
},
dark: {
nav: {
background: '{surface.900}',
borderColor: '{surface.700}'
},
header: {
borderColor: '{surface.700}',
textColor: '{surface.400}',
textColorHover: '{surface.0}'
},
navigatorIcon: {
background: '{surface.900}',
color: '{surface.400}',
colorHover: '{surface.0}',
boxShadow: '0px 0px 10px 50px color-mix(in srgb, var(--p-surface-900), transparent 50%)'
},
content: {
background: '{surface.900}',
textColor: '{surface.0}'
}
header: {
borderColor: '{surface.200}',
textColor: '{surface.500}',
textColorHover: '{surface.700}'
},
navigatorIcon: {
background: '{surface.0}',
color: '{surface.500}',
colorHover: '{surface.700}',
boxShadow: '0px 0px 10px 50px rgba(255, 255, 255, 0.6)'
},
content: {
background: '{surface.0}',
textColor: '{surface.700}'
}
},
dark: {
nav: {
background: '{surface.900}',
borderColor: '{surface.700}'
},
header: {
borderColor: '{surface.700}',
textColor: '{surface.400}',
textColorHover: '{surface.0}'
},
navigatorIcon: {
background: '{surface.900}',
color: '{surface.400}',
colorHover: '{surface.0}',
boxShadow: '0px 0px 10px 50px color-mix(in srgb, var(--p-surface-900), transparent 50%)'
},
content: {
background: '{surface.900}',
textColor: '{surface.0}'
}
}
}

118
components/lib/themes/primeone/presets/aura/tag/index.js
View File

@ -1,65 +1,63 @@
export default {
variables: {
colorScheme: {
light: {
primary: {
background: '{primary.100}',
textColor: '{primary.700}'
},
secondary: {
background: '{surface.100}',
textColor: '{surface.600}'
},
success: {
background: '{green.100}',
textColor: '{green.700}'
},
info: {
background: '{sky.100}',
textColor: '{sky.700}'
},
warn: {
background: '{orange.100}',
textColor: '{orange.700}'
},
danger: {
background: '{red.100}',
textColor: '{red.700}'
},
contrast: {
background: '{surface.950}',
textColor: '{surface.0}'
}
colorScheme: {
light: {
primary: {
background: '{primary.100}',
textColor: '{primary.700}'
},
dark: {
primary: {
background: 'color-mix(in srgb, var(--p-primary-500), transparent 84%)',
textColor: '{primary.300}'
},
secondary: {
background: '{surface.800}',
textColor: '{surface.300}'
},
success: {
background: 'color-mix(in srgb, var(--p-green-500), transparent 84%)',
textColor: '{green.300}'
},
info: {
background: 'color-mix(in srgb, var(--p-sky-500), transparent 84%)',
textColor: '{sky.300}'
},
warn: {
background: 'color-mix(in srgb, var(--p-orange-500), transparent 84%)',
textColor: '{orange.300}'
},
danger: {
background: 'color-mix(in srgb, var(--p-red-500), transparent 84%)',
textColor: '{red.300}'
},
contrast: {
background: '{surface.0}',
textColor: '{surface.950}'
}
secondary: {
background: '{surface.100}',
textColor: '{surface.600}'
},
success: {
background: '{green.100}',
textColor: '{green.700}'
},
info: {
background: '{sky.100}',
textColor: '{sky.700}'
},
warn: {
background: '{orange.100}',
textColor: '{orange.700}'
},
danger: {
background: '{red.100}',
textColor: '{red.700}'
},
contrast: {
background: '{surface.950}',
textColor: '{surface.0}'
}
},
dark: {
primary: {
background: 'color-mix(in srgb, var(--p-primary-500), transparent 84%)',
textColor: '{primary.300}'
},
secondary: {
background: '{surface.800}',
textColor: '{surface.300}'
},
success: {
background: 'color-mix(in srgb, var(--p-green-500), transparent 84%)',
textColor: '{green.300}'
},
info: {
background: 'color-mix(in srgb, var(--p-sky-500), transparent 84%)',
textColor: '{sky.300}'
},
warn: {
background: 'color-mix(in srgb, var(--p-orange-500), transparent 84%)',
textColor: '{orange.300}'
},
danger: {
background: 'color-mix(in srgb, var(--p-red-500), transparent 84%)',
textColor: '{red.300}'
},
contrast: {
background: '{surface.0}',
textColor: '{surface.950}'
}
}
}

22
components/lib/themes/primeone/presets/aura/terminal/index.js
View File

@ -1,16 +1,14 @@
export default {
variables: {
colorScheme: {
light: {
background: '{surface.0}',
borderColor: '{surface.300}',
textColor: '{surface.700}'
},
dark: {
background: '{surface.950}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
}
colorScheme: {
light: {
background: '{surface.0}',
borderColor: '{surface.300}',
textColor: '{surface.700}'
},
dark: {
background: '{surface.950}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
}
}
};

30
components/lib/themes/primeone/presets/aura/textarea/index.js
View File

@ -1,20 +1,16 @@
export default {
variables: {
common: {
root: {
background: '{form.field.background}',
backgroundDisabled: '{form.field.background.disabled}',
backgroundFilled: '{form.field.background.filled}',
backgroundFilledFocus: '{form.field.background.filled.focus}',
borderColor: '{form.field.border.color}',
borderColorHover: '{form.field.border.color.hover}',
borderColorFocus: '{form.field.border.color.focus}',
borderColorInvalid: '{form.field.border.color.invalid}',
textColor: '{form.field.text.color}',
textColorDisabled: '{form.field.text.disabled}',
placeholderTextColor: '{form.field.placeholder.text.color}',
boxShadow: '{form.field.box.shadow}'
}
}
root: {
background: '{form.field.background}',
backgroundDisabled: '{form.field.background.disabled}',
backgroundFilled: '{form.field.background.filled}',
backgroundFilledFocus: '{form.field.background.filled.focus}',
borderColor: '{form.field.border.color}',
borderColorHover: '{form.field.border.color.hover}',
borderColorFocus: '{form.field.border.color.focus}',
borderColorInvalid: '{form.field.border.color.invalid}',
textColor: '{form.field.text.color}',
textColorDisabled: '{form.field.text.disabled}',
placeholderTextColor: '{form.field.placeholder.text.color}',
boxShadow: '{form.field.box.shadow}'
}
};

74
components/lib/themes/primeone/presets/aura/tieredmenu/index.js
View File

@ -1,47 +1,45 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
item: {
backgroundFocus: '{surface.100}',
text: {
color: '{surface.700}',
colorFocus: '{surface.800}'
},
item: {
backgroundFocus: '{surface.100}',
text: {
color: '{surface.700}',
colorFocus: '{surface.800}'
},
icon: {
color: '{surface.400}',
colorFocus: '{surface.500}'
}
},
separator: {
borderColor: '{surface.200}'
icon: {
color: '{surface.400}',
colorFocus: '{surface.500}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
separator: {
borderColor: '{surface.200}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
item: {
backgroundFocus: '{surface.800}',
text: {
color: '{surface.0}',
colorFocus: '{surface.0}'
},
item: {
backgroundFocus: '{surface.800}',
text: {
color: '{surface.0}',
colorFocus: '{surface.0}'
},
icon: {
color: '{surface.500}',
colorFocus: '{surface.400}'
}
},
separator: {
borderColor: '{surface.700}'
icon: {
color: '{surface.500}',
colorFocus: '{surface.400}'
}
},
separator: {
borderColor: '{surface.700}'
}
}
}

38
components/lib/themes/primeone/presets/aura/timeline/index.js
View File

@ -1,25 +1,23 @@
export default {
variables: {
colorScheme: {
light: {
marker: {
background: '{surface.0}',
borderColor: '{surface.200}',
contentColor: '{primary.color}'
},
connector: {
color: '{surface.200}'
}
colorScheme: {
light: {
marker: {
background: '{surface.0}',
borderColor: '{surface.200}',
contentColor: '{primary.color}'
},
dark: {
marker: {
background: '{surface.900}',
borderColor: '{surface.700}',
contentColor: '{primary.color}'
},
connector: {
color: '{surface.700}'
}
connector: {
color: '{surface.200}'
}
},
dark: {
marker: {
background: '{surface.900}',
borderColor: '{surface.700}',
contentColor: '{primary.color}'
},
connector: {
color: '{surface.700}'
}
}
}

202
components/lib/themes/primeone/presets/aura/toast/index.js
View File

@ -1,107 +1,105 @@
export default {
variables: {
colorScheme: {
light: {
blur: '1.5px',
info: {
background: 'color-mix(in srgb, {blue.50}, transparent 5%)',
borderColor: '{blue.200}',
textColor: '{blue.600}',
detailTextColor: '{surface.700}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)',
closeBackgroundHover: '{blue.100}'
},
success: {
background: 'color-mix(in srgb, {green.50}, transparent 5%)',
borderColor: '{green.200}',
textColor: '{green.600}',
detailTextColor: '{surface.700}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)',
closeBackgroundHover: '{green.100}'
},
warn: {
background: 'color-mix(in srgb,{yellow.50}, transparent 5%)',
borderColor: '{yellow.200}',
textColor: '{yellow.600}',
detailTextColor: '{surface.700}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)',
closeBackgroundHover: '{yellow.100}'
},
error: {
background: 'color-mix(in srgb, {red.50}, transparent 5%)',
borderColor: '{red.200}',
textColor: '{red.600}',
detailTextColor: '{surface.700}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)',
closeBackgroundHover: '{red.100}'
},
secondary: {
background: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.600}',
detailTextColor: '{surface.700}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)',
closeBackgroundHover: '{surface.200}'
},
contrast: {
background: '{surface.900}',
borderColor: '{surface.950}',
textColor: '{surface.50}',
detailTextColor: '{surface.0}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)',
closeBackgroundHover: '{surface.800}'
}
colorScheme: {
light: {
blur: '1.5px',
info: {
background: 'color-mix(in srgb, {blue.50}, transparent 5%)',
borderColor: '{blue.200}',
textColor: '{blue.600}',
detailTextColor: '{surface.700}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)',
closeBackgroundHover: '{blue.100}'
},
dark: {
blur: '10px',
info: {
background: 'color-mix(in srgb, {blue.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)',
textColor: '{blue.500}',
detailTextColor: '{surface.0}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
success: {
background: 'color-mix(in srgb, {green.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)',
textColor: '{green.500}',
detailTextColor: '{surface.0}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
warn: {
background: 'color-mix(in srgb, {yellow.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)',
textColor: '{yellow.500}',
detailTextColor: '{surface.0}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
error: {
background: 'color-mix(in srgb, {red.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)',
textColor: '{red.500}',
detailTextColor: '{surface.0}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
secondary: {
background: '{surface.800}',
borderColor: '{surface.700}',
textColor: '{surface.300}',
detailTextColor: '{surface.0}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)',
closeBackgroundHover: '{surface.700}'
},
contrast: {
background: '{surface.0}',
borderColor: '{surface.100}',
textColor: '{surface.950}',
detailTextColor: '{surface.950}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)',
closeBackgroundHover: '{surface.100}'
}
success: {
background: 'color-mix(in srgb, {green.50}, transparent 5%)',
borderColor: '{green.200}',
textColor: '{green.600}',
detailTextColor: '{surface.700}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)',
closeBackgroundHover: '{green.100}'
},
warn: {
background: 'color-mix(in srgb,{yellow.50}, transparent 5%)',
borderColor: '{yellow.200}',
textColor: '{yellow.600}',
detailTextColor: '{surface.700}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)',
closeBackgroundHover: '{yellow.100}'
},
error: {
background: 'color-mix(in srgb, {red.50}, transparent 5%)',
borderColor: '{red.200}',
textColor: '{red.600}',
detailTextColor: '{surface.700}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)',
closeBackgroundHover: '{red.100}'
},
secondary: {
background: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.600}',
detailTextColor: '{surface.700}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)',
closeBackgroundHover: '{surface.200}'
},
contrast: {
background: '{surface.900}',
borderColor: '{surface.950}',
textColor: '{surface.50}',
detailTextColor: '{surface.0}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)',
closeBackgroundHover: '{surface.800}'
}
},
dark: {
blur: '10px',
info: {
background: 'color-mix(in srgb, {blue.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)',
textColor: '{blue.500}',
detailTextColor: '{surface.0}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
success: {
background: 'color-mix(in srgb, {green.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)',
textColor: '{green.500}',
detailTextColor: '{surface.0}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
warn: {
background: 'color-mix(in srgb, {yellow.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)',
textColor: '{yellow.500}',
detailTextColor: '{surface.0}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
error: {
background: 'color-mix(in srgb, {red.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)',
textColor: '{red.500}',
detailTextColor: '{surface.0}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)',
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
},
secondary: {
background: '{surface.800}',
borderColor: '{surface.700}',
textColor: '{surface.300}',
detailTextColor: '{surface.0}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)',
closeBackgroundHover: '{surface.700}'
},
contrast: {
background: '{surface.0}',
borderColor: '{surface.100}',
textColor: '{surface.950}',
detailTextColor: '{surface.950}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)',
closeBackgroundHover: '{surface.100}'
}
}
}

78
components/lib/themes/primeone/presets/aura/togglebutton/index.js
View File

@ -1,45 +1,43 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.100}',
backgroundDisabled: '{form.field.background.disabled}',
borderColorInvalid: '{form.field.border.color.invalid}'
},
item: {
backgroundChecked: '{surface.0}',
textColor: '{surface.500}',
textColorHover: '{surface.700}',
textColorChecked: '{surface.900}',
textColorDisabled: '{form.field.text.color.disabled}'
},
itemIcon: {
color: '{surface.500}',
colorHover: '{surface.700}',
colorChecked: '{surface.900}',
colorDisabled: '{form.field.text.color.disabled}'
}
colorScheme: {
light: {
root: {
background: '{surface.100}',
backgroundDisabled: '{form.field.background.disabled}',
borderColorInvalid: '{form.field.border.color.invalid}'
},
dark: {
root: {
background: '{surface.950}',
backgroundDisabled: '{form.field.background.disabled}',
borderColorInvalid: '{form.field.border.color.invalid}'
},
item: {
backgroundChecked: '{surface.800}',
textColor: '{surface.400}',
textColorHover: '{surface.300}',
textColorChecked: '{surface.0}',
textColorDisabled: '{form.field.text.color.disabled}'
},
itemIcon: {
color: '{surface.400}',
colorHover: '{surface.300}',
colorChecked: '{surface.0}',
colorDisabled: '{form.field.text.color.disabled}'
}
item: {
backgroundChecked: '{surface.0}',
textColor: '{surface.500}',
textColorHover: '{surface.700}',
textColorChecked: '{surface.900}',
textColorDisabled: '{form.field.text.color.disabled}'
},
itemIcon: {
color: '{surface.500}',
colorHover: '{surface.700}',
colorChecked: '{surface.900}',
colorDisabled: '{form.field.text.color.disabled}'
}
},
dark: {
root: {
background: '{surface.950}',
backgroundDisabled: '{form.field.background.disabled}',
borderColorInvalid: '{form.field.border.color.invalid}'
},
item: {
backgroundChecked: '{surface.800}',
textColor: '{surface.400}',
textColorHover: '{surface.300}',
textColorChecked: '{surface.0}',
textColorDisabled: '{form.field.text.color.disabled}'
},
itemIcon: {
color: '{surface.400}',
colorHover: '{surface.300}',
colorChecked: '{surface.0}',
colorDisabled: '{form.field.text.color.disabled}'
}
}
}

28
components/lib/themes/primeone/presets/aura/toolbar/index.js
View File

@ -1,19 +1,17 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
}
colorScheme: {
light: {
root: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
}
},
dark: {
root: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
}
}
}

24
components/lib/themes/primeone/presets/aura/tooltip/index.js
View File

@ -1,17 +1,15 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.700}',
textColor: '{surface.0}'
}
},
dark: {
root: {
background: '{surface.700}',
textColor: '{surface.0}'
}
colorScheme: {
light: {
root: {
background: '{surface.700}',
textColor: '{surface.0}'
}
},
dark: {
root: {
background: '{surface.700}',
textColor: '{surface.0}'
}
}
}

94
components/lib/themes/primeone/presets/aura/tree/index.js
View File

@ -1,53 +1,51 @@
export default {
variables: {
colorScheme: {
light: {
root: {
background: '{surface.0}',
textColor: '{surface.700}'
},
node: {
backgroundHover: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
},
nodeIcon: {
color: '{surface.500}',
colorHover: '{surface.600}'
},
toggle: {
backgroundHover: '{surface.100}',
backgroundHoverHighlight: '{surface.0}',
color: '{surface.500}',
colorHover: '{surface.600}'
},
indeterminate: {
color: '{surface.500}'
}
colorScheme: {
light: {
root: {
background: '{surface.0}',
textColor: '{surface.700}'
},
dark: {
root: {
background: '{surface.900}',
textColor: '{surface.0}'
},
node: {
backgroundHover: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
},
nodeIcon: {
color: '{surface.400}',
colorHover: '{surface.300}'
},
toggle: {
backgroundHover: '{surface.800}',
backgroundHoverHighlight: '{surface.900}',
color: '{surface.400}',
colorHover: '{surface.300}'
},
indeterminate: {
color: '{surface.400}'
}
node: {
backgroundHover: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
},
nodeIcon: {
color: '{surface.500}',
colorHover: '{surface.600}'
},
toggle: {
backgroundHover: '{surface.100}',
backgroundHoverHighlight: '{surface.0}',
color: '{surface.500}',
colorHover: '{surface.600}'
},
indeterminate: {
color: '{surface.500}'
}
},
dark: {
root: {
background: '{surface.900}',
textColor: '{surface.0}'
},
node: {
backgroundHover: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
},
nodeIcon: {
color: '{surface.400}',
colorHover: '{surface.300}'
},
toggle: {
backgroundHover: '{surface.800}',
backgroundHoverHighlight: '{surface.900}',
color: '{surface.400}',
colorHover: '{surface.300}'
},
indeterminate: {
color: '{surface.400}'
}
}
}

194
components/lib/themes/primeone/presets/aura/treetable/index.js
View File

@ -1,103 +1,101 @@
export default {
variables: {
colorScheme: {
light: {
header: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
headerCell: {
background: '{surface.0}',
backgroundHover: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
},
row: {
background: '{surface.0}',
backgroundStriped: '{surface.50}',
backgroundHover: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
},
bodyCell: {
borderColor: '{surface.200}',
borderColorSelected: '{primary.100}'
},
footerCell: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
footer: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
resizerColor: '{primary.color}',
sortIcon: {
color: '{surface.500}',
colorHover: '{surface.600}'
},
toggle: {
backgroundHover: '{surface.100}',
backgroundHoverHighlight: '{surface.0}',
color: '{surface.500}',
colorHover: '{surface.600}'
},
indeterminate: {
color: '{surface.500}'
}
colorScheme: {
light: {
header: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
dark: {
header: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
},
headerCell: {
background: '{surface.900}',
backgroundHover: '{surface.800}',
borderColor: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
},
row: {
background: '{surface.900}',
backgroundStriped: '{surface.950}',
backgroundHover: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
},
bodyCell: {
borderColor: '{surface.800}',
borderColorSelected: '{primary.900}'
},
footerCell: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
},
footer: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
},
resizerColor: '{primary.color}',
sortIcon: {
color: '{surface.400}',
colorHover: '{surface.300}'
},
toggle: {
backgroundHover: '{surface.800}',
backgroundHoverHighlight: '{surface.900}',
color: '{surface.400}',
colorHover: '{surface.300}'
},
indeterminate: {
color: '{surface.400}'
}
headerCell: {
background: '{surface.0}',
backgroundHover: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
},
row: {
background: '{surface.0}',
backgroundStriped: '{surface.50}',
backgroundHover: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
},
bodyCell: {
borderColor: '{surface.200}',
borderColorSelected: '{primary.100}'
},
footerCell: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
footer: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
resizerColor: '{primary.color}',
sortIcon: {
color: '{surface.500}',
colorHover: '{surface.600}'
},
toggle: {
backgroundHover: '{surface.100}',
backgroundHoverHighlight: '{surface.0}',
color: '{surface.500}',
colorHover: '{surface.600}'
},
indeterminate: {
color: '{surface.500}'
}
},
dark: {
header: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
},
headerCell: {
background: '{surface.900}',
backgroundHover: '{surface.800}',
borderColor: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
},
row: {
background: '{surface.900}',
backgroundStriped: '{surface.950}',
backgroundHover: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
},
bodyCell: {
borderColor: '{surface.800}',
borderColorSelected: '{primary.900}'
},
footerCell: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
},
footer: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
},
resizerColor: '{primary.color}',
sortIcon: {
color: '{surface.400}',
colorHover: '{surface.300}'
},
toggle: {
backgroundHover: '{surface.800}',
backgroundHoverHighlight: '{surface.900}',
color: '{surface.400}',
colorHover: '{surface.300}'
},
indeterminate: {
color: '{surface.400}'
}
}
}