Migrated to new api

pull/5507/head
Cagatay Civici 2024-02-20 23:46:42 +03:00
parent ea10aea82b
commit 719cc84a60
64 changed files with 2302 additions and 2442 deletions

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
}
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
}
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
}
}
} }
}; };

View File

@ -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}'
}
} }
} }
} }

View File

@ -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}'
}
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
}
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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%)'
} }
} }
} }

View File

@ -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}'
}
} }
} }
} }

View File

@ -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}'
}
}
} }
}; };

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
}
}
} }
}; };

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
}
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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: {}
} }
}; };

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
}
} }
} }
} }

View File

@ -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}'
}
} }
} }
} }

View File

@ -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}'
}
}
} }
}; };

View File

@ -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}'
}
} }
} }
} }

View File

@ -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}'
}
} }
} }
} }

View File

@ -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}'
}
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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)'
}
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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: {}
}
} }
}; };

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
}
} }
} }
}; };

View File

@ -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}'
}
}
} }
}; };

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
}
} }
} }
} }

View File

@ -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}'
}
} }
} }
} }

View File

@ -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}'
} }
} }
} }

View File

@ -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}'
} }
} }
} }