Migrated to new api
parent
ea10aea82b
commit
719cc84a60
|
@ -1,31 +1,29 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
header: {
|
||||||
header: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
textColor: '{surface.500}',
|
||||||
textColor: '{surface.500}',
|
textColorHover: '{surface.700}',
|
||||||
textColorHover: '{surface.700}',
|
textColorActive: '{surface.700}'
|
||||||
textColorActive: '{surface.700}'
|
|
||||||
},
|
|
||||||
content: {
|
|
||||||
background: '{surface.0}',
|
|
||||||
borderColor: '{surface.200}',
|
|
||||||
textColor: '{surface.700}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
content: {
|
||||||
header: {
|
background: '{surface.0}',
|
||||||
background: '{surface.900}',
|
borderColor: '{surface.200}',
|
||||||
textColor: '{surface.400}',
|
textColor: '{surface.700}'
|
||||||
textColorHover: '{surface.0}',
|
}
|
||||||
textColorActive: '{surface.0}'
|
},
|
||||||
},
|
dark: {
|
||||||
content: {
|
header: {
|
||||||
background: '{surface.900}',
|
background: '{surface.900}',
|
||||||
borderColor: '{surface.700}',
|
textColor: '{surface.400}',
|
||||||
textColor: '{surface.0}'
|
textColorHover: '{surface.0}',
|
||||||
}
|
textColorActive: '{surface.0}'
|
||||||
|
},
|
||||||
|
content: {
|
||||||
|
background: '{surface.900}',
|
||||||
|
borderColor: '{surface.700}',
|
||||||
|
textColor: '{surface.0}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,17 +1,15 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.200}',
|
||||||
background: '{surface.200}',
|
borderColor: '{surface.0}'
|
||||||
borderColor: '{surface.0}'
|
}
|
||||||
}
|
},
|
||||||
},
|
dark: {
|
||||||
dark: {
|
root: {
|
||||||
root: {
|
background: '{surface.700}',
|
||||||
background: '{surface.700}',
|
borderColor: '{surface.900}'
|
||||||
borderColor: '{surface.900}'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,65 +1,63 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
primary: {
|
||||||
primary: {
|
background: '{primary.color}',
|
||||||
background: '{primary.color}',
|
textColor: '{primary.inverseColor}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
secondary: {
|
||||||
primary: {
|
background: '{surface.100}',
|
||||||
background: '{primary.color}',
|
textColor: '{surface.600}'
|
||||||
textColor: '{primary.inverseColor}'
|
},
|
||||||
},
|
success: {
|
||||||
secondary: {
|
background: '{green.500}',
|
||||||
background: '{surface.800}',
|
textColor: '{surface.0}'
|
||||||
textColor: '{surface.300}'
|
},
|
||||||
},
|
info: {
|
||||||
success: {
|
background: '{sky.500}',
|
||||||
background: '{green.400}',
|
textColor: '{surface.0}'
|
||||||
textColor: '{green.950}'
|
},
|
||||||
},
|
warn: {
|
||||||
info: {
|
background: '{orange.500}',
|
||||||
background: '{sky.400}',
|
textColor: '{surface.0}'
|
||||||
textColor: '{sky.950}'
|
},
|
||||||
},
|
danger: {
|
||||||
warn: {
|
background: '{red.500}',
|
||||||
background: '{orange.400}',
|
textColor: '{surface.0}'
|
||||||
textColor: '{orange.950}'
|
},
|
||||||
},
|
contrast: {
|
||||||
danger: {
|
background: '{surface.950}',
|
||||||
background: '{red.400}',
|
textColor: '{surface.0}'
|
||||||
textColor: '{red.950}'
|
}
|
||||||
},
|
},
|
||||||
contrast: {
|
dark: {
|
||||||
background: '{surface.0}',
|
primary: {
|
||||||
textColor: '{surface.950}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,31 +1,29 @@
|
||||||
export default {
|
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: {
|
root: {
|
||||||
background: '{surface.0}'
|
background: '{surface.900}'
|
||||||
},
|
},
|
||||||
light: {
|
item: {
|
||||||
item: {
|
textColor: '{surface.400}',
|
||||||
textColor: '{surface.500}',
|
textColorHover: '{surface.0}',
|
||||||
textColorHover: '{surface.700}',
|
iconColor: '{surface.500}'
|
||||||
iconColor: '{surface.400}'
|
|
||||||
},
|
|
||||||
separator: {
|
|
||||||
color: '{surface.400}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
separator: {
|
||||||
root: {
|
color: '{surface.500}'
|
||||||
background: '{surface.900}'
|
|
||||||
},
|
|
||||||
item: {
|
|
||||||
textColor: '{surface.400}',
|
|
||||||
textColorHover: '{surface.0}',
|
|
||||||
iconColor: '{surface.500}'
|
|
||||||
},
|
|
||||||
separator: {
|
|
||||||
color: '{surface.500}'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,395 +1,393 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
primary: {
|
||||||
primary: {
|
background: '{primary.color}',
|
||||||
background: '{primary.color}',
|
backgroundHover: '{primary.hoverColor}',
|
||||||
backgroundHover: '{primary.hoverColor}',
|
backgroundActive: '{primary.activeColor}',
|
||||||
backgroundActive: '{primary.activeColor}',
|
borderColor: '{primary.color}',
|
||||||
borderColor: '{primary.color}',
|
borderColorHover: '{primary.hoverColor}',
|
||||||
borderColorHover: '{primary.hoverColor}',
|
borderColorActive: '{primary.activeColor}',
|
||||||
borderColorActive: '{primary.activeColor}',
|
textColor: '{primary.inverseColor}',
|
||||||
textColor: '{primary.inverseColor}',
|
textColorHover: '{primary.inverseColor}',
|
||||||
textColorHover: '{primary.inverseColor}',
|
textColorActive: '{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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
outlined: {
|
secondary: {
|
||||||
primary: {
|
background: '{surface.100}',
|
||||||
backgroundHover: '{primary.50}',
|
backgroundHover: '{surface.200}',
|
||||||
backgroundActive: '{primary.100}',
|
backgroundActive: '{surface.300}',
|
||||||
borderColor: '{primary.200}',
|
borderColor: '{surface.100}',
|
||||||
textColor: '{primary.color}'
|
borderColorHover: '{surface.200}',
|
||||||
},
|
borderColorActive: '{surface.300}',
|
||||||
secondary: {
|
textColor: '{surface.600}',
|
||||||
backgroundHover: '{surface.50}',
|
textColorHover: '{surface.700}',
|
||||||
backgroundActive: '{surface.100}',
|
textColorActive: '{surface.800}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
text: {
|
info: {
|
||||||
primary: {
|
background: '{sky.500}',
|
||||||
backgroundHover: '{primary.50}',
|
backgroundHover: '{sky.600}',
|
||||||
backgroundActive: '{primary.100}',
|
backgroundActive: '{sky.700}',
|
||||||
textColor: '{primary.color}'
|
borderColor: '{sky.500}',
|
||||||
},
|
borderColorHover: '{sky.600}',
|
||||||
secondary: {
|
borderColorActive: '{sky.700}',
|
||||||
backgroundHover: '{surface.50}',
|
textColor: '#ffffff',
|
||||||
backgroundActive: '{surface.100}',
|
textColorHover: '#ffffff',
|
||||||
textColor: '{surface.500}'
|
textColorActive: '#ffffff'
|
||||||
},
|
|
||||||
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: {
|
success: {
|
||||||
textColor: '{primary.color}',
|
background: '{green.500}',
|
||||||
textColorHover: '{primary.color}',
|
backgroundHover: '{green.600}',
|
||||||
textColorActive: '{primary.color}'
|
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: {
|
outlined: {
|
||||||
root: {
|
primary: {
|
||||||
primary: {
|
backgroundHover: '{primary.50}',
|
||||||
background: '{primary.color}',
|
backgroundActive: '{primary.100}',
|
||||||
backgroundHover: '{primary.hoverColor}',
|
borderColor: '{primary.200}',
|
||||||
backgroundActive: '{primary.activeColor}',
|
textColor: '{primary.color}'
|
||||||
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: {
|
secondary: {
|
||||||
primary: {
|
backgroundHover: '{surface.50}',
|
||||||
backgroundHover: 'color-mix(in srgb, {primary.color}, transparent 96%)',
|
backgroundActive: '{surface.100}',
|
||||||
backgroundActive: 'color-mix(in srgb, {primary.color}, transparent 84%)',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{primary.900}',
|
textColor: '{surface.500}'
|
||||||
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: {
|
success: {
|
||||||
primary: {
|
backgroundHover: '{green.50}',
|
||||||
backgroundHover: 'color-mix(in srgb, {primary.color}, transparent 96%)',
|
backgroundActive: '{green.100}',
|
||||||
backgroundActive: 'color-mix(in srgb, {primary.color}, transparent 84%)',
|
borderColor: '{green.200}',
|
||||||
textColor: '{primary.color}'
|
textColor: '{green.500}'
|
||||||
},
|
|
||||||
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: {
|
info: {
|
||||||
textColor: '{primary.color}',
|
backgroundHover: '{sky.50}',
|
||||||
textColorHover: '{primary.color}',
|
backgroundActive: '{sky.100}',
|
||||||
textColorActive: '{primary.color}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,23 +1,21 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
|
||||||
},
|
|
||||||
subtitle: {
|
|
||||||
textColor: '{surface.500}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
subtitle: {
|
||||||
root: {
|
textColor: '{surface.500}'
|
||||||
background: '{surface.900}',
|
}
|
||||||
textColor: '{surface.0}'
|
},
|
||||||
},
|
dark: {
|
||||||
subtitle: {
|
root: {
|
||||||
textColor: '{surface.400}'
|
background: '{surface.900}',
|
||||||
}
|
textColor: '{surface.0}'
|
||||||
|
},
|
||||||
|
subtitle: {
|
||||||
|
textColor: '{surface.400}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,29 +1,27 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
navigator: {
|
||||||
navigator: {
|
color: '{surface.500}',
|
||||||
color: '{surface.500}',
|
colorHover: '{surface.600}',
|
||||||
colorHover: '{surface.600}',
|
backgroundHover: '{surface.100}'
|
||||||
backgroundHover: '{surface.100}'
|
|
||||||
},
|
|
||||||
indicator: {
|
|
||||||
background: '{surface.200}',
|
|
||||||
backgroundHover: '{surface.300}',
|
|
||||||
backgroundActive: '{primary.color}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
indicator: {
|
||||||
navigator: {
|
background: '{surface.200}',
|
||||||
color: '{surface.400}',
|
backgroundHover: '{surface.300}',
|
||||||
colorHover: '{surface.300}',
|
backgroundActive: '{primary.color}'
|
||||||
backgroundHover: '{surface.800}'
|
}
|
||||||
},
|
},
|
||||||
indicator: {
|
dark: {
|
||||||
background: '{surface.700}',
|
navigator: {
|
||||||
backgroundHover: '{surface.600}',
|
color: '{surface.400}',
|
||||||
backgroundActive: '{primary.color}'
|
colorHover: '{surface.300}',
|
||||||
}
|
backgroundHover: '{surface.800}'
|
||||||
|
},
|
||||||
|
indicator: {
|
||||||
|
background: '{surface.700}',
|
||||||
|
backgroundHover: '{surface.600}',
|
||||||
|
backgroundActive: '{primary.color}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,29 +1,25 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
root: {
|
||||||
common: {
|
borderRadius: '{rounded.sm}',
|
||||||
root: {
|
width: '1.25rem',
|
||||||
borderRadius: '{rounded.sm}',
|
height: '1.25rem',
|
||||||
width: '1.25rem',
|
background: '{form.field.background}',
|
||||||
height: '1.25rem',
|
backgroundChecked: '{primary.color}',
|
||||||
background: '{form.field.background}',
|
backgroundCheckedHover: '{primary.hover.color}',
|
||||||
backgroundChecked: '{primary.color}',
|
backgroundDisabled: '{form.field.background.disabled}',
|
||||||
backgroundCheckedHover: '{primary.hover.color}',
|
backgroundFilled: '{form.field.background.filled}',
|
||||||
backgroundDisabled: '{form.field.background.disabled}',
|
borderColor: '{form.field.border.color}',
|
||||||
backgroundFilled: '{form.field.background.filled}',
|
borderColorHover: '{form.field.border.color.hover}',
|
||||||
borderColor: '{form.field.border.color}',
|
borderColorChecked: '{primary.color}',
|
||||||
borderColorHover: '{form.field.border.color.hover}',
|
borderColorCheckedHover: '{primary.hover.color}',
|
||||||
borderColorChecked: '{primary.color}',
|
borderColorInvalid: '{form.field.border.color.invalid}',
|
||||||
borderColorCheckedHover: '{primary.hover.color}',
|
boxShadow: '{form.field.box.shadow}'
|
||||||
borderColorInvalid: '{form.field.border.color.invalid}',
|
},
|
||||||
boxShadow: '{form.field.box.shadow}'
|
icon: {
|
||||||
},
|
size: '0.875rem',
|
||||||
icon: {
|
color: '{form.field.text.color}',
|
||||||
size: '0.875rem',
|
colorChecked: '{primary.inverse.color}',
|
||||||
color: '{form.field.text.color}',
|
colorCheckedHover: '{primary.inverse.color}',
|
||||||
colorChecked: '{primary.inverse.color}',
|
colorDisabled: '{form.field.text.disabled}'
|
||||||
colorCheckedHover: '{primary.inverse.color}',
|
|
||||||
colorDisabled: '{form.field.text.disabled}'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,17 +1,15 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.100}',
|
||||||
background: '{surface.100}',
|
textColor: '{surface.800}'
|
||||||
textColor: '{surface.800}'
|
}
|
||||||
}
|
},
|
||||||
},
|
dark: {
|
||||||
dark: {
|
root: {
|
||||||
root: {
|
background: '{surface.700}',
|
||||||
background: '{surface.700}',
|
textColor: '{surface.0}'
|
||||||
textColor: '{surface.0}'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,37 +1,33 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
root: {
|
||||||
common: {
|
background: '{form.field.background}',
|
||||||
root: {
|
backgroundDisabled: '{form.field.background.disabled}',
|
||||||
background: '{form.field.background}',
|
backgroundFilled: '{form.field.background.filled}',
|
||||||
backgroundDisabled: '{form.field.background.disabled}',
|
backgroundFilledFocus: '{form.field.background.filled.focus}',
|
||||||
backgroundFilled: '{form.field.background.filled}',
|
borderColor: '{form.field.border.color}',
|
||||||
backgroundFilledFocus: '{form.field.background.filled.focus}',
|
borderColorHover: '{form.field.border.color.hover}',
|
||||||
borderColor: '{form.field.border.color}',
|
borderColorFocus: '{form.field.border.color.focus}',
|
||||||
borderColorHover: '{form.field.border.color.hover}',
|
borderColorInvalid: '{form.field.border.color.invalid}',
|
||||||
borderColorFocus: '{form.field.border.color.focus}',
|
textColor: '{form.field.text.color}',
|
||||||
borderColorInvalid: '{form.field.border.color.invalid}',
|
textColorDisabled: '{form.field.text.disabled}',
|
||||||
textColor: '{form.field.text.color}',
|
placeholderTextColor: '{form.field.placeholder.text.color}',
|
||||||
textColorDisabled: '{form.field.text.disabled}',
|
boxShadow: '{form.field.box.shadow}'
|
||||||
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: {
|
dark: {
|
||||||
light: {
|
chip: {
|
||||||
chip: {
|
background: '{surface.700}',
|
||||||
background: '{surface.100}',
|
backgroundFocus: '{surface.600}',
|
||||||
backgroundFocus: '{surface.200}',
|
textColor: '{surface.0}',
|
||||||
textColor: '{surface.800}',
|
textColorFocus: '{surface.0}'
|
||||||
textColorFocus: '{surface.900}'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
dark: {
|
|
||||||
chip: {
|
|
||||||
background: '{surface.700}',
|
|
||||||
backgroundFocus: '{surface.600}',
|
|
||||||
textColor: '{surface.0}',
|
|
||||||
textColorFocus: '{surface.0}'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,23 +1,21 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
panel: {
|
||||||
panel: {
|
background: '{surface.800}',
|
||||||
background: '{surface.800}',
|
borderColor: '{surface.900}'
|
||||||
borderColor: '{surface.900}'
|
|
||||||
},
|
|
||||||
handle: {
|
|
||||||
color: '{surface.0}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
handle: {
|
||||||
panel: {
|
color: '{surface.0}'
|
||||||
background: '{surface.900}',
|
}
|
||||||
borderColor: '{surface.700}'
|
},
|
||||||
},
|
dark: {
|
||||||
handle: {
|
panel: {
|
||||||
color: '{surface.0}'
|
background: '{surface.900}',
|
||||||
}
|
borderColor: '{surface.700}'
|
||||||
|
},
|
||||||
|
handle: {
|
||||||
|
color: '{surface.0}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,19 +1,17 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
}
|
||||||
}
|
},
|
||||||
},
|
dark: {
|
||||||
dark: {
|
root: {
|
||||||
root: {
|
background: '{surface.900}',
|
||||||
background: '{surface.900}',
|
borderColor: '{surface.700}',
|
||||||
borderColor: '{surface.700}',
|
textColor: '{surface.0}'
|
||||||
textColor: '{surface.0}'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,47 +1,45 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
},
|
||||||
|
item: {
|
||||||
|
backgroundFocus: '{surface.100}',
|
||||||
|
text: {
|
||||||
|
color: '{surface.700}',
|
||||||
|
colorFocus: '{surface.800}'
|
||||||
},
|
},
|
||||||
item: {
|
icon: {
|
||||||
backgroundFocus: '{surface.100}',
|
color: '{surface.400}',
|
||||||
text: {
|
colorFocus: '{surface.500}'
|
||||||
color: '{surface.700}',
|
|
||||||
colorFocus: '{surface.800}'
|
|
||||||
},
|
|
||||||
icon: {
|
|
||||||
color: '{surface.400}',
|
|
||||||
colorFocus: '{surface.500}'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
separator: {
|
|
||||||
borderColor: '{surface.200}'
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
dark: {
|
separator: {
|
||||||
root: {
|
borderColor: '{surface.200}'
|
||||||
background: '{surface.900}',
|
}
|
||||||
borderColor: '{surface.700}',
|
},
|
||||||
textColor: '{surface.0}'
|
dark: {
|
||||||
|
root: {
|
||||||
|
background: '{surface.900}',
|
||||||
|
borderColor: '{surface.700}',
|
||||||
|
textColor: '{surface.0}'
|
||||||
|
},
|
||||||
|
item: {
|
||||||
|
backgroundFocus: '{surface.800}',
|
||||||
|
text: {
|
||||||
|
color: '{surface.0}',
|
||||||
|
colorFocus: '{surface.0}'
|
||||||
},
|
},
|
||||||
item: {
|
icon: {
|
||||||
backgroundFocus: '{surface.800}',
|
color: '{surface.500}',
|
||||||
text: {
|
colorFocus: '{surface.400}'
|
||||||
color: '{surface.0}',
|
|
||||||
colorFocus: '{surface.0}'
|
|
||||||
},
|
|
||||||
icon: {
|
|
||||||
color: '{surface.500}',
|
|
||||||
colorFocus: '{surface.400}'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
separator: {
|
|
||||||
borderColor: '{surface.700}'
|
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
separator: {
|
||||||
|
borderColor: '{surface.700}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,99 +1,97 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
header: {
|
||||||
header: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
headerCell: {
|
||||||
header: {
|
background: '{surface.0}',
|
||||||
background: '{surface.900}',
|
backgroundHover: '{surface.100}',
|
||||||
borderColor: '{surface.800}',
|
borderColor: '{surface.200}',
|
||||||
textColor: '{surface.0}'
|
textColor: '{surface.700}',
|
||||||
},
|
textColorHover: '{surface.800}'
|
||||||
headerCell: {
|
},
|
||||||
background: '{surface.900}',
|
row: {
|
||||||
backgroundHover: '{surface.800}',
|
background: '{surface.0}',
|
||||||
borderColor: '{surface.800}',
|
backgroundStriped: '{surface.50}',
|
||||||
textColor: '{surface.0}',
|
backgroundHover: '{surface.100}',
|
||||||
textColorHover: '{surface.0}'
|
textColor: '{surface.700}',
|
||||||
},
|
textColorHover: '{surface.800}'
|
||||||
row: {
|
},
|
||||||
background: '{surface.900}',
|
bodyCell: {
|
||||||
backgroundStriped: '{surface.950}',
|
borderColor: '{surface.200}',
|
||||||
backgroundHover: '{surface.800}',
|
borderColorSelected: '{primary.100}'
|
||||||
textColor: '{surface.0}',
|
},
|
||||||
textColorHover: '{surface.0}'
|
footerCell: {
|
||||||
},
|
background: '{surface.0}',
|
||||||
bodyCell: {
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.800}',
|
textColor: '{surface.700}'
|
||||||
borderColorSelected: '{primary.900}'
|
},
|
||||||
},
|
footer: {
|
||||||
footerCell: {
|
background: '{surface.0}',
|
||||||
background: '{surface.900}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.800}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.0}'
|
},
|
||||||
},
|
dropPointColor: '{primary.color}',
|
||||||
footer: {
|
resizerColor: '{primary.color}',
|
||||||
background: '{surface.900}',
|
sortIcon: {
|
||||||
borderColor: '{surface.800}',
|
color: '{surface.500}',
|
||||||
textColor: '{surface.0}'
|
colorHover: '{surface.600}'
|
||||||
},
|
},
|
||||||
dropPointColor: '{primary.color}',
|
rowAction: {
|
||||||
resizerColor: '{primary.color}',
|
backgroundHover: '{surface.100}',
|
||||||
sortIcon: {
|
backgroundHoverHighlight: '{surface.0}',
|
||||||
color: '{surface.400}',
|
color: '{surface.500}',
|
||||||
colorHover: '{surface.300}'
|
colorHover: '{surface.500}'
|
||||||
},
|
}
|
||||||
rowAction: {
|
},
|
||||||
backgroundHover: '{surface.800}',
|
dark: {
|
||||||
backgroundHoverHighlight: '{surface.900}',
|
header: {
|
||||||
color: '{surface.400}',
|
background: '{surface.900}',
|
||||||
colorHover: '{surface.300}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,37 +1,35 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
header: {
|
||||||
header: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
|
||||||
},
|
|
||||||
content: {
|
|
||||||
background: '{surface.0}',
|
|
||||||
textColor: '{surface.700}'
|
|
||||||
},
|
|
||||||
footer: {
|
|
||||||
background: '{surface.0}',
|
|
||||||
borderColor: '{surface.200}',
|
|
||||||
textColor: '{surface.700}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
content: {
|
||||||
header: {
|
background: '{surface.0}',
|
||||||
background: '{surface.900}',
|
textColor: '{surface.700}'
|
||||||
borderColor: '{surface.700}',
|
},
|
||||||
textColor: '{surface.0}'
|
footer: {
|
||||||
},
|
background: '{surface.0}',
|
||||||
content: {
|
borderColor: '{surface.200}',
|
||||||
background: '{surface.900}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.0}'
|
}
|
||||||
},
|
},
|
||||||
footer: {
|
dark: {
|
||||||
background: '{surface.900}',
|
header: {
|
||||||
borderColor: '{surface.700}',
|
background: '{surface.900}',
|
||||||
textColor: '{surface.0}'
|
borderColor: '{surface.700}',
|
||||||
}
|
textColor: '{surface.0}'
|
||||||
|
},
|
||||||
|
content: {
|
||||||
|
background: '{surface.900}',
|
||||||
|
textColor: '{surface.0}'
|
||||||
|
},
|
||||||
|
footer: {
|
||||||
|
background: '{surface.900}',
|
||||||
|
borderColor: '{surface.700}',
|
||||||
|
textColor: '{surface.0}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,29 +1,27 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
|
||||||
},
|
|
||||||
headerIcon: {
|
|
||||||
color: '{surface.500}',
|
|
||||||
colorHover: '{surface.600}',
|
|
||||||
backgroundHover: '{surface.100}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
headerIcon: {
|
||||||
root: {
|
color: '{surface.500}',
|
||||||
background: '{surface.900}',
|
colorHover: '{surface.600}',
|
||||||
borderColor: '{surface.700}',
|
backgroundHover: '{surface.100}'
|
||||||
textColor: '{surface.0}'
|
}
|
||||||
},
|
},
|
||||||
headerIcon: {
|
dark: {
|
||||||
color: '{surface.400}',
|
root: {
|
||||||
colorHover: '{surface.300}',
|
background: '{surface.900}',
|
||||||
backgroundHover: '{surface.800}'
|
borderColor: '{surface.700}',
|
||||||
}
|
textColor: '{surface.0}'
|
||||||
|
},
|
||||||
|
headerIcon: {
|
||||||
|
color: '{surface.400}',
|
||||||
|
colorHover: '{surface.300}',
|
||||||
|
backgroundHover: '{surface.800}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,23 +1,21 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
borderColor: '{surface.200}'
|
||||||
borderColor: '{surface.200}'
|
|
||||||
},
|
|
||||||
content: {
|
|
||||||
background: '{surface.0}',
|
|
||||||
textColor: '{surface.700}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
content: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
borderColor: '{surface.700}'
|
textColor: '{surface.700}'
|
||||||
},
|
}
|
||||||
content: {
|
},
|
||||||
background: '{surface.900}',
|
dark: {
|
||||||
textColor: '{surface.0}'
|
root: {
|
||||||
}
|
borderColor: '{surface.700}'
|
||||||
|
},
|
||||||
|
content: {
|
||||||
|
background: '{surface.900}',
|
||||||
|
textColor: '{surface.0}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,37 +1,35 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
|
||||||
},
|
|
||||||
legend: {
|
|
||||||
backgroundHover: '{surface.100}',
|
|
||||||
textColor: '{surface.700}',
|
|
||||||
textColorHover: '{surface.800}'
|
|
||||||
},
|
|
||||||
toggleIcon: {
|
|
||||||
color: '{surface.500}',
|
|
||||||
colorHover: '{surface.600}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
legend: {
|
||||||
root: {
|
backgroundHover: '{surface.100}',
|
||||||
background: '{surface.900}',
|
textColor: '{surface.700}',
|
||||||
borderColor: '{surface.700}',
|
textColorHover: '{surface.800}'
|
||||||
textColor: '{surface.0}'
|
},
|
||||||
},
|
toggleIcon: {
|
||||||
legend: {
|
color: '{surface.500}',
|
||||||
backgroundHover: '{surface.800}',
|
colorHover: '{surface.600}'
|
||||||
textColor: '{surface.0}',
|
}
|
||||||
textColorHover: '{surface.0}'
|
},
|
||||||
},
|
dark: {
|
||||||
toggleIcon: {
|
root: {
|
||||||
color: '{surface.400}',
|
background: '{surface.900}',
|
||||||
colorHover: '{surface.300}'
|
borderColor: '{surface.700}',
|
||||||
}
|
textColor: '{surface.0}'
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
backgroundHover: '{surface.800}',
|
||||||
|
textColor: '{surface.0}',
|
||||||
|
textColorHover: '{surface.0}'
|
||||||
|
},
|
||||||
|
toggleIcon: {
|
||||||
|
color: '{surface.400}',
|
||||||
|
colorHover: '{surface.300}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,83 +1,81 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
navigator: {
|
||||||
navigator: {
|
backgroundHover: 'rgba(255, 255, 255, 0.1)',
|
||||||
backgroundHover: 'rgba(255, 255, 255, 0.1)',
|
color: '{surface.100}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
thumbnailNavigator: {
|
||||||
navigator: {
|
backgroundHover: '{surface.200}',
|
||||||
backgroundHover: 'rgba(255, 255, 255, 0.1)',
|
color: '{surface.600}',
|
||||||
color: '{surface.400}'
|
colorHover: '{surface.700}'
|
||||||
},
|
},
|
||||||
thumbnailNavigator: {
|
thumbnailContainer: {
|
||||||
backgroundHover: '{surface.800}',
|
background: '{surface.50}'
|
||||||
color: '{surface.400}',
|
},
|
||||||
colorHover: '{surface.300}'
|
caption: {
|
||||||
},
|
background: 'rgba(0, 0, 0, 0.5)',
|
||||||
thumbnailContainer: {
|
textColor: '{surface.100}'
|
||||||
background: '{surface.950}'
|
},
|
||||||
},
|
indicator: {
|
||||||
caption: {
|
background: '{surface.200}',
|
||||||
background: 'rgba(0, 0, 0, 0.5)',
|
backgroundHover: '{surface.300}',
|
||||||
textColor: '{surface.100}'
|
backgroundActive: '{primary.color}'
|
||||||
},
|
},
|
||||||
indicator: {
|
insetIndicators: {
|
||||||
background: '{surface.200}',
|
background: 'rgba(0, 0, 0, 0.5)'
|
||||||
backgroundHover: '{surface.300}',
|
},
|
||||||
backgroundActive: '{primary.color}'
|
insetIndicator: {
|
||||||
},
|
background: 'rgba(255, 255, 255, 0.4)',
|
||||||
insetIndicators: {
|
backgroundHover: 'rgba(255, 255, 255, 0.4)',
|
||||||
background: 'rgba(0, 0, 0, 0.5)'
|
backgroundActive: '{primary.color}'
|
||||||
},
|
},
|
||||||
insetIndicator: {
|
mask: {
|
||||||
background: 'rgba(255, 255, 255, 0.4)',
|
background: 'rgba(0,0,0,0.9)'
|
||||||
backgroundHover: 'rgba(255, 255, 255, 0.4)',
|
},
|
||||||
backgroundActive: '{primary.color}'
|
close: {
|
||||||
},
|
backgroundHover: 'rgba(255,255,255,0.1)',
|
||||||
mask: {
|
color: '{surface.50}',
|
||||||
background: 'rgba(0,0,0,0.9)'
|
colorHover: '{surface.0}'
|
||||||
},
|
}
|
||||||
close: {
|
},
|
||||||
backgroundHover: 'rgba(255,255,255,0.1)',
|
dark: {
|
||||||
color: '{surface.50}',
|
navigator: {
|
||||||
colorHover: '{surface.0}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,33 +1,31 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
previewIndicator: {
|
||||||
previewIndicator: {
|
background: '{maskBackground}',
|
||||||
background: '{maskBackground}',
|
textColor: '{surface.200}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
mask: {
|
||||||
previewIndicator: {
|
background: 'rgba(0,0,0,0.9)'
|
||||||
background: '{maskBackground}',
|
},
|
||||||
textColor: '{surface.200}'
|
action: {
|
||||||
},
|
backgroundHover: 'rgba(255,255,255,0.1)',
|
||||||
mask: {
|
color: '{surface.50}',
|
||||||
background: 'rgba(0,0,0,0.9)'
|
colorHover: '{surface.0}'
|
||||||
},
|
}
|
||||||
action: {
|
},
|
||||||
backgroundHover: 'rgba(255,255,255,0.1)',
|
dark: {
|
||||||
color: '{surface.50}',
|
previewIndicator: {
|
||||||
colorHover: '{surface.0}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,81 +1,79 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
info: {
|
||||||
info: {
|
background: 'color-mix(in srgb, {blue.50}, transparent 5%)',
|
||||||
background: 'color-mix(in srgb, {blue.50}, transparent 5%)',
|
borderColor: '{blue.200}',
|
||||||
borderColor: '{blue.200}',
|
textColor: '{blue.600}',
|
||||||
textColor: '{blue.600}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)'
|
||||||
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%)'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
success: {
|
||||||
info: {
|
background: 'color-mix(in srgb, {green.50}, transparent 5%)',
|
||||||
background: 'color-mix(in srgb, {blue.500}, transparent 84%)',
|
borderColor: '{green.200}',
|
||||||
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)',
|
textColor: '{green.600}',
|
||||||
textColor: '{blue.500}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)'
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)'
|
},
|
||||||
},
|
warn: {
|
||||||
success: {
|
background: 'color-mix(in srgb,{yellow.50}, transparent 5%)',
|
||||||
background: 'color-mix(in srgb, {green.500}, transparent 84%)',
|
borderColor: '{yellow.200}',
|
||||||
borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)',
|
textColor: '{yellow.600}',
|
||||||
textColor: '{green.500}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)'
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)'
|
},
|
||||||
},
|
error: {
|
||||||
warn: {
|
background: 'color-mix(in srgb, {red.50}, transparent 5%)',
|
||||||
background: 'color-mix(in srgb, {yellow.500}, transparent 84%)',
|
borderColor: '{red.200}',
|
||||||
borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)',
|
textColor: '{red.600}',
|
||||||
textColor: '{yellow.500}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)'
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)'
|
},
|
||||||
},
|
secondary: {
|
||||||
error: {
|
background: '{surface.100}',
|
||||||
background: 'color-mix(in srgb, {red.500}, transparent 84%)',
|
borderColor: '{surface.200}',
|
||||||
borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)',
|
textColor: '{surface.600}',
|
||||||
textColor: '{red.500}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)'
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)'
|
},
|
||||||
},
|
contrast: {
|
||||||
secondary: {
|
background: '{surface.900}',
|
||||||
background: '{surface.800}',
|
borderColor: '{surface.950}',
|
||||||
borderColor: '{surface.700}',
|
textColor: '{surface.50}',
|
||||||
textColor: '{surface.300}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)'
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)'
|
}
|
||||||
},
|
},
|
||||||
contrast: {
|
dark: {
|
||||||
background: '{surface.0}',
|
info: {
|
||||||
borderColor: '{surface.100}',
|
background: 'color-mix(in srgb, {blue.500}, transparent 84%)',
|
||||||
textColor: '{surface.950}',
|
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)',
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)'
|
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%)'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,17 +1,15 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
display: {
|
||||||
display: {
|
backgroundHover: '{surface.100}',
|
||||||
backgroundHover: '{surface.100}',
|
textColorHover: '{surface.800}'
|
||||||
textColorHover: '{surface.800}'
|
}
|
||||||
}
|
},
|
||||||
},
|
dark: {
|
||||||
dark: {
|
display: {
|
||||||
display: {
|
backgroundHover: '{surface.800}',
|
||||||
backgroundHover: '{surface.800}',
|
textColorHover: '{surface.0}'
|
||||||
textColorHover: '{surface.0}'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,11 +1,7 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
addon: {
|
||||||
common: {
|
background: '{form.field.background.color}',
|
||||||
addon: {
|
borderColor: '{form.field.border.color}',
|
||||||
background: '{form.field.background.color}',
|
textColor: '{form.field.placeholder.color}'
|
||||||
borderColor: '{form.field.border.color}',
|
|
||||||
textColor: '{form.field.placeholder.color}'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,39 +1,37 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.300}',
|
||||||
background: '{surface.300}',
|
backgroundInvalid: '{red.400}',
|
||||||
backgroundInvalid: '{red.400}',
|
backgroundHover: '{surface.400}',
|
||||||
backgroundHover: '{surface.400}',
|
backgroundChecked: '{primary.500}',
|
||||||
backgroundChecked: '{primary.500}',
|
backgroundCheckedHover: '{primary.600}',
|
||||||
backgroundCheckedHover: '{primary.600}',
|
borderRadius: '30px'
|
||||||
borderRadius: '30px'
|
|
||||||
},
|
|
||||||
handle: {
|
|
||||||
background: '{surface.0}',
|
|
||||||
backgroundHover: '{surface.0}',
|
|
||||||
backgroundChecked: '{surface.0}',
|
|
||||||
backgroundCheckedHover: '{surface.0}',
|
|
||||||
backgroundInvalid: '{surface.0}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
handle: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.700}',
|
backgroundHover: '{surface.0}',
|
||||||
backgroundInvalid: '{red.300}',
|
backgroundChecked: '{surface.0}',
|
||||||
backgroundHover: '{surface.600}',
|
backgroundCheckedHover: '{surface.0}',
|
||||||
backgroundChecked: '{primary.400}',
|
backgroundInvalid: '{surface.0}'
|
||||||
backgroundCheckedHover: '{primary.300}',
|
}
|
||||||
borderRadius: '30px'
|
},
|
||||||
},
|
dark: {
|
||||||
handle: {
|
root: {
|
||||||
background: '{surface.400}',
|
background: '{surface.700}',
|
||||||
backgroundHover: '{surface.300}',
|
backgroundInvalid: '{red.300}',
|
||||||
backgroundChecked: '{surface.900}',
|
backgroundHover: '{surface.600}',
|
||||||
backgroundCheckedHover: '{surface.900}',
|
backgroundChecked: '{primary.400}',
|
||||||
backgroundInvalid: '{surface.900}'
|
backgroundCheckedHover: '{primary.300}',
|
||||||
}
|
borderRadius: '30px'
|
||||||
|
},
|
||||||
|
handle: {
|
||||||
|
background: '{surface.400}',
|
||||||
|
backgroundHover: '{surface.300}',
|
||||||
|
backgroundChecked: '{surface.900}',
|
||||||
|
backgroundCheckedHover: '{surface.900}',
|
||||||
|
backgroundInvalid: '{surface.900}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,20 +1,16 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
root: {
|
||||||
common: {
|
background: '{form.field.background}',
|
||||||
root: {
|
backgroundDisabled: '{form.field.background.disabled}',
|
||||||
background: '{form.field.background}',
|
backgroundFilled: '{form.field.background.filled}',
|
||||||
backgroundDisabled: '{form.field.background.disabled}',
|
backgroundFilledFocus: '{form.field.background.filled.focus}',
|
||||||
backgroundFilled: '{form.field.background.filled}',
|
borderColor: '{form.field.border.color}',
|
||||||
backgroundFilledFocus: '{form.field.background.filled.focus}',
|
borderColorHover: '{form.field.border.color.hover}',
|
||||||
borderColor: '{form.field.border.color}',
|
borderColorFocus: '{form.field.border.color.focus}',
|
||||||
borderColorHover: '{form.field.border.color.hover}',
|
borderColorInvalid: '{form.field.border.color.invalid}',
|
||||||
borderColorFocus: '{form.field.border.color.focus}',
|
textColor: '{form.field.text.color}',
|
||||||
borderColorInvalid: '{form.field.border.color.invalid}',
|
textColorDisabled: '{form.field.text.disabled}',
|
||||||
textColor: '{form.field.text.color}',
|
placeholderTextColor: '{form.field.placeholder.text.color}',
|
||||||
textColorDisabled: '{form.field.text.disabled}',
|
boxShadow: '{form.field.box.shadow}'
|
||||||
placeholderTextColor: '{form.field.placeholder.text.color}',
|
|
||||||
boxShadow: '{form.field.box.shadow}'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,63 +1,61 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
},
|
||||||
|
item: {
|
||||||
|
backgroundFocus: '{surface.100}',
|
||||||
|
text: {
|
||||||
|
color: '{surface.700}',
|
||||||
|
colorFocus: '{surface.800}'
|
||||||
},
|
},
|
||||||
item: {
|
icon: {
|
||||||
backgroundFocus: '{surface.100}',
|
color: '{surface.400}',
|
||||||
text: {
|
colorFocus: '{surface.500}'
|
||||||
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}'
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
dark: {
|
submenuHeader: {
|
||||||
root: {
|
textColor: '{surface.400}'
|
||||||
background: '{surface.900}',
|
},
|
||||||
borderColor: '{surface.700}',
|
separator: {
|
||||||
textColor: '{surface.0}'
|
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: {
|
icon: {
|
||||||
backgroundFocus: '{surface.800}',
|
color: '{surface.500}',
|
||||||
text: {
|
colorFocus: '{surface.400}'
|
||||||
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}'
|
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
submenuHeader: {
|
||||||
|
textColor: '{surface.500}'
|
||||||
|
},
|
||||||
|
separator: {
|
||||||
|
borderColor: '{surface.700}'
|
||||||
|
},
|
||||||
|
toggleIcon: {
|
||||||
|
color: '{surface.400}',
|
||||||
|
colorHover: '{surface.300}',
|
||||||
|
backgroundHover: '{surface.800}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,53 +1,51 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
},
|
||||||
|
item: {
|
||||||
|
backgroundFocus: '{surface.100}',
|
||||||
|
text: {
|
||||||
|
color: '{surface.700}',
|
||||||
|
colorFocus: '{surface.800}'
|
||||||
},
|
},
|
||||||
item: {
|
icon: {
|
||||||
backgroundFocus: '{surface.100}',
|
color: '{surface.400}',
|
||||||
text: {
|
colorFocus: '{surface.500}'
|
||||||
color: '{surface.700}',
|
|
||||||
colorFocus: '{surface.800}'
|
|
||||||
},
|
|
||||||
icon: {
|
|
||||||
color: '{surface.400}',
|
|
||||||
colorFocus: '{surface.500}'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
submenuHeader: {
|
|
||||||
textColor: '{surface.400}'
|
|
||||||
},
|
|
||||||
separator: {
|
|
||||||
borderColor: '{surface.200}'
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
dark: {
|
submenuHeader: {
|
||||||
root: {
|
textColor: '{surface.400}'
|
||||||
background: '{surface.900}',
|
},
|
||||||
borderColor: '{surface.700}',
|
separator: {
|
||||||
textColor: '{surface.0}'
|
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: {
|
icon: {
|
||||||
backgroundFocus: '{surface.800}',
|
color: '{surface.500}',
|
||||||
text: {
|
colorFocus: '{surface.400}'
|
||||||
color: '{surface.0}',
|
|
||||||
colorFocus: '{surface.0}'
|
|
||||||
},
|
|
||||||
icon: {
|
|
||||||
color: '{surface.500}',
|
|
||||||
colorFocus: '{surface.400}'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
submenuHeader: {
|
|
||||||
textColor: '{surface.500}'
|
|
||||||
},
|
|
||||||
separator: {
|
|
||||||
borderColor: '{surface.700}'
|
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
submenuHeader: {
|
||||||
|
textColor: '{surface.500}'
|
||||||
|
},
|
||||||
|
separator: {
|
||||||
|
borderColor: '{surface.700}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,57 +1,55 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
},
|
||||||
|
item: {
|
||||||
|
backgroundFocus: '{surface.100}',
|
||||||
|
text: {
|
||||||
|
color: '{surface.700}',
|
||||||
|
colorFocus: '{surface.800}'
|
||||||
},
|
},
|
||||||
item: {
|
icon: {
|
||||||
backgroundFocus: '{surface.100}',
|
color: '{surface.400}',
|
||||||
text: {
|
colorFocus: '{surface.500}'
|
||||||
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}'
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
dark: {
|
separator: {
|
||||||
root: {
|
borderColor: '{surface.200}'
|
||||||
background: '{surface.900}',
|
},
|
||||||
borderColor: '{surface.700}',
|
mobileToggle: {
|
||||||
textColor: '{surface.0}'
|
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: {
|
icon: {
|
||||||
backgroundFocus: '{surface.800}',
|
color: '{surface.500}',
|
||||||
text: {
|
colorFocus: '{surface.400}'
|
||||||
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}'
|
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
separator: {
|
||||||
|
borderColor: '{surface.700}'
|
||||||
|
},
|
||||||
|
mobileToggle: {
|
||||||
|
color: '{surface.400}',
|
||||||
|
colorHover: '{surface.300}',
|
||||||
|
backgroundHover: '{surface.800}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,93 +1,91 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
info: {
|
||||||
info: {
|
background: 'color-mix(in srgb, {blue.50}, transparent 5%)',
|
||||||
background: 'color-mix(in srgb, {blue.50}, transparent 5%)',
|
borderColor: '{blue.200}',
|
||||||
borderColor: '{blue.200}',
|
textColor: '{blue.600}',
|
||||||
textColor: '{blue.600}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)',
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)',
|
closeBackgroundHover: '{blue.100}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
success: {
|
||||||
info: {
|
background: 'color-mix(in srgb, {green.50}, transparent 5%)',
|
||||||
background: 'color-mix(in srgb, {blue.500}, transparent 84%)',
|
borderColor: '{green.200}',
|
||||||
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)',
|
textColor: '{green.600}',
|
||||||
textColor: '{blue.500}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)',
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)',
|
closeBackgroundHover: '{green.100}'
|
||||||
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
|
},
|
||||||
},
|
warn: {
|
||||||
success: {
|
background: 'color-mix(in srgb,{yellow.50}, transparent 5%)',
|
||||||
background: 'color-mix(in srgb, {green.500}, transparent 84%)',
|
borderColor: '{yellow.200}',
|
||||||
borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)',
|
textColor: '{yellow.600}',
|
||||||
textColor: '{green.500}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)',
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)',
|
closeBackgroundHover: '{yellow.100}'
|
||||||
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
|
},
|
||||||
},
|
error: {
|
||||||
warn: {
|
background: 'color-mix(in srgb, {red.50}, transparent 5%)',
|
||||||
background: 'color-mix(in srgb, {yellow.500}, transparent 84%)',
|
borderColor: '{red.200}',
|
||||||
borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)',
|
textColor: '{red.600}',
|
||||||
textColor: '{yellow.500}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)',
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)',
|
closeBackgroundHover: '{red.100}'
|
||||||
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
|
},
|
||||||
},
|
secondary: {
|
||||||
error: {
|
background: '{surface.100}',
|
||||||
background: 'color-mix(in srgb, {red.500}, transparent 84%)',
|
borderColor: '{surface.200}',
|
||||||
borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)',
|
textColor: '{surface.600}',
|
||||||
textColor: '{red.500}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)',
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)',
|
closeBackgroundHover: '{surface.200}'
|
||||||
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
|
},
|
||||||
},
|
contrast: {
|
||||||
secondary: {
|
background: '{surface.900}',
|
||||||
background: '{surface.800}',
|
borderColor: '{surface.950}',
|
||||||
borderColor: '{surface.700}',
|
textColor: '{surface.50}',
|
||||||
textColor: '{surface.300}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)',
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)',
|
closeBackgroundHover: '{surface.800}'
|
||||||
closeBackgroundHover: '{surface.700}'
|
}
|
||||||
},
|
},
|
||||||
contrast: {
|
dark: {
|
||||||
background: '{surface.0}',
|
info: {
|
||||||
borderColor: '{surface.100}',
|
background: 'color-mix(in srgb, {blue.500}, transparent 84%)',
|
||||||
textColor: '{surface.950}',
|
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)',
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)',
|
textColor: '{blue.500}',
|
||||||
closeBackgroundHover: '{surface.100}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,15 +1,13 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
meters: {
|
||||||
meters: {
|
background: '{surface.200}'
|
||||||
background: '{surface.200}'
|
}
|
||||||
}
|
},
|
||||||
},
|
dark: {
|
||||||
dark: {
|
meters: {
|
||||||
meters: {
|
background: '{surface.700}'
|
||||||
background: '{surface.700}'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,61 +1,59 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
list: {
|
||||||
list: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
header: {
|
||||||
list: {
|
textColor: '{surface.500}'
|
||||||
background: '{surface.900}',
|
},
|
||||||
borderColor: '{surface.700}'
|
item: {
|
||||||
},
|
background: 'transparent',
|
||||||
header: {
|
backgroundHover: '{surface.100}',
|
||||||
textColor: '{surface.400}'
|
backgroundFocus: '{surface.100}',
|
||||||
},
|
textColor: '{surface.700}',
|
||||||
item: {
|
textColorHover: '{surface.800}',
|
||||||
background: 'transparent',
|
textColorFocus: '{surface.800}'
|
||||||
backgroundHover: '{surface.800}',
|
},
|
||||||
backgroundFocus: '{surface.800}',
|
control: {
|
||||||
textColor: '{surface.0}',
|
background: '{surface.100}',
|
||||||
textColorHover: '{surface.0}',
|
backgroundHover: '{surface.200}',
|
||||||
textColorFocus: '{surface.0}'
|
backgroundActive: '{surface.300}',
|
||||||
},
|
borderColor: '{surface.100}',
|
||||||
control: {
|
borderColorHover: '{surface.200}',
|
||||||
background: '{surface.800}',
|
borderColorActive: '{surface.300}',
|
||||||
backgroundHover: '{surface.700}',
|
textColor: '{surface.600}',
|
||||||
backgroundActive: '{surface.600}',
|
textColorHover: '{surface.700}',
|
||||||
borderColor: '{surface.800}',
|
textColorActive: '{surface.800}'
|
||||||
borderColorHover: '{surface.700}',
|
}
|
||||||
borderColorActive: '{surface.600}',
|
},
|
||||||
textColor: '{surface.300}',
|
dark: {
|
||||||
textColorHover: '{surface.200}',
|
list: {
|
||||||
textColorActive: '{surface.100}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,24 +1,22 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
node: {
|
||||||
node: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
backgroundHover: '{surface.100}',
|
||||||
backgroundHover: '{surface.100}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}',
|
||||||
textColor: '{surface.700}',
|
textColorHover: '{surface.800}'
|
||||||
textColorHover: '{surface.800}'
|
|
||||||
},
|
|
||||||
toggleIcon: {
|
|
||||||
background: '{surface.0}',
|
|
||||||
borderColor: '{surface.200}',
|
|
||||||
color: '{surface.500}'
|
|
||||||
},
|
|
||||||
connector: {
|
|
||||||
color: '{surface.200}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {}
|
toggleIcon: {
|
||||||
}
|
background: '{surface.0}',
|
||||||
|
borderColor: '{surface.200}',
|
||||||
|
color: '{surface.500}'
|
||||||
|
},
|
||||||
|
connector: {
|
||||||
|
color: '{surface.200}'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
dark: {}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,29 +1,27 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
|
||||||
},
|
|
||||||
closeIcon: {
|
|
||||||
color: '{surface.500}',
|
|
||||||
colorHover: '{surface.600}',
|
|
||||||
backgroundHover: '{surface.100}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
closeIcon: {
|
||||||
root: {
|
color: '{surface.500}',
|
||||||
background: '{surface.900}',
|
colorHover: '{surface.600}',
|
||||||
borderColor: '{surface.700}',
|
backgroundHover: '{surface.100}'
|
||||||
textColor: '{surface.0}'
|
}
|
||||||
},
|
},
|
||||||
closeIcon: {
|
dark: {
|
||||||
color: '{surface.400}',
|
root: {
|
||||||
colorHover: '{surface.300}',
|
background: '{surface.900}',
|
||||||
backgroundHover: '{surface.800}'
|
borderColor: '{surface.700}',
|
||||||
}
|
textColor: '{surface.0}'
|
||||||
|
},
|
||||||
|
closeIcon: {
|
||||||
|
color: '{surface.400}',
|
||||||
|
colorHover: '{surface.300}',
|
||||||
|
backgroundHover: '{surface.800}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,33 +1,31 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
|
||||||
},
|
|
||||||
navigator: {
|
|
||||||
backgroundHover: '{surface.100}',
|
|
||||||
color: '{surface.500}',
|
|
||||||
colorHover: '{surface.600}'
|
|
||||||
},
|
|
||||||
currentPageReport: {
|
|
||||||
textColor: '{surface.500}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
navigator: {
|
||||||
root: {
|
backgroundHover: '{surface.100}',
|
||||||
background: '{surface.900}',
|
color: '{surface.500}',
|
||||||
textColor: '{surface.0}'
|
colorHover: '{surface.600}'
|
||||||
},
|
},
|
||||||
navigator: {
|
currentPageReport: {
|
||||||
backgroundHover: '{surface.800}',
|
textColor: '{surface.500}'
|
||||||
color: '{surface.400}',
|
}
|
||||||
colorHover: '{surface.300}'
|
},
|
||||||
},
|
dark: {
|
||||||
currentPageReport: {
|
root: {
|
||||||
textColor: '{surface.400}'
|
background: '{surface.900}',
|
||||||
}
|
textColor: '{surface.0}'
|
||||||
|
},
|
||||||
|
navigator: {
|
||||||
|
backgroundHover: '{surface.800}',
|
||||||
|
color: '{surface.400}',
|
||||||
|
colorHover: '{surface.300}'
|
||||||
|
},
|
||||||
|
currentPageReport: {
|
||||||
|
textColor: '{surface.400}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,29 +1,27 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
|
||||||
},
|
|
||||||
headerIcon: {
|
|
||||||
color: '{surface.500}',
|
|
||||||
colorHover: '{surface.600}',
|
|
||||||
backgroundHover: '{surface.100}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
headerIcon: {
|
||||||
root: {
|
color: '{surface.500}',
|
||||||
background: '{surface.900}',
|
colorHover: '{surface.600}',
|
||||||
borderColor: '{surface.700}',
|
backgroundHover: '{surface.100}'
|
||||||
textColor: '{surface.0}'
|
}
|
||||||
},
|
},
|
||||||
headerIcon: {
|
dark: {
|
||||||
color: '{surface.400}',
|
root: {
|
||||||
colorHover: '{surface.300}',
|
background: '{surface.900}',
|
||||||
backgroundHover: '{surface.800}'
|
borderColor: '{surface.700}',
|
||||||
}
|
textColor: '{surface.0}'
|
||||||
|
},
|
||||||
|
headerIcon: {
|
||||||
|
color: '{surface.400}',
|
||||||
|
colorHover: '{surface.300}',
|
||||||
|
backgroundHover: '{surface.800}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,40 +1,38 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
panel: {
|
||||||
panel: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
|
||||||
},
|
|
||||||
item: {
|
|
||||||
backgroundFocus: '{surface.100}',
|
|
||||||
text: {
|
|
||||||
color: '{surface.700}',
|
|
||||||
colorFocus: '{surface.800}'
|
|
||||||
},
|
|
||||||
icon: {
|
|
||||||
color: '{surface.400}',
|
|
||||||
colorFocus: '{surface.500}'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
item: {
|
||||||
panel: {
|
backgroundFocus: '{surface.100}',
|
||||||
background: '{surface.900}',
|
text: {
|
||||||
borderColor: '{surface.700}',
|
color: '{surface.700}',
|
||||||
textColor: '{surface.0}'
|
colorFocus: '{surface.800}'
|
||||||
},
|
},
|
||||||
item: {
|
icon: {
|
||||||
backgroundFocus: '{surface.800}',
|
color: '{surface.400}',
|
||||||
text: {
|
colorFocus: '{surface.500}'
|
||||||
color: '{surface.0}',
|
}
|
||||||
colorFocus: '{surface.0}'
|
}
|
||||||
},
|
},
|
||||||
icon: {
|
dark: {
|
||||||
color: '{surface.500}',
|
panel: {
|
||||||
colorFocus: '{surface.400}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,41 +1,39 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
meter: {
|
||||||
meter: {
|
borderColor: '{surface.200}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
icon: {
|
||||||
meter: {
|
color: '{surface.500}'
|
||||||
borderColor: '{surface.700}'
|
},
|
||||||
},
|
strength: {
|
||||||
icon: {
|
backgroundWeak: '{red.500}',
|
||||||
color: '{surface.400}'
|
backgroundMedium: '{amber.500}',
|
||||||
},
|
backgroundStrong: '{green.500}'
|
||||||
strength: {
|
},
|
||||||
backgroundWeak: '{red.400}',
|
overlay: {
|
||||||
backgroundMedium: '{amber.400}',
|
background: '{surface.0}',
|
||||||
backgroundStrong: '{green.400}'
|
borderColor: '{surface.200}',
|
||||||
},
|
textColor: '{surface.700}'
|
||||||
overlay: {
|
}
|
||||||
background: '{surface.900}',
|
},
|
||||||
borderColor: '{surface.700}',
|
dark: {
|
||||||
textColor: '{surface.0}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,61 +1,59 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
list: {
|
||||||
list: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
header: {
|
||||||
list: {
|
textColor: '{surface.500}'
|
||||||
background: '{surface.900}',
|
},
|
||||||
borderColor: '{surface.700}'
|
item: {
|
||||||
},
|
background: 'transparent',
|
||||||
header: {
|
backgroundHover: '{surface.100}',
|
||||||
textColor: '{surface.400}'
|
backgroundFocus: '{surface.100}',
|
||||||
},
|
textColor: '{surface.700}',
|
||||||
item: {
|
textColorHover: '{surface.800}',
|
||||||
background: 'transparent',
|
textColorFocus: '{surface.800}'
|
||||||
backgroundHover: '{surface.800}',
|
},
|
||||||
backgroundFocus: '{surface.800}',
|
control: {
|
||||||
textColor: '{surface.0}',
|
background: '{surface.100}',
|
||||||
textColorHover: '{surface.0}',
|
backgroundHover: '{surface.200}',
|
||||||
textColorFocus: '{surface.0}'
|
backgroundActive: '{surface.300}',
|
||||||
},
|
borderColor: '{surface.100}',
|
||||||
control: {
|
borderColorHover: '{surface.200}',
|
||||||
background: '{surface.800}',
|
borderColorActive: '{surface.300}',
|
||||||
backgroundHover: '{surface.700}',
|
textColor: '{surface.600}',
|
||||||
backgroundActive: '{surface.600}',
|
textColorHover: '{surface.700}',
|
||||||
borderColor: '{surface.800}',
|
textColorActive: '{surface.800}'
|
||||||
borderColorHover: '{surface.700}',
|
}
|
||||||
borderColorActive: '{surface.600}',
|
},
|
||||||
textColor: '{surface.300}',
|
dark: {
|
||||||
textColorHover: '{surface.200}',
|
list: {
|
||||||
textColorActive: '{surface.100}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,15 +1,13 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.200}'
|
||||||
background: '{surface.200}'
|
}
|
||||||
}
|
},
|
||||||
},
|
dark: {
|
||||||
dark: {
|
root: {
|
||||||
root: {
|
background: '{surface.700}'
|
||||||
background: '{surface.700}'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,21 +1,19 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
'color-1': '{red.500}',
|
||||||
'color-1': '{red.500}',
|
'color-2': '{blue.500}',
|
||||||
'color-2': '{blue.500}',
|
'color-3': '{green.500}',
|
||||||
'color-3': '{green.500}',
|
'color-4': '{yellow.500}'
|
||||||
'color-4': '{yellow.500}'
|
}
|
||||||
}
|
},
|
||||||
},
|
dark: {
|
||||||
dark: {
|
root: {
|
||||||
root: {
|
'color-1': '{red.400}',
|
||||||
'color-1': '{red.400}',
|
'color-2': '{blue.400}',
|
||||||
'color-2': '{blue.400}',
|
'color-3': '{green.400}',
|
||||||
'color-3': '{green.400}',
|
'color-4': '{yellow.400}'
|
||||||
'color-4': '{yellow.400}'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,27 +1,23 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
root: {
|
||||||
common: {
|
width: '1.25rem',
|
||||||
root: {
|
height: '1.25rem',
|
||||||
width: '1.25rem',
|
background: '{form.field.background}',
|
||||||
height: '1.25rem',
|
backgroundChecked: '{form.field.background}',
|
||||||
background: '{form.field.background}',
|
backgroundCheckedHover: '{form.field.background}',
|
||||||
backgroundChecked: '{form.field.background}',
|
backgroundDisabled: '{form.field.background.disabled}',
|
||||||
backgroundCheckedHover: '{form.field.background}',
|
backgroundFilled: '{form.field.background.filled}',
|
||||||
backgroundDisabled: '{form.field.background.disabled}',
|
borderColor: '{form.field.border.color}',
|
||||||
backgroundFilled: '{form.field.background.filled}',
|
borderColorHover: '{form.field.border.color.hover}',
|
||||||
borderColor: '{form.field.border.color}',
|
borderColorChecked: '{primary.color}',
|
||||||
borderColorHover: '{form.field.border.color.hover}',
|
borderColorCheckedHover: '{primary.hover.color}',
|
||||||
borderColorChecked: '{primary.color}',
|
borderColorInvalid: '{form.field.border.color.invalid}',
|
||||||
borderColorCheckedHover: '{primary.hover.color}',
|
boxShadow: '{form.field.box.shadow}'
|
||||||
borderColorInvalid: '{form.field.border.color.invalid}',
|
},
|
||||||
boxShadow: '{form.field.box.shadow}'
|
icon: {
|
||||||
},
|
size: '0.75rem',
|
||||||
icon: {
|
colorChecked: '{primary.color}',
|
||||||
size: '0.75rem',
|
colorCheckedHover: '{primary.hover.color}',
|
||||||
colorChecked: '{primary.color}',
|
colorDisabled: '{form.field.text.disabled}'
|
||||||
colorCheckedHover: '{primary.hover.color}',
|
|
||||||
colorDisabled: '{form.field.text.disabled}'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,19 +1,17 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
icon: {
|
||||||
icon: {
|
color: '{surface.500}',
|
||||||
color: '{surface.500}',
|
colorHover: '{primary.color}',
|
||||||
colorHover: '{primary.color}',
|
colorActive: '{primary.color}'
|
||||||
colorActive: '{primary.color}'
|
}
|
||||||
}
|
},
|
||||||
},
|
dark: {
|
||||||
dark: {
|
icon: {
|
||||||
icon: {
|
color: '{surface.400}',
|
||||||
color: '{surface.400}',
|
colorHover: '{primary.color}',
|
||||||
colorHover: '{primary.color}',
|
colorActive: '{primary.color}'
|
||||||
colorActive: '{primary.color}'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,15 +1,13 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
bar: {
|
||||||
bar: {
|
background: '{surface.100}'
|
||||||
background: '{surface.100}'
|
}
|
||||||
}
|
},
|
||||||
},
|
dark: {
|
||||||
dark: {
|
bar: {
|
||||||
bar: {
|
background: '{surface.800}'
|
||||||
background: '{surface.800}'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,21 +1,19 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.800}',
|
||||||
background: '{surface.800}',
|
backgroundHover: '{surface.700}',
|
||||||
backgroundHover: '{surface.700}',
|
textColor: '{surface.100}',
|
||||||
textColor: '{surface.100}',
|
textColorHover: '{surface.0}'
|
||||||
textColorHover: '{surface.0}'
|
}
|
||||||
}
|
},
|
||||||
},
|
dark: {
|
||||||
dark: {
|
root: {
|
||||||
root: {
|
background: '{surface.800}',
|
||||||
background: '{surface.800}',
|
backgroundHover: '{surface.700}',
|
||||||
backgroundHover: '{surface.700}',
|
textColor: '{surface.300}',
|
||||||
textColor: '{surface.300}',
|
textColorHover: '{surface.200}'
|
||||||
textColorHover: '{surface.200}'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,33 +1,31 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.100}',
|
||||||
background: '{surface.100}',
|
backgroundDisabled: '{form.field.background.disabled}',
|
||||||
backgroundDisabled: '{form.field.background.disabled}',
|
borderColorInvalid: '{form.field.border.color.invalid}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
item: {
|
||||||
root: {
|
backgroundChecked: '{surface.0}',
|
||||||
background: '{surface.950}',
|
textColor: '{surface.500}',
|
||||||
backgroundDisabled: '{form.field.background.disabled}',
|
textColorHover: '{surface.700}',
|
||||||
borderColorInvalid: '{form.field.border.color.invalid}'
|
textColorChecked: '{surface.900}',
|
||||||
},
|
textColorDisabled: '{form.field.text.color.disabled}'
|
||||||
item: {
|
}
|
||||||
backgroundChecked: '{surface.800}',
|
},
|
||||||
textColor: '{surface.400}',
|
dark: {
|
||||||
textColorHover: '{surface.300}',
|
root: {
|
||||||
textColorChecked: '{surface.0}',
|
background: '{surface.950}',
|
||||||
textColorDisabled: '{form.field.text.color.disabled}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,29 +1,27 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
|
||||||
},
|
|
||||||
headerIcon: {
|
|
||||||
color: '{surface.500}',
|
|
||||||
colorHover: '{surface.600}',
|
|
||||||
backgroundHover: '{surface.100}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
headerIcon: {
|
||||||
root: {
|
color: '{surface.500}',
|
||||||
background: '{surface.900}',
|
colorHover: '{surface.600}',
|
||||||
borderColor: '{surface.700}',
|
backgroundHover: '{surface.100}'
|
||||||
textColor: '{surface.0}'
|
}
|
||||||
},
|
},
|
||||||
headerIcon: {
|
dark: {
|
||||||
color: '{surface.400}',
|
root: {
|
||||||
colorHover: '{surface.300}',
|
background: '{surface.900}',
|
||||||
backgroundHover: '{surface.800}'
|
borderColor: '{surface.700}',
|
||||||
}
|
textColor: '{surface.0}'
|
||||||
|
},
|
||||||
|
headerIcon: {
|
||||||
|
color: '{surface.400}',
|
||||||
|
colorHover: '{surface.300}',
|
||||||
|
backgroundHover: '{surface.800}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,17 +1,15 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.200}',
|
||||||
background: '{surface.200}',
|
animationBackground: 'rgba(255,255,255,0.4)'
|
||||||
animationBackground: 'rgba(255,255,255,0.4)'
|
}
|
||||||
}
|
},
|
||||||
},
|
dark: {
|
||||||
dark: {
|
root: {
|
||||||
root: {
|
background: 'rgba(255, 255, 255, 0.06)',
|
||||||
background: 'rgba(255, 255, 255, 0.06)',
|
animationBackground: 'rgba(255, 255, 255, 0.04)'
|
||||||
animationBackground: 'rgba(255, 255, 255, 0.04)'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,31 +1,29 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
track: {
|
||||||
track: {
|
background: '{surface.200}'
|
||||||
background: '{surface.200}'
|
|
||||||
},
|
|
||||||
handle: {
|
|
||||||
background: '{surface.200}',
|
|
||||||
backgroundHover: '{surface.200}',
|
|
||||||
contentBackground: '{surface.0}'
|
|
||||||
},
|
|
||||||
range: {
|
|
||||||
background: '{primary.color}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
handle: {
|
||||||
track: {
|
background: '{surface.200}',
|
||||||
background: '{surface.700}'
|
backgroundHover: '{surface.200}',
|
||||||
},
|
contentBackground: '{surface.0}'
|
||||||
handle: {
|
},
|
||||||
background: '{surface.700}',
|
range: {
|
||||||
backgroundHover: '{surface.700}',
|
background: '{primary.color}'
|
||||||
contentBackground: '{surface.950}'
|
}
|
||||||
},
|
},
|
||||||
range: {
|
dark: {
|
||||||
background: '{primary.color}'
|
track: {
|
||||||
}
|
background: '{surface.700}'
|
||||||
|
},
|
||||||
|
handle: {
|
||||||
|
background: '{surface.700}',
|
||||||
|
backgroundHover: '{surface.700}',
|
||||||
|
contentBackground: '{surface.950}'
|
||||||
|
},
|
||||||
|
range: {
|
||||||
|
background: '{primary.color}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,15 +1,13 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
item: {
|
||||||
item: {
|
background: '{surface.100}',
|
||||||
background: '{surface.100}',
|
backgroundHover: '{surface.200}',
|
||||||
backgroundHover: '{surface.200}',
|
textColor: '{surface.600}',
|
||||||
textColor: '{surface.600}',
|
textColorHover: '{surface.700}'
|
||||||
textColorHover: '{surface.700}'
|
}
|
||||||
}
|
},
|
||||||
},
|
dark: {}
|
||||||
dark: {}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,25 +1,23 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
|
||||||
},
|
|
||||||
gutter: {
|
|
||||||
background: '{surface.200}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
gutter: {
|
||||||
root: {
|
background: '{surface.200}'
|
||||||
background: '{surface.900}',
|
}
|
||||||
borderColor: '{surface.700}',
|
},
|
||||||
textColor: '{surface.0}'
|
dark: {
|
||||||
},
|
root: {
|
||||||
gutter: {
|
background: '{surface.900}',
|
||||||
background: '{surface.700}'
|
borderColor: '{surface.700}',
|
||||||
}
|
textColor: '{surface.0}'
|
||||||
|
},
|
||||||
|
gutter: {
|
||||||
|
background: '{surface.700}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,37 +1,35 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
connector: {
|
||||||
connector: {
|
borderColor: '{surface.200}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
item: {
|
||||||
connector: {
|
textColor: '{surface.700}',
|
||||||
borderColor: '{surface.700}'
|
textColorActive: '{primary.color}'
|
||||||
},
|
},
|
||||||
item: {
|
marker: {
|
||||||
textColor: '{surface.0}',
|
background: '{surface.0}',
|
||||||
textColorActive: '{primary.color}'
|
backgroundActive: '{surface.0}',
|
||||||
},
|
borderColor: '{surface.200}',
|
||||||
marker: {
|
textColor: '{surface.500}',
|
||||||
background: '{surface.900}',
|
textColorActive: '{primary.color}'
|
||||||
backgroundActive: '{surface.900}',
|
}
|
||||||
borderColor: '{surface.700}',
|
},
|
||||||
textColor: '{surface.400}',
|
dark: {
|
||||||
textColorActive: '{primary.color}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,27 +1,25 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
nav: {
|
||||||
nav: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}'
|
||||||
borderColor: '{surface.200}'
|
|
||||||
},
|
|
||||||
header: {
|
|
||||||
borderColor: '{surface.200}',
|
|
||||||
textColor: '{surface.500}',
|
|
||||||
textColorHover: '{surface.700}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
header: {
|
||||||
nav: {
|
borderColor: '{surface.200}',
|
||||||
background: '{surface.900}',
|
textColor: '{surface.500}',
|
||||||
borderColor: '{surface.700}'
|
textColorHover: '{surface.700}'
|
||||||
},
|
}
|
||||||
header: {
|
},
|
||||||
borderColor: '{surface.700}',
|
dark: {
|
||||||
textColor: '{surface.400}',
|
nav: {
|
||||||
textColorHover: '{surface.0}'
|
background: '{surface.900}',
|
||||||
}
|
borderColor: '{surface.700}'
|
||||||
|
},
|
||||||
|
header: {
|
||||||
|
borderColor: '{surface.700}',
|
||||||
|
textColor: '{surface.400}',
|
||||||
|
textColorHover: '{surface.0}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,47 +1,45 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
nav: {
|
||||||
nav: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
header: {
|
||||||
nav: {
|
borderColor: '{surface.200}',
|
||||||
background: '{surface.900}',
|
textColor: '{surface.500}',
|
||||||
borderColor: '{surface.700}'
|
textColorHover: '{surface.700}'
|
||||||
},
|
},
|
||||||
header: {
|
navigatorIcon: {
|
||||||
borderColor: '{surface.700}',
|
background: '{surface.0}',
|
||||||
textColor: '{surface.400}',
|
color: '{surface.500}',
|
||||||
textColorHover: '{surface.0}'
|
colorHover: '{surface.700}',
|
||||||
},
|
boxShadow: '0px 0px 10px 50px rgba(255, 255, 255, 0.6)'
|
||||||
navigatorIcon: {
|
},
|
||||||
background: '{surface.900}',
|
content: {
|
||||||
color: '{surface.400}',
|
background: '{surface.0}',
|
||||||
colorHover: '{surface.0}',
|
textColor: '{surface.700}'
|
||||||
boxShadow: '0px 0px 10px 50px color-mix(in srgb, var(--p-surface-900), transparent 50%)'
|
}
|
||||||
},
|
},
|
||||||
content: {
|
dark: {
|
||||||
background: '{surface.900}',
|
nav: {
|
||||||
textColor: '{surface.0}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,65 +1,63 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
primary: {
|
||||||
primary: {
|
background: '{primary.100}',
|
||||||
background: '{primary.100}',
|
textColor: '{primary.700}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
secondary: {
|
||||||
primary: {
|
background: '{surface.100}',
|
||||||
background: 'color-mix(in srgb, var(--p-primary-500), transparent 84%)',
|
textColor: '{surface.600}'
|
||||||
textColor: '{primary.300}'
|
},
|
||||||
},
|
success: {
|
||||||
secondary: {
|
background: '{green.100}',
|
||||||
background: '{surface.800}',
|
textColor: '{green.700}'
|
||||||
textColor: '{surface.300}'
|
},
|
||||||
},
|
info: {
|
||||||
success: {
|
background: '{sky.100}',
|
||||||
background: 'color-mix(in srgb, var(--p-green-500), transparent 84%)',
|
textColor: '{sky.700}'
|
||||||
textColor: '{green.300}'
|
},
|
||||||
},
|
warn: {
|
||||||
info: {
|
background: '{orange.100}',
|
||||||
background: 'color-mix(in srgb, var(--p-sky-500), transparent 84%)',
|
textColor: '{orange.700}'
|
||||||
textColor: '{sky.300}'
|
},
|
||||||
},
|
danger: {
|
||||||
warn: {
|
background: '{red.100}',
|
||||||
background: 'color-mix(in srgb, var(--p-orange-500), transparent 84%)',
|
textColor: '{red.700}'
|
||||||
textColor: '{orange.300}'
|
},
|
||||||
},
|
contrast: {
|
||||||
danger: {
|
background: '{surface.950}',
|
||||||
background: 'color-mix(in srgb, var(--p-red-500), transparent 84%)',
|
textColor: '{surface.0}'
|
||||||
textColor: '{red.300}'
|
}
|
||||||
},
|
},
|
||||||
contrast: {
|
dark: {
|
||||||
background: '{surface.0}',
|
primary: {
|
||||||
textColor: '{surface.950}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,16 +1,14 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.300}',
|
||||||
borderColor: '{surface.300}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
},
|
||||||
},
|
dark: {
|
||||||
dark: {
|
background: '{surface.950}',
|
||||||
background: '{surface.950}',
|
borderColor: '{surface.700}',
|
||||||
borderColor: '{surface.700}',
|
textColor: '{surface.0}'
|
||||||
textColor: '{surface.0}'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,20 +1,16 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
root: {
|
||||||
common: {
|
background: '{form.field.background}',
|
||||||
root: {
|
backgroundDisabled: '{form.field.background.disabled}',
|
||||||
background: '{form.field.background}',
|
backgroundFilled: '{form.field.background.filled}',
|
||||||
backgroundDisabled: '{form.field.background.disabled}',
|
backgroundFilledFocus: '{form.field.background.filled.focus}',
|
||||||
backgroundFilled: '{form.field.background.filled}',
|
borderColor: '{form.field.border.color}',
|
||||||
backgroundFilledFocus: '{form.field.background.filled.focus}',
|
borderColorHover: '{form.field.border.color.hover}',
|
||||||
borderColor: '{form.field.border.color}',
|
borderColorFocus: '{form.field.border.color.focus}',
|
||||||
borderColorHover: '{form.field.border.color.hover}',
|
borderColorInvalid: '{form.field.border.color.invalid}',
|
||||||
borderColorFocus: '{form.field.border.color.focus}',
|
textColor: '{form.field.text.color}',
|
||||||
borderColorInvalid: '{form.field.border.color.invalid}',
|
textColorDisabled: '{form.field.text.disabled}',
|
||||||
textColor: '{form.field.text.color}',
|
placeholderTextColor: '{form.field.placeholder.text.color}',
|
||||||
textColorDisabled: '{form.field.text.disabled}',
|
boxShadow: '{form.field.box.shadow}'
|
||||||
placeholderTextColor: '{form.field.placeholder.text.color}',
|
|
||||||
boxShadow: '{form.field.box.shadow}'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,47 +1,45 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
},
|
||||||
|
item: {
|
||||||
|
backgroundFocus: '{surface.100}',
|
||||||
|
text: {
|
||||||
|
color: '{surface.700}',
|
||||||
|
colorFocus: '{surface.800}'
|
||||||
},
|
},
|
||||||
item: {
|
icon: {
|
||||||
backgroundFocus: '{surface.100}',
|
color: '{surface.400}',
|
||||||
text: {
|
colorFocus: '{surface.500}'
|
||||||
color: '{surface.700}',
|
|
||||||
colorFocus: '{surface.800}'
|
|
||||||
},
|
|
||||||
icon: {
|
|
||||||
color: '{surface.400}',
|
|
||||||
colorFocus: '{surface.500}'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
separator: {
|
|
||||||
borderColor: '{surface.200}'
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
dark: {
|
separator: {
|
||||||
root: {
|
borderColor: '{surface.200}'
|
||||||
background: '{surface.900}',
|
}
|
||||||
borderColor: '{surface.700}',
|
},
|
||||||
textColor: '{surface.0}'
|
dark: {
|
||||||
|
root: {
|
||||||
|
background: '{surface.900}',
|
||||||
|
borderColor: '{surface.700}',
|
||||||
|
textColor: '{surface.0}'
|
||||||
|
},
|
||||||
|
item: {
|
||||||
|
backgroundFocus: '{surface.800}',
|
||||||
|
text: {
|
||||||
|
color: '{surface.0}',
|
||||||
|
colorFocus: '{surface.0}'
|
||||||
},
|
},
|
||||||
item: {
|
icon: {
|
||||||
backgroundFocus: '{surface.800}',
|
color: '{surface.500}',
|
||||||
text: {
|
colorFocus: '{surface.400}'
|
||||||
color: '{surface.0}',
|
|
||||||
colorFocus: '{surface.0}'
|
|
||||||
},
|
|
||||||
icon: {
|
|
||||||
color: '{surface.500}',
|
|
||||||
colorFocus: '{surface.400}'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
separator: {
|
|
||||||
borderColor: '{surface.700}'
|
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
separator: {
|
||||||
|
borderColor: '{surface.700}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,25 +1,23 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
marker: {
|
||||||
marker: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
contentColor: '{primary.color}'
|
||||||
contentColor: '{primary.color}'
|
|
||||||
},
|
|
||||||
connector: {
|
|
||||||
color: '{surface.200}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
connector: {
|
||||||
marker: {
|
color: '{surface.200}'
|
||||||
background: '{surface.900}',
|
}
|
||||||
borderColor: '{surface.700}',
|
},
|
||||||
contentColor: '{primary.color}'
|
dark: {
|
||||||
},
|
marker: {
|
||||||
connector: {
|
background: '{surface.900}',
|
||||||
color: '{surface.700}'
|
borderColor: '{surface.700}',
|
||||||
}
|
contentColor: '{primary.color}'
|
||||||
|
},
|
||||||
|
connector: {
|
||||||
|
color: '{surface.700}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,107 +1,105 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
blur: '1.5px',
|
||||||
blur: '1.5px',
|
info: {
|
||||||
info: {
|
background: 'color-mix(in srgb, {blue.50}, transparent 5%)',
|
||||||
background: 'color-mix(in srgb, {blue.50}, transparent 5%)',
|
borderColor: '{blue.200}',
|
||||||
borderColor: '{blue.200}',
|
textColor: '{blue.600}',
|
||||||
textColor: '{blue.600}',
|
detailTextColor: '{surface.700}',
|
||||||
detailTextColor: '{surface.700}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)',
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)',
|
closeBackgroundHover: '{blue.100}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
success: {
|
||||||
blur: '10px',
|
background: 'color-mix(in srgb, {green.50}, transparent 5%)',
|
||||||
info: {
|
borderColor: '{green.200}',
|
||||||
background: 'color-mix(in srgb, {blue.500}, transparent 84%)',
|
textColor: '{green.600}',
|
||||||
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)',
|
detailTextColor: '{surface.700}',
|
||||||
textColor: '{blue.500}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)',
|
||||||
detailTextColor: '{surface.0}',
|
closeBackgroundHover: '{green.100}'
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)',
|
},
|
||||||
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
|
warn: {
|
||||||
},
|
background: 'color-mix(in srgb,{yellow.50}, transparent 5%)',
|
||||||
success: {
|
borderColor: '{yellow.200}',
|
||||||
background: 'color-mix(in srgb, {green.500}, transparent 84%)',
|
textColor: '{yellow.600}',
|
||||||
borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)',
|
detailTextColor: '{surface.700}',
|
||||||
textColor: '{green.500}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)',
|
||||||
detailTextColor: '{surface.0}',
|
closeBackgroundHover: '{yellow.100}'
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)',
|
},
|
||||||
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
|
error: {
|
||||||
},
|
background: 'color-mix(in srgb, {red.50}, transparent 5%)',
|
||||||
warn: {
|
borderColor: '{red.200}',
|
||||||
background: 'color-mix(in srgb, {yellow.500}, transparent 84%)',
|
textColor: '{red.600}',
|
||||||
borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)',
|
detailTextColor: '{surface.700}',
|
||||||
textColor: '{yellow.500}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)',
|
||||||
detailTextColor: '{surface.0}',
|
closeBackgroundHover: '{red.100}'
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)',
|
},
|
||||||
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
|
secondary: {
|
||||||
},
|
background: '{surface.100}',
|
||||||
error: {
|
borderColor: '{surface.200}',
|
||||||
background: 'color-mix(in srgb, {red.500}, transparent 84%)',
|
textColor: '{surface.600}',
|
||||||
borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)',
|
detailTextColor: '{surface.700}',
|
||||||
textColor: '{red.500}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)',
|
||||||
detailTextColor: '{surface.0}',
|
closeBackgroundHover: '{surface.200}'
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)',
|
},
|
||||||
closeBackgroundHover: 'rgba(255, 255, 255, 0.05)'
|
contrast: {
|
||||||
},
|
background: '{surface.900}',
|
||||||
secondary: {
|
borderColor: '{surface.950}',
|
||||||
background: '{surface.800}',
|
textColor: '{surface.50}',
|
||||||
borderColor: '{surface.700}',
|
detailTextColor: '{surface.0}',
|
||||||
textColor: '{surface.300}',
|
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)',
|
||||||
detailTextColor: '{surface.0}',
|
closeBackgroundHover: '{surface.800}'
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)',
|
}
|
||||||
closeBackgroundHover: '{surface.700}'
|
},
|
||||||
},
|
dark: {
|
||||||
contrast: {
|
blur: '10px',
|
||||||
background: '{surface.0}',
|
info: {
|
||||||
borderColor: '{surface.100}',
|
background: 'color-mix(in srgb, {blue.500}, transparent 84%)',
|
||||||
textColor: '{surface.950}',
|
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)',
|
||||||
detailTextColor: '{surface.950}',
|
textColor: '{blue.500}',
|
||||||
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)',
|
detailTextColor: '{surface.0}',
|
||||||
closeBackgroundHover: '{surface.100}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,45 +1,43 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.100}',
|
||||||
background: '{surface.100}',
|
backgroundDisabled: '{form.field.background.disabled}',
|
||||||
backgroundDisabled: '{form.field.background.disabled}',
|
borderColorInvalid: '{form.field.border.color.invalid}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
item: {
|
||||||
root: {
|
backgroundChecked: '{surface.0}',
|
||||||
background: '{surface.950}',
|
textColor: '{surface.500}',
|
||||||
backgroundDisabled: '{form.field.background.disabled}',
|
textColorHover: '{surface.700}',
|
||||||
borderColorInvalid: '{form.field.border.color.invalid}'
|
textColorChecked: '{surface.900}',
|
||||||
},
|
textColorDisabled: '{form.field.text.color.disabled}'
|
||||||
item: {
|
},
|
||||||
backgroundChecked: '{surface.800}',
|
itemIcon: {
|
||||||
textColor: '{surface.400}',
|
color: '{surface.500}',
|
||||||
textColorHover: '{surface.300}',
|
colorHover: '{surface.700}',
|
||||||
textColorChecked: '{surface.0}',
|
colorChecked: '{surface.900}',
|
||||||
textColorDisabled: '{form.field.text.color.disabled}'
|
colorDisabled: '{form.field.text.color.disabled}'
|
||||||
},
|
}
|
||||||
itemIcon: {
|
},
|
||||||
color: '{surface.400}',
|
dark: {
|
||||||
colorHover: '{surface.300}',
|
root: {
|
||||||
colorChecked: '{surface.0}',
|
background: '{surface.950}',
|
||||||
colorDisabled: '{form.field.text.color.disabled}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,19 +1,17 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.700}'
|
}
|
||||||
}
|
},
|
||||||
},
|
dark: {
|
||||||
dark: {
|
root: {
|
||||||
root: {
|
background: '{surface.900}',
|
||||||
background: '{surface.900}',
|
borderColor: '{surface.700}',
|
||||||
borderColor: '{surface.700}',
|
textColor: '{surface.0}'
|
||||||
textColor: '{surface.0}'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,17 +1,15 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.700}',
|
||||||
background: '{surface.700}',
|
textColor: '{surface.0}'
|
||||||
textColor: '{surface.0}'
|
}
|
||||||
}
|
},
|
||||||
},
|
dark: {
|
||||||
dark: {
|
root: {
|
||||||
root: {
|
background: '{surface.700}',
|
||||||
background: '{surface.700}',
|
textColor: '{surface.0}'
|
||||||
textColor: '{surface.0}'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,53 +1,51 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
root: {
|
||||||
root: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
textColor: '{surface.700}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
node: {
|
||||||
root: {
|
backgroundHover: '{surface.100}',
|
||||||
background: '{surface.900}',
|
textColor: '{surface.700}',
|
||||||
textColor: '{surface.0}'
|
textColorHover: '{surface.800}'
|
||||||
},
|
},
|
||||||
node: {
|
nodeIcon: {
|
||||||
backgroundHover: '{surface.800}',
|
color: '{surface.500}',
|
||||||
textColor: '{surface.0}',
|
colorHover: '{surface.600}'
|
||||||
textColorHover: '{surface.0}'
|
},
|
||||||
},
|
toggle: {
|
||||||
nodeIcon: {
|
backgroundHover: '{surface.100}',
|
||||||
color: '{surface.400}',
|
backgroundHoverHighlight: '{surface.0}',
|
||||||
colorHover: '{surface.300}'
|
color: '{surface.500}',
|
||||||
},
|
colorHover: '{surface.600}'
|
||||||
toggle: {
|
},
|
||||||
backgroundHover: '{surface.800}',
|
indeterminate: {
|
||||||
backgroundHoverHighlight: '{surface.900}',
|
color: '{surface.500}'
|
||||||
color: '{surface.400}',
|
}
|
||||||
colorHover: '{surface.300}'
|
},
|
||||||
},
|
dark: {
|
||||||
indeterminate: {
|
root: {
|
||||||
color: '{surface.400}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,103 +1,101 @@
|
||||||
export default {
|
export default {
|
||||||
variables: {
|
colorScheme: {
|
||||||
colorScheme: {
|
light: {
|
||||||
light: {
|
header: {
|
||||||
header: {
|
background: '{surface.0}',
|
||||||
background: '{surface.0}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.200}',
|
textColor: '{surface.700}'
|
||||||
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}'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
dark: {
|
headerCell: {
|
||||||
header: {
|
background: '{surface.0}',
|
||||||
background: '{surface.900}',
|
backgroundHover: '{surface.100}',
|
||||||
borderColor: '{surface.800}',
|
borderColor: '{surface.200}',
|
||||||
textColor: '{surface.0}'
|
textColor: '{surface.700}',
|
||||||
},
|
textColorHover: '{surface.800}'
|
||||||
headerCell: {
|
},
|
||||||
background: '{surface.900}',
|
row: {
|
||||||
backgroundHover: '{surface.800}',
|
background: '{surface.0}',
|
||||||
borderColor: '{surface.800}',
|
backgroundStriped: '{surface.50}',
|
||||||
textColor: '{surface.0}',
|
backgroundHover: '{surface.100}',
|
||||||
textColorHover: '{surface.0}'
|
textColor: '{surface.700}',
|
||||||
},
|
textColorHover: '{surface.800}'
|
||||||
row: {
|
},
|
||||||
background: '{surface.900}',
|
bodyCell: {
|
||||||
backgroundStriped: '{surface.950}',
|
borderColor: '{surface.200}',
|
||||||
backgroundHover: '{surface.800}',
|
borderColorSelected: '{primary.100}'
|
||||||
textColor: '{surface.0}',
|
},
|
||||||
textColorHover: '{surface.0}'
|
footerCell: {
|
||||||
},
|
background: '{surface.0}',
|
||||||
bodyCell: {
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.800}',
|
textColor: '{surface.700}'
|
||||||
borderColorSelected: '{primary.900}'
|
},
|
||||||
},
|
footer: {
|
||||||
footerCell: {
|
background: '{surface.0}',
|
||||||
background: '{surface.900}',
|
borderColor: '{surface.200}',
|
||||||
borderColor: '{surface.800}',
|
textColor: '{surface.700}'
|
||||||
textColor: '{surface.0}'
|
},
|
||||||
},
|
resizerColor: '{primary.color}',
|
||||||
footer: {
|
sortIcon: {
|
||||||
background: '{surface.900}',
|
color: '{surface.500}',
|
||||||
borderColor: '{surface.800}',
|
colorHover: '{surface.600}'
|
||||||
textColor: '{surface.0}'
|
},
|
||||||
},
|
toggle: {
|
||||||
resizerColor: '{primary.color}',
|
backgroundHover: '{surface.100}',
|
||||||
sortIcon: {
|
backgroundHoverHighlight: '{surface.0}',
|
||||||
color: '{surface.400}',
|
color: '{surface.500}',
|
||||||
colorHover: '{surface.300}'
|
colorHover: '{surface.600}'
|
||||||
},
|
},
|
||||||
toggle: {
|
indeterminate: {
|
||||||
backgroundHover: '{surface.800}',
|
color: '{surface.500}'
|
||||||
backgroundHoverHighlight: '{surface.900}',
|
}
|
||||||
color: '{surface.400}',
|
},
|
||||||
colorHover: '{surface.300}'
|
dark: {
|
||||||
},
|
header: {
|
||||||
indeterminate: {
|
background: '{surface.900}',
|
||||||
color: '{surface.400}'
|
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}'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue