diff options
Diffstat (limited to 'src/ui/c-select/c-select.theme.ts')
-rw-r--r-- | src/ui/c-select/c-select.theme.ts | 60 |
1 files changed, 60 insertions, 0 deletions
diff --git a/src/ui/c-select/c-select.theme.ts b/src/ui/c-select/c-select.theme.ts new file mode 100644 index 0000000..d799671 --- /dev/null +++ b/src/ui/c-select/c-select.theme.ts @@ -0,0 +1,60 @@ +import { defineThemes } from '../theme/theme.models'; +import { appThemes } from '../theme/themes'; + +const sizes = { + small: { + height: '28px', + fontSize: '12px', + }, + medium: { + height: '34px', + fontSize: '14px', + }, + large: { + height: '40px', + fontSize: '16px', + }, +}; + +export const { useTheme } = defineThemes({ + dark: { + sizes, + + backgroundColor: '#333333', + borderColor: '#333333', + dropdownShadow: 'rgba(0, 0, 0, 0.2) 0px 8px 24px', + + option: { + hover: { + backgroundColor: '#444444', + }, + active: { + textColor: appThemes.dark.primary.color, + }, + }, + + focus: { + backgroundColor: '#1ea54c1a', + }, + }, + light: { + sizes, + + backgroundColor: '#ffffff', + borderColor: '#e0e0e69e', + dropdownShadow: 'rgba(149, 157, 165, 0.2) 0px 8px 24px', + + option: { + hover: { + backgroundColor: '#eee', + }, + active: { + textColor: appThemes.light.primary.color, + }, + }, + + focus: { + backgroundColor: '#ffffff', + }, + }, +}); |