@rovula/ui 0.1.6 → 0.1.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/bundle.css +630 -467
- package/dist/cjs/bundle.js +1545 -1545
- package/dist/cjs/bundle.js.map +1 -1
- package/dist/cjs/types/components/AlertDialog/AlertDialog.stories.d.ts +3 -0
- package/dist/cjs/types/components/Dialog/Dialog.d.ts +7 -1
- package/dist/cjs/types/components/Dialog/Dialog.stories.d.ts +3 -0
- package/dist/cjs/types/components/Dropdown/Dropdown.d.ts +2 -0
- package/dist/cjs/types/components/Dropdown/Dropdown.stories.d.ts +2 -0
- package/dist/cjs/types/components/Form/Field.d.ts +26 -0
- package/dist/cjs/types/components/Form/FieldMessage.d.ts +7 -0
- package/dist/cjs/types/components/Form/Form.d.ts +49 -11
- package/dist/cjs/types/components/Form/Form.stories.d.ts +23 -0
- package/dist/cjs/types/components/Form/ValidationHintList.d.ts +17 -0
- package/dist/cjs/types/components/Form/ValidationHintList.stories.d.ts +9 -0
- package/dist/cjs/types/components/Form/index.d.ts +10 -0
- package/dist/cjs/types/components/Form/useOptionBridge.d.ts +17 -0
- package/dist/cjs/types/components/OtpInput/OtpInput.d.ts +17 -0
- package/dist/cjs/types/components/OtpInput/OtpInput.stories.d.ts +15 -0
- package/dist/cjs/types/components/OtpInput/OtpInputGroup.d.ts +25 -0
- package/dist/cjs/types/components/OtpInput/index.d.ts +5 -0
- package/dist/cjs/types/components/TextInput/TextInput.styles.d.ts +3 -0
- package/dist/cjs/types/index.d.ts +5 -0
- package/dist/cjs/types/theme/ThemeColorCoverageRuntime.stories.d.ts +10 -0
- package/dist/cjs/types/utils/colors.d.ts +351 -267
- package/dist/components/ActionButton/ActionButton.stories.js +2 -2
- package/dist/components/ActionButton/ActionButton.styles.js +1 -1
- package/dist/components/AlertDialog/AlertDialog.js +6 -6
- package/dist/components/AlertDialog/AlertDialog.stories.js +3 -0
- package/dist/components/Avatar/Avatar.stories.js +1 -1
- package/dist/components/Avatar/Avatar.styles.js +1 -1
- package/dist/components/Avatar/AvatarBase.js +1 -1
- package/dist/components/Avatar/AvatarGroup.stories.js +1 -1
- package/dist/components/Button/Buttons.stories.js +2 -2
- package/dist/components/Calendar/Calendar.js +1 -1
- package/dist/components/Checkbox/Checkbox.js +1 -1
- package/dist/components/Checkbox/Checkbox.stories.js +17 -7
- package/dist/components/Collapsible/Collapsible.styles.js +1 -1
- package/dist/components/DataTable/DataTable.js +2 -2
- package/dist/components/Dialog/Dialog.js +12 -7
- package/dist/components/Dialog/Dialog.stories.js +90 -2
- package/dist/components/Dropdown/Dropdown.js +2 -2
- package/dist/components/DropdownMenu/DropdownMenu.js +3 -3
- package/dist/components/FocusedScrollView/FocusedScrollView.stories.js +6 -6
- package/dist/components/Form/Field.js +60 -0
- package/dist/components/Form/FieldMessage.js +24 -0
- package/dist/components/Form/Form.js +73 -41
- package/dist/components/Form/Form.stories.js +221 -0
- package/dist/components/Form/ValidationHintList.js +30 -0
- package/dist/components/Form/ValidationHintList.stories.js +50 -0
- package/dist/components/Form/index.js +5 -0
- package/dist/components/Form/useOptionBridge.js +27 -0
- package/dist/components/InputFilter/InputFilter.js +5 -4
- package/dist/components/InputFilter/InputFilter.stories.js +1 -1
- package/dist/components/InputFilter/InputFilter.styles.js +14 -1
- package/dist/components/Label/Label.styles.js +1 -1
- package/dist/components/Menu/Menu.js +2 -2
- package/dist/components/NumberInput/NumberInput.stories.js +1 -1
- package/dist/components/OtpInput/OtpInput.js +118 -0
- package/dist/components/OtpInput/OtpInput.stories.js +60 -0
- package/dist/components/OtpInput/OtpInputGroup.js +23 -0
- package/dist/components/OtpInput/index.js +3 -0
- package/dist/components/PasswordInput/PasswordInput.stories.js +1 -1
- package/dist/components/Popover/Popover.js +1 -1
- package/dist/components/RadioGroup/RadioGroup.js +1 -1
- package/dist/components/RadioGroup/RadioGroup.stories.js +2 -2
- package/dist/components/Search/Search.js +13 -1
- package/dist/components/Search/Search.stories.js +1 -1
- package/dist/components/Slider/Slider.js +1 -1
- package/dist/components/Slider/Slider.stories.js +5 -5
- package/dist/components/Switch/Switch.stories.js +2 -2
- package/dist/components/Switch/Switch.styles.js +1 -1
- package/dist/components/Table/Table.js +5 -5
- package/dist/components/Tabs/Tabs.js +12 -9
- package/dist/components/Tabs/Tabs.stories.js +1 -1
- package/dist/components/Text/Text.js +1 -1
- package/dist/components/Text/Text.stories.js +1 -1
- package/dist/components/TextArea/TextArea.stories.js +1 -1
- package/dist/components/TextArea/TextArea.styles.js +3 -3
- package/dist/components/TextInput/TextInput.js +3 -2
- package/dist/components/TextInput/TextInput.stories.js +3 -3
- package/dist/components/TextInput/TextInput.styles.js +41 -19
- package/dist/components/Toast/Toast.js +4 -2
- package/dist/components/Toast/Toast.stories.js +1 -1
- package/dist/components/Toast/Toast.styles.js +4 -4
- package/dist/components/Toast/Toaster.js +2 -2
- package/dist/components/Tree/Tree.stories.js +1 -1
- package/dist/components/Tree/TreeItem.js +1 -1
- package/dist/esm/bundle.css +630 -467
- package/dist/esm/bundle.js +1545 -1545
- package/dist/esm/bundle.js.map +1 -1
- package/dist/esm/types/components/AlertDialog/AlertDialog.stories.d.ts +3 -0
- package/dist/esm/types/components/Dialog/Dialog.d.ts +7 -1
- package/dist/esm/types/components/Dialog/Dialog.stories.d.ts +3 -0
- package/dist/esm/types/components/Dropdown/Dropdown.d.ts +2 -0
- package/dist/esm/types/components/Dropdown/Dropdown.stories.d.ts +2 -0
- package/dist/esm/types/components/Form/Field.d.ts +26 -0
- package/dist/esm/types/components/Form/FieldMessage.d.ts +7 -0
- package/dist/esm/types/components/Form/Form.d.ts +49 -11
- package/dist/esm/types/components/Form/Form.stories.d.ts +23 -0
- package/dist/esm/types/components/Form/ValidationHintList.d.ts +17 -0
- package/dist/esm/types/components/Form/ValidationHintList.stories.d.ts +9 -0
- package/dist/esm/types/components/Form/index.d.ts +10 -0
- package/dist/esm/types/components/Form/useOptionBridge.d.ts +17 -0
- package/dist/esm/types/components/OtpInput/OtpInput.d.ts +17 -0
- package/dist/esm/types/components/OtpInput/OtpInput.stories.d.ts +15 -0
- package/dist/esm/types/components/OtpInput/OtpInputGroup.d.ts +25 -0
- package/dist/esm/types/components/OtpInput/index.d.ts +5 -0
- package/dist/esm/types/components/TextInput/TextInput.styles.d.ts +3 -0
- package/dist/esm/types/index.d.ts +5 -0
- package/dist/esm/types/theme/ThemeColorCoverageRuntime.stories.d.ts +10 -0
- package/dist/esm/types/utils/colors.d.ts +351 -267
- package/dist/index.d.ts +512 -269
- package/dist/index.js +3 -0
- package/dist/src/theme/global.css +2739 -2681
- package/dist/theme/ThemeColorCoverageRuntime.stories.js +91 -0
- package/dist/utils/colors.js +359 -267
- package/package.json +4 -2
- package/src/components/ActionButton/ActionButton.stories.tsx +6 -6
- package/src/components/ActionButton/ActionButton.styles.ts +1 -1
- package/src/components/AlertDialog/AlertDialog.stories.tsx +22 -0
- package/src/components/AlertDialog/AlertDialog.tsx +6 -6
- package/src/components/Avatar/Avatar.stories.tsx +1 -1
- package/src/components/Avatar/Avatar.styles.ts +1 -1
- package/src/components/Avatar/AvatarBase.tsx +1 -1
- package/src/components/Avatar/AvatarGroup.stories.tsx +1 -1
- package/src/components/Button/Buttons.stories.tsx +25 -17
- package/src/components/Calendar/Calendar.tsx +3 -3
- package/src/components/Checkbox/Checkbox.stories.tsx +35 -12
- package/src/components/Checkbox/Checkbox.tsx +7 -5
- package/src/components/Collapsible/Collapsible.styles.ts +1 -1
- package/src/components/DataTable/DataTable.tsx +2 -2
- package/src/components/Dialog/Dialog.stories.tsx +173 -0
- package/src/components/Dialog/Dialog.tsx +32 -15
- package/src/components/Dropdown/Dropdown.styles.ts +1 -1
- package/src/components/Dropdown/Dropdown.tsx +16 -14
- package/src/components/DropdownMenu/DropdownMenu.tsx +3 -3
- package/src/components/FocusedScrollView/FocusedScrollView.stories.tsx +10 -10
- package/src/components/Form/Field.tsx +160 -0
- package/src/components/Form/FieldMessage.tsx +38 -0
- package/src/components/Form/Form.docs.mdx +67 -0
- package/src/components/Form/Form.stories.tsx +490 -0
- package/src/components/Form/Form.tsx +185 -87
- package/src/components/Form/README.md +284 -0
- package/src/components/Form/ValidationHintList.stories.tsx +118 -0
- package/src/components/Form/ValidationHintList.tsx +82 -0
- package/src/components/Form/index.ts +28 -0
- package/src/components/Form/useOptionBridge.ts +55 -0
- package/src/components/InputFilter/InputFilter.stories.tsx +1 -1
- package/src/components/InputFilter/InputFilter.styles.ts +14 -1
- package/src/components/InputFilter/InputFilter.tsx +33 -28
- package/src/components/Label/Label.styles.ts +2 -2
- package/src/components/Label/Label.tsx +1 -1
- package/src/components/Menu/Menu.tsx +12 -12
- package/src/components/NumberInput/NumberInput.stories.tsx +1 -1
- package/src/components/OtpInput/OtpInput.stories.tsx +168 -0
- package/src/components/OtpInput/OtpInput.tsx +210 -0
- package/src/components/OtpInput/OtpInputGroup.tsx +74 -0
- package/src/components/OtpInput/index.ts +5 -0
- package/src/components/PasswordInput/PasswordInput.stories.tsx +1 -1
- package/src/components/Popover/Popover.tsx +1 -1
- package/src/components/RadioGroup/RadioGroup.stories.tsx +4 -4
- package/src/components/RadioGroup/RadioGroup.tsx +2 -1
- package/src/components/Search/Search.stories.tsx +1 -1
- package/src/components/Search/Search.tsx +6 -2
- package/src/components/Slider/Slider.stories.tsx +7 -7
- package/src/components/Slider/Slider.tsx +1 -1
- package/src/components/Switch/Switch.stories.tsx +4 -4
- package/src/components/Switch/Switch.styles.ts +1 -1
- package/src/components/Table/Table.tsx +5 -5
- package/src/components/Tabs/Tabs.stories.tsx +1 -1
- package/src/components/Tabs/Tabs.tsx +29 -18
- package/src/components/Text/Text.stories.tsx +1 -1
- package/src/components/Text/Text.tsx +1 -1
- package/src/components/TextArea/TextArea.stories.tsx +1 -1
- package/src/components/TextArea/TextArea.styles.ts +3 -3
- package/src/components/TextInput/TextInput.stories.tsx +7 -7
- package/src/components/TextInput/TextInput.styles.ts +42 -19
- package/src/components/TextInput/TextInput.tsx +3 -1
- package/src/components/Toast/Toast.stories.tsx +1 -1
- package/src/components/Toast/Toast.styles.tsx +7 -7
- package/src/components/Toast/Toast.tsx +5 -4
- package/src/components/Toast/Toaster.tsx +17 -20
- package/src/components/Tree/Tree.stories.tsx +1 -1
- package/src/components/Tree/TreeItem.tsx +1 -1
- package/src/index.ts +5 -0
- package/src/theme/THEME_MAPPING.md +36 -37
- package/src/theme/ThemeColorCoverageRuntime.stories.tsx +236 -0
- package/src/theme/direct-token-migration-plan.md +121 -0
- package/src/theme/figma-mcp-check-report.md +225 -0
- package/src/theme/figma-mcp-component-checklist.json +1250 -0
- package/src/theme/global.css +7 -3
- package/src/theme/presets/colors.js +173 -64
- package/src/theme/themes/skyller/baseline.css +0 -4
- package/src/theme/themes/variable-mapping.css +1064 -0
- package/src/theme/themes/variable.css +248 -230
- package/src/theme/themes/xspector/baseline.css +0 -4
- package/src/theme/themes/xspector/components/dropdown-menu.css +4 -4
- package/src/theme/themes/xspector/components/loading.css +2 -2
- package/src/theme/tokens/baseline.css +0 -3
- package/src/theme/tokens/color.css +36 -65
- package/src/theme/tokens/components/action-button.css +6 -6
- package/src/theme/tokens/components/button.css +189 -189
- package/src/theme/tokens/components/dropdown-menu.css +5 -5
- package/src/theme/tokens/components/footer.css +1 -1
- package/src/theme/tokens/components/loading.css +2 -2
- package/src/theme/tokens/components/switch.css +11 -11
- package/src/theme/tokens/typography.css +28 -28
- package/src/theme/tokens_old/baseline.css +13 -0
- package/src/theme/tokens_old/color.css +78 -0
- package/src/theme/tokens_old/components/action-button.css +127 -0
- package/src/theme/tokens_old/components/button.css +512 -0
- package/src/theme/tokens_old/components/dropdown-menu.css +27 -0
- package/src/theme/tokens_old/components/footer.css +9 -0
- package/src/theme/tokens_old/components/loading.css +11 -0
- package/src/theme/tokens_old/components/navbar.css +9 -0
- package/src/theme/tokens_old/components/progress-bar.css +8 -0
- package/src/theme/tokens_old/components/switch.css +29 -0
- package/src/theme/tokens_old/typography.css +199 -0
- package/src/theme/tokens_old/variables.css +28 -0
- package/src/theme/utils.js +172 -33
- package/src/utils/colors.ts +367 -278
- package/src/theme/themes/skyller/color.css +0 -79
- package/src/theme/themes/skyller/palette.css +0 -143
- package/src/theme/themes/skyller/state.css +0 -94
- package/src/theme/themes/skyller/transparent.css +0 -94
- package/src/theme/themes/xspector/color.css +0 -83
- package/src/theme/themes/xspector/palette.css +0 -142
- package/src/theme/themes/xspector/state.css +0 -94
- package/src/theme/themes/xspector/transparent.css +0 -93
- /package/src/theme/{tokens → tokens_old}/palette.css +0 -0
- /package/src/theme/{tokens → tokens_old}/state.css +0 -0
- /package/src/theme/{tokens → tokens_old}/transparent.css +0 -0
|
@@ -1,79 +0,0 @@
|
|
|
1
|
-
:root[data-theme="skyller"] {
|
|
2
|
-
/* ------------------------------------------------------------------ */
|
|
3
|
-
/* Semantic Colors — from variable_lasted.css */
|
|
4
|
-
/* ------------------------------------------------------------------ */
|
|
5
|
-
|
|
6
|
-
/* Input */
|
|
7
|
-
--input-color-default-text: var(--input-default-text-skyller);
|
|
8
|
-
--input-color-default-stroke: var(--input-default-stroke-skyller);
|
|
9
|
-
--input-color-filled-text: var(--input-filled-text-skyller);
|
|
10
|
-
--input-color-active-stroke: var(--input-active-stroke-skyller);
|
|
11
|
-
--input-color-disable-text: var(--input-disable-text-skyller);
|
|
12
|
-
--input-color-disable-stroke: var(--input-disable-stroke-skyller);
|
|
13
|
-
--input-color-disable-bg: var(--input-disable-bg-skyller);
|
|
14
|
-
--input-color-label-bg: var(--input-label-bg-skyller);
|
|
15
|
-
--input-color-error: var(--input-error-skyller);
|
|
16
|
-
|
|
17
|
-
/* Function button */
|
|
18
|
-
--function-default-solid: var(--function-default-solid-skyller);
|
|
19
|
-
--function-default-hover: var(--function-default-hover-skyller);
|
|
20
|
-
--function-default-hover-bg: var(--function-default-hover-bg-skyller);
|
|
21
|
-
--function-default-stroke: var(--function-default-stroke-skyller);
|
|
22
|
-
--function-default-icon: var(--function-default-icon-skyller);
|
|
23
|
-
--function-default-outline-icon: var(--function-default-outline-icon-skyller);
|
|
24
|
-
--function-active-solid: var(--function-active-solid-skyller);
|
|
25
|
-
--function-active-hover: var(--function-active-hover-skyller);
|
|
26
|
-
--function-active-hover-bg: var(--function-active-hover-bg-skyller);
|
|
27
|
-
--function-active-stroke: var(--function-active-stroke-skyller);
|
|
28
|
-
--function-active-icon: var(--function-active-icon-skyller);
|
|
29
|
-
|
|
30
|
-
/* Text */
|
|
31
|
-
--text-black: var(--text-black-skyller);
|
|
32
|
-
--text-dark: var(--text-dark-skyller);
|
|
33
|
-
--text-medium: var(--text-medium-skyller);
|
|
34
|
-
--text-light: var(--text-light-skyller);
|
|
35
|
-
--text-grey-dark: var(--text-grey-dark-skyller);
|
|
36
|
-
--text-grey-medium: var(--text-grey-medium-skyller);
|
|
37
|
-
--text-grey-light: var(--text-grey-light-skyller);
|
|
38
|
-
--text-white: var(--text-white-skyller);
|
|
39
|
-
|
|
40
|
-
/* Base */
|
|
41
|
-
--base-color-bg: var(--base-bg-bg1-skyller);
|
|
42
|
-
--base-color-bg2: var(--base-bg-bg2-skyller);
|
|
43
|
-
--base-color-bg3: var(--base-bg-bg3-skyller);
|
|
44
|
-
--base-color-workspace-stroke: var(--base-bg-stroke1-skyller);
|
|
45
|
-
--base-color-guideline-stroke: var(--base-bg-stroke2-skyller);
|
|
46
|
-
--base-color-popup: var(--base-modal-modal-skyller);
|
|
47
|
-
--base-color-popup-highlight: var(--base-modal-modal-highlight-skyller);
|
|
48
|
-
--base-color-popup-curtain: var(--base-modal-modal-curtain-skyller);
|
|
49
|
-
--common-white: var(--common-white-skyller);
|
|
50
|
-
--common-black: var(--common-black-skyller);
|
|
51
|
-
|
|
52
|
-
/* Addon */
|
|
53
|
-
--background: var(--base-color-bg);
|
|
54
|
-
--foreground: var(--common-black);
|
|
55
|
-
|
|
56
|
-
--primary: var(--ramps-primary-100-skyller);
|
|
57
|
-
--secondary: var(--ramps-secondary-100-skyller);
|
|
58
|
-
--tertiary: var(--ramps-tertiary-100-skyller);
|
|
59
|
-
--info: var(--info-info-100);
|
|
60
|
-
--success: var(--success-success-100);
|
|
61
|
-
--warning: var(--warning-warning-100);
|
|
62
|
-
--error: var(--error-error-100);
|
|
63
|
-
--grey: var(--grey-grey-100);
|
|
64
|
-
--grey2: var(--grey2-grey2-100);
|
|
65
|
-
|
|
66
|
-
--primary-foreground: var(--state-color-primary-text-solid);
|
|
67
|
-
--secondary-foreground: var(--state-color-secondary-text-solid);
|
|
68
|
-
--tertiary-foreground: var(--state-color-tertiary-text-solid);
|
|
69
|
-
--info-foreground: var(--state-color-info-text-solid);
|
|
70
|
-
--success-foreground: var(--state-color-success-text-solid);
|
|
71
|
-
--warning-foreground: var(--state-color-warning-text-solid);
|
|
72
|
-
--error-foreground: var(--state-color-error-text-solid);
|
|
73
|
-
--grey-foreground: var(--common-black);
|
|
74
|
-
--grey2-foreground: var(--common-black);
|
|
75
|
-
|
|
76
|
-
--surface: var(--base-color-bg);
|
|
77
|
-
--surface-foreground: var(--common-black);
|
|
78
|
-
--base-color-popup-foreground: var(--text-dark);
|
|
79
|
-
}
|
|
@@ -1,143 +0,0 @@
|
|
|
1
|
-
:root[data-theme="skyller"] {
|
|
2
|
-
/* ------------------------------------------------------------------ */
|
|
3
|
-
/* Color Ramps — from variable_lasted.css */
|
|
4
|
-
/* ------------------------------------------------------------------ */
|
|
5
|
-
/* Maps --{base}-ramps-{base}-{num} (code) → --ramps-{base}-{num}-skyller */
|
|
6
|
-
|
|
7
|
-
/* Primary */
|
|
8
|
-
--primary-ramps-primary-5: var(--ramps-primary-5-skyller);
|
|
9
|
-
--primary-ramps-primary-10: var(--ramps-primary-10-skyller);
|
|
10
|
-
--primary-ramps-primary-20: var(--ramps-primary-20-skyller);
|
|
11
|
-
--primary-ramps-primary-30: var(--ramps-primary-30-skyller);
|
|
12
|
-
--primary-ramps-primary-40: var(--ramps-primary-40-skyller);
|
|
13
|
-
--primary-ramps-primary-50: var(--ramps-primary-50-skyller);
|
|
14
|
-
--primary-ramps-primary-60: var(--ramps-primary-60-skyller);
|
|
15
|
-
--primary-ramps-primary-70: var(--ramps-primary-70-skyller);
|
|
16
|
-
--primary-ramps-primary-80: var(--ramps-primary-80-skyller);
|
|
17
|
-
--primary-ramps-primary-90: var(--ramps-primary-90-skyller);
|
|
18
|
-
--primary-ramps-primary-100: var(--ramps-primary-100-skyller);
|
|
19
|
-
--primary-ramps-primary-110: var(--ramps-primary-110-skyller);
|
|
20
|
-
--primary-ramps-primary-120: var(--ramps-primary-120-skyller);
|
|
21
|
-
--primary-ramps-primary-130: var(--ramps-primary-130-skyller);
|
|
22
|
-
--primary-ramps-primary-140: var(--ramps-primary-140-skyller);
|
|
23
|
-
--primary-ramps-primary-150: var(--ramps-primary-150-skyller);
|
|
24
|
-
|
|
25
|
-
/* Secondary */
|
|
26
|
-
--secondary-ramps-secondary-5: var(--ramps-secondary-5-skyller);
|
|
27
|
-
--secondary-ramps-secondary-10: var(--ramps-secondary-10-skyller);
|
|
28
|
-
--secondary-ramps-secondary-20: var(--ramps-secondary-20-skyller);
|
|
29
|
-
--secondary-ramps-secondary-30: var(--ramps-secondary-30-skyller);
|
|
30
|
-
--secondary-ramps-secondary-40: var(--ramps-secondary-40-skyller);
|
|
31
|
-
--secondary-ramps-secondary-50: var(--ramps-secondary-50-skyller);
|
|
32
|
-
--secondary-ramps-secondary-60: var(--ramps-secondary-60-skyller);
|
|
33
|
-
--secondary-ramps-secondary-70: var(--ramps-secondary-70-skyller);
|
|
34
|
-
--secondary-ramps-secondary-80: var(--ramps-secondary-80-skyller);
|
|
35
|
-
--secondary-ramps-secondary-90: var(--ramps-secondary-90-skyller);
|
|
36
|
-
--secondary-ramps-secondary-100: var(--ramps-secondary-100-skyller);
|
|
37
|
-
--secondary-ramps-secondary-110: var(--ramps-secondary-110-skyller);
|
|
38
|
-
--secondary-ramps-secondary-120: var(--ramps-secondary-120-skyller);
|
|
39
|
-
--secondary-ramps-secondary-130: var(--ramps-secondary-130-skyller);
|
|
40
|
-
--secondary-ramps-secondary-140: var(--ramps-secondary-140-skyller);
|
|
41
|
-
--secondary-ramps-secondary-150: var(--ramps-secondary-150-skyller);
|
|
42
|
-
|
|
43
|
-
/* Tertiary */
|
|
44
|
-
--tertiary-ramps-tertiary-5: var(--ramps-tertiary-5-skyller);
|
|
45
|
-
--tertiary-ramps-tertiary-10: var(--ramps-tertiary-10-skyller);
|
|
46
|
-
--tertiary-ramps-tertiary-20: var(--ramps-tertiary-20-skyller);
|
|
47
|
-
--tertiary-ramps-tertiary-30: var(--ramps-tertiary-30-skyller);
|
|
48
|
-
--tertiary-ramps-tertiary-40: var(--ramps-tertiary-40-skyller);
|
|
49
|
-
--tertiary-ramps-tertiary-50: var(--ramps-tertiary-50-skyller);
|
|
50
|
-
--tertiary-ramps-tertiary-60: var(--ramps-tertiary-60-skyller);
|
|
51
|
-
--tertiary-ramps-tertiary-70: var(--ramps-tertiary-70-skyller);
|
|
52
|
-
--tertiary-ramps-tertiary-80: var(--ramps-tertiary-80-skyller);
|
|
53
|
-
--tertiary-ramps-tertiary-90: var(--ramps-tertiary-90-skyller);
|
|
54
|
-
--tertiary-ramps-tertiary-100: var(--ramps-tertiary-100-skyller);
|
|
55
|
-
--tertiary-ramps-tertiary-110: var(--ramps-tertiary-110-skyller);
|
|
56
|
-
--tertiary-ramps-tertiary-120: var(--ramps-tertiary-120-skyller);
|
|
57
|
-
--tertiary-ramps-tertiary-130: var(--ramps-tertiary-130-skyller);
|
|
58
|
-
--tertiary-ramps-tertiary-140: var(--ramps-tertiary-140-skyller);
|
|
59
|
-
--tertiary-ramps-tertiary-150: var(--ramps-tertiary-150-skyller);
|
|
60
|
-
|
|
61
|
-
/* Grey */
|
|
62
|
-
--grey-grey-5: var(--ramps-grey-5-skyller);
|
|
63
|
-
--grey-grey-10: var(--ramps-grey-10-skyller);
|
|
64
|
-
--grey-grey-20: var(--ramps-grey-20-skyller);
|
|
65
|
-
--grey-grey-30: var(--ramps-grey-30-skyller);
|
|
66
|
-
--grey-grey-40: var(--ramps-grey-40-skyller);
|
|
67
|
-
--grey-grey-50: var(--ramps-grey-50-skyller);
|
|
68
|
-
--grey-grey-60: var(--ramps-grey-60-skyller);
|
|
69
|
-
--grey-grey-70: var(--ramps-grey-70-skyller);
|
|
70
|
-
--grey-grey-80: var(--ramps-grey-80-skyller);
|
|
71
|
-
--grey-grey-90: var(--ramps-grey-90-skyller);
|
|
72
|
-
--grey-grey-100: var(--ramps-grey-100-skyller);
|
|
73
|
-
--grey-grey-110: var(--ramps-grey-110-skyller);
|
|
74
|
-
--grey-grey-120: var(--ramps-grey-120-skyller);
|
|
75
|
-
--grey-grey-130: var(--ramps-grey-130-skyller);
|
|
76
|
-
--grey-grey-140: var(--ramps-grey-140-skyller);
|
|
77
|
-
--grey-grey-150: var(--ramps-grey-150-skyller);
|
|
78
|
-
|
|
79
|
-
/* Grey2 */
|
|
80
|
-
--grey2-grey2-50: var(--ramps-grey2-50-skyller);
|
|
81
|
-
--grey2-grey2-100: var(--ramps-grey2-100-skyller);
|
|
82
|
-
--grey2-grey2-200: var(--ramps-grey2-200-skyller);
|
|
83
|
-
--grey2-grey2-300: var(--ramps-grey2-300-skyller);
|
|
84
|
-
--grey2-grey2-400: var(--ramps-grey2-400-skyller);
|
|
85
|
-
--grey2-grey2-500: var(--ramps-grey2-500-skyller);
|
|
86
|
-
--grey2-grey2-600: var(--ramps-grey2-600-skyller);
|
|
87
|
-
--grey2-grey2-700: var(--ramps-grey2-700-skyller);
|
|
88
|
-
--grey2-grey2-800: var(--ramps-grey2-800-skyller);
|
|
89
|
-
--grey2-grey2-900: var(--ramps-grey2-900-skyller);
|
|
90
|
-
--grey2-grey2-950: var(--ramps-grey2-950-skyller);
|
|
91
|
-
|
|
92
|
-
/* Info */
|
|
93
|
-
--info-info-50: var(--ramps-info-50-skyller);
|
|
94
|
-
--info-info-100: var(--ramps-info-100-skyller);
|
|
95
|
-
--info-info-200: var(--ramps-info-200-skyller);
|
|
96
|
-
--info-info-300: var(--ramps-info-300-skyller);
|
|
97
|
-
--info-info-400: var(--ramps-info-400-skyller);
|
|
98
|
-
--info-info-500: var(--ramps-info-500-skyller);
|
|
99
|
-
--info-info-600: var(--ramps-info-600-skyller);
|
|
100
|
-
--info-info-700: var(--ramps-info-700-skyller);
|
|
101
|
-
--info-info-800: var(--ramps-info-800-skyller);
|
|
102
|
-
--info-info-900: var(--ramps-info-900-skyller);
|
|
103
|
-
--info-info-950: var(--ramps-info-950-skyller);
|
|
104
|
-
|
|
105
|
-
/* Success */
|
|
106
|
-
--success-success-50: var(--ramps-success-50-skyller);
|
|
107
|
-
--success-success-100: var(--ramps-success-100-skyller);
|
|
108
|
-
--success-success-200: var(--ramps-success-200-skyller);
|
|
109
|
-
--success-success-300: var(--ramps-success-300-skyller);
|
|
110
|
-
--success-success-400: var(--ramps-success-400-skyller);
|
|
111
|
-
--success-success-500: var(--ramps-success-500-skyller);
|
|
112
|
-
--success-success-600: var(--ramps-success-600-skyller);
|
|
113
|
-
--success-success-700: var(--ramps-success-700-skyller);
|
|
114
|
-
--success-success-800: var(--ramps-success-800-skyller);
|
|
115
|
-
--success-success-900: var(--ramps-success-900-skyller);
|
|
116
|
-
--success-success-950: var(--ramps-success-950-skyller);
|
|
117
|
-
|
|
118
|
-
/* Warning */
|
|
119
|
-
--warning-warning-50: var(--ramps-warning-50-skyller);
|
|
120
|
-
--warning-warning-100: var(--ramps-warning-100-skyller);
|
|
121
|
-
--warning-warning-200: var(--ramps-warning-200-skyller);
|
|
122
|
-
--warning-warning-300: var(--ramps-warning-300-skyller);
|
|
123
|
-
--warning-warning-400: var(--ramps-warning-400-skyller);
|
|
124
|
-
--warning-warning-500: var(--ramps-warning-500-skyller);
|
|
125
|
-
--warning-warning-600: var(--ramps-warning-600-skyller);
|
|
126
|
-
--warning-warning-700: var(--ramps-warning-700-skyller);
|
|
127
|
-
--warning-warning-800: var(--ramps-warning-800-skyller);
|
|
128
|
-
--warning-warning-900: var(--ramps-warning-900-skyller);
|
|
129
|
-
--warning-warning-950: var(--ramps-warning-950-skyller);
|
|
130
|
-
|
|
131
|
-
/* Error */
|
|
132
|
-
--error-error-50: var(--ramps-error-50-skyller);
|
|
133
|
-
--error-error-100: var(--ramps-error-100-skyller);
|
|
134
|
-
--error-error-200: var(--ramps-error-200-skyller);
|
|
135
|
-
--error-error-300: var(--ramps-error-300-skyller);
|
|
136
|
-
--error-error-400: var(--ramps-error-400-skyller);
|
|
137
|
-
--error-error-500: var(--ramps-error-500-skyller);
|
|
138
|
-
--error-error-600: var(--ramps-error-600-skyller);
|
|
139
|
-
--error-error-700: var(--ramps-error-700-skyller);
|
|
140
|
-
--error-error-800: var(--ramps-error-800-skyller);
|
|
141
|
-
--error-error-900: var(--ramps-error-900-skyller);
|
|
142
|
-
--error-error-950: var(--ramps-error-950-skyller);
|
|
143
|
-
}
|
|
@@ -1,94 +0,0 @@
|
|
|
1
|
-
:root[data-theme="skyller"] {
|
|
2
|
-
/* ------------------------------------------------------------------ */
|
|
3
|
-
/* State Tokens — from variable_lasted.css */
|
|
4
|
-
/* ------------------------------------------------------------------ */
|
|
5
|
-
/* Maps --state-color-* (code) → --state-*-skyller (Figma export) */
|
|
6
|
-
|
|
7
|
-
/* Primary */
|
|
8
|
-
--state-color-primary-default: var(--state-primary-default-skyller);
|
|
9
|
-
--state-color-primary-hover: var(--state-primary-hover-skyller);
|
|
10
|
-
--state-color-primary-stroke: var(--state-primary-stroke-skyller);
|
|
11
|
-
--state-color-primary-hover-bg: var(--state-primary-hover-bg-skyller);
|
|
12
|
-
--state-color-primary-pressed: var(--state-primary-pressed-skyller);
|
|
13
|
-
--state-color-primary-active: var(--state-primary-active-skyller);
|
|
14
|
-
--state-color-primary-text-solid: var(--state-primary-text-solid-skyller);
|
|
15
|
-
--state-color-primary-text-outline: var(--state-primary-text-outline-skyller);
|
|
16
|
-
--state-color-primary-text-hover: var(--state-primary-text-hover-skyller);
|
|
17
|
-
--state-color-primary-text-pressed: var(--state-primary-text-pressed-skyller);
|
|
18
|
-
|
|
19
|
-
/* Secondary */
|
|
20
|
-
--state-color-secondary-default: var(--state-secondary-default-skyller);
|
|
21
|
-
--state-color-secondary-hover: var(--state-secondary-hover-skyller);
|
|
22
|
-
--state-color-secondary-stroke: var(--state-secondary-stroke-skyller);
|
|
23
|
-
--state-color-secondary-hover-bg: var(--state-secondary-hover-bg-skyller);
|
|
24
|
-
--state-color-secondary-pressed: var(--state-secondary-pressed-skyller);
|
|
25
|
-
--state-color-secondary-active: var(--state-secondary-active-skyller);
|
|
26
|
-
--state-color-secondary-text-solid: var(--state-secondary-text-solid-skyller);
|
|
27
|
-
--state-color-secondary-text-outline: var(--state-secondary-text-outline-skyller);
|
|
28
|
-
--state-color-secondary-text-hover: var(--state-secondary-text-hover-skyller);
|
|
29
|
-
--state-color-secondary-text-pressed: var(--state-secondary-text-pressed-skyller);
|
|
30
|
-
|
|
31
|
-
/* Tertiary */
|
|
32
|
-
--state-color-tertiary-default: var(--state-tertiary-default-skyller);
|
|
33
|
-
--state-color-tertiary-hover: var(--state-tertiary-hover-skyller);
|
|
34
|
-
--state-color-tertiary-stroke: var(--state-tertiary-stroke-skyller);
|
|
35
|
-
--state-color-tertiary-hover-bg: var(--state-tertiary-hover-bg-skyller);
|
|
36
|
-
--state-color-tertiary-pressed: var(--state-tertiary-pressed-skyller);
|
|
37
|
-
--state-color-tertiary-active: var(--state-tertiary-active-skyller);
|
|
38
|
-
--state-color-tertiary-text-solid: var(--state-tertiary-text-solid-skyller);
|
|
39
|
-
--state-color-tertiary-text-outline: var(--state-tertiary-text-outline-skyller);
|
|
40
|
-
--state-color-tertiary-text-hover: var(--state-tertiary-text-hover-skyller);
|
|
41
|
-
--state-color-tertiary-text-pressed: var(--state-tertiary-text-pressed-skyller);
|
|
42
|
-
|
|
43
|
-
/* Info */
|
|
44
|
-
--state-color-info-default: var(--state-info-default-skyller);
|
|
45
|
-
--state-color-info-hover: var(--state-info-hover-skyller);
|
|
46
|
-
--state-color-info-stroke: var(--state-info-stroke-skyller);
|
|
47
|
-
--state-color-info-hover-bg: var(--state-info-hover-bg-skyller);
|
|
48
|
-
--state-color-info-pressed: var(--state-info-pressed-skyller);
|
|
49
|
-
--state-color-info-active: var(--state-info-active-skyller);
|
|
50
|
-
--state-color-info-text-solid: var(--state-info-text-solid-skyller);
|
|
51
|
-
--state-color-info-text-outline: var(--state-info-text-outline-skyller);
|
|
52
|
-
--state-color-info-text-hover: var(--state-info-text-hover-skyller);
|
|
53
|
-
--state-color-info-text-pressed: var(--state-info-text-pressed-skyller);
|
|
54
|
-
|
|
55
|
-
/* Success */
|
|
56
|
-
--state-color-success-default: var(--state-success-default-skyller);
|
|
57
|
-
--state-color-success-hover: var(--state-success-hover-skyller);
|
|
58
|
-
--state-color-success-stroke: var(--state-success-stroke-skyller);
|
|
59
|
-
--state-color-success-hover-bg: var(--state-success-hover-bg-skyller);
|
|
60
|
-
--state-color-success-pressed: var(--state-success-pressed-skyller);
|
|
61
|
-
--state-color-success-active: var(--state-success-active-skyller);
|
|
62
|
-
--state-color-success-text-solid: var(--state-success-text-solid-skyller);
|
|
63
|
-
--state-color-success-text-outline: var(--state-success-text-outline-skyller);
|
|
64
|
-
--state-color-success-text-hover: var(--state-success-text-hover-skyller);
|
|
65
|
-
--state-color-success-text-pressed: var(--state-success-text-pressed-skyller);
|
|
66
|
-
|
|
67
|
-
/* Warning */
|
|
68
|
-
--state-color-warning-default: var(--state-warning-default-skyller);
|
|
69
|
-
--state-color-warning-hover: var(--state-warning-hover-skyller);
|
|
70
|
-
--state-color-warning-stroke: var(--state-warning-stroke-skyller);
|
|
71
|
-
--state-color-warning-hover-bg: var(--state-warning-hover-bg-skyller);
|
|
72
|
-
--state-color-warning-pressed: var(--state-warning-pressed-skyller);
|
|
73
|
-
--state-color-warning-active: var(--state-warning-active-skyller);
|
|
74
|
-
--state-color-warning-text-solid: var(--state-warning-text-solid-skyller);
|
|
75
|
-
--state-color-warning-text-outline: var(--state-warning-text-outline-skyller);
|
|
76
|
-
--state-color-warning-text-hover: var(--state-warning-text-hover-skyller);
|
|
77
|
-
--state-color-warning-text-pressed: var(--state-warning-text-pressed-skyller);
|
|
78
|
-
|
|
79
|
-
/* Error */
|
|
80
|
-
--state-color-error-default: var(--state-error-default-skyller);
|
|
81
|
-
--state-color-error-hover: var(--state-error-hover-skyller);
|
|
82
|
-
--state-color-error-stroke: var(--state-error-stroke-skyller);
|
|
83
|
-
--state-color-error-hover-bg: var(--state-error-hover-bg-skyller);
|
|
84
|
-
--state-color-error-pressed: var(--state-error-pressed-skyller);
|
|
85
|
-
--state-color-error-active: var(--state-error-active-skyller);
|
|
86
|
-
--state-color-error-text-solid: var(--state-error-text-solid-skyller);
|
|
87
|
-
--state-color-error-text-outline: var(--state-error-text-outline-skyller);
|
|
88
|
-
--state-color-error-text-hover: var(--state-error-text-hover-skyller);
|
|
89
|
-
--state-color-error-text-pressed: var(--state-error-text-pressed-skyller);
|
|
90
|
-
|
|
91
|
-
/* Disable */
|
|
92
|
-
--state-color-disable-solid: var(--state-disable-solid-skyller);
|
|
93
|
-
--state-color-disable-outline: var(--state-disable-outline-skyller);
|
|
94
|
-
}
|
|
@@ -1,94 +0,0 @@
|
|
|
1
|
-
:root[data-theme="skyller"] {
|
|
2
|
-
/* ------------------------------------------------------------------ */
|
|
3
|
-
/* Transparency Variants — from variable_lasted.css */
|
|
4
|
-
/* ------------------------------------------------------------------ */
|
|
5
|
-
/* Maps --main/other-transparency-* (code) → --transparency-*-skyller */
|
|
6
|
-
|
|
7
|
-
/* Primary (main) */
|
|
8
|
-
--main-transparency-primary-8: var(--transparency-primary-8-skyller);
|
|
9
|
-
--main-transparency-primary-12: var(--transparency-primary-12-skyller);
|
|
10
|
-
--main-transparency-primary-16: var(--transparency-primary-16-skyller);
|
|
11
|
-
--main-transparency-primary-24: var(--transparency-primary-24-skyller);
|
|
12
|
-
--main-transparency-primary-32: var(--transparency-primary-32-skyller);
|
|
13
|
-
--main-transparency-primary-48: var(--transparency-primary-48-skyller);
|
|
14
|
-
|
|
15
|
-
/* Secondary (main) */
|
|
16
|
-
--main-transparency-secondary-8: var(--transparency-secondary-8-skyller);
|
|
17
|
-
--main-transparency-secondary-12: var(--transparency-secondary-12-skyller);
|
|
18
|
-
--main-transparency-secondary-16: var(--transparency-secondary-16-skyller);
|
|
19
|
-
--main-transparency-secondary-24: var(--transparency-secondary-24-skyller);
|
|
20
|
-
--main-transparency-secondary-32: var(--transparency-secondary-32-skyller);
|
|
21
|
-
--main-transparency-secondary-48: var(--transparency-secondary-48-skyller);
|
|
22
|
-
|
|
23
|
-
/* Tertiary (main) */
|
|
24
|
-
--main-transparency-tertiary-8: var(--transparency-tertiary-8-skyller);
|
|
25
|
-
--main-transparency-tertiary-12: var(--transparency-tertiary-12-skyller);
|
|
26
|
-
--main-transparency-tertiary-16: var(--transparency-tertiary-16-skyller);
|
|
27
|
-
--main-transparency-tertiary-24: var(--transparency-tertiary-24-skyller);
|
|
28
|
-
--main-transparency-tertiary-32: var(--transparency-tertiary-32-skyller);
|
|
29
|
-
--main-transparency-tertiary-48: var(--transparency-tertiary-48-skyller);
|
|
30
|
-
|
|
31
|
-
/* Info (other) */
|
|
32
|
-
--other-transparency-info-8: var(--transparency-info-8-skyller);
|
|
33
|
-
--other-transparency-info-12: var(--transparency-info-12-skyller);
|
|
34
|
-
--other-transparency-info-16: var(--transparency-info-16-skyller);
|
|
35
|
-
--other-transparency-info-24: var(--transparency-info-24-skyller);
|
|
36
|
-
--other-transparency-info-32: var(--transparency-info-32-skyller);
|
|
37
|
-
--other-transparency-info-48: var(--transparency-info-48-skyller);
|
|
38
|
-
|
|
39
|
-
/* Success (other) */
|
|
40
|
-
--other-transparency-success-8: var(--transparency-success-8-skyller);
|
|
41
|
-
--other-transparency-success-12: var(--transparency-success-12-skyller);
|
|
42
|
-
--other-transparency-success-16: var(--transparency-success-16-skyller);
|
|
43
|
-
--other-transparency-success-24: var(--transparency-success-24-skyller);
|
|
44
|
-
--other-transparency-success-32: var(--transparency-success-32-skyller);
|
|
45
|
-
--other-transparency-success-48: var(--transparency-success-48-skyller);
|
|
46
|
-
|
|
47
|
-
/* Warning (other) */
|
|
48
|
-
--other-transparency-warning-8: var(--transparency-warning-8-skyller);
|
|
49
|
-
--other-transparency-warning-12: var(--transparency-warning-12-skyller);
|
|
50
|
-
--other-transparency-warning-16: var(--transparency-warning-16-skyller);
|
|
51
|
-
--other-transparency-warning-24: var(--transparency-warning-24-skyller);
|
|
52
|
-
--other-transparency-warning-32: var(--transparency-warning-32-skyller);
|
|
53
|
-
--other-transparency-warning-48: var(--transparency-warning-48-skyller);
|
|
54
|
-
|
|
55
|
-
/* Error (other) */
|
|
56
|
-
--other-transparency-error-8: var(--transparency-error-8-skyller);
|
|
57
|
-
--other-transparency-error-12: var(--transparency-error-12-skyller);
|
|
58
|
-
--other-transparency-error-16: var(--transparency-error-16-skyller);
|
|
59
|
-
--other-transparency-error-24: var(--transparency-error-24-skyller);
|
|
60
|
-
--other-transparency-error-32: var(--transparency-error-32-skyller);
|
|
61
|
-
--other-transparency-error-48: var(--transparency-error-48-skyller);
|
|
62
|
-
|
|
63
|
-
/* Grey (other) */
|
|
64
|
-
--other-transparency-grey-8: var(--transparency-grey-8-skyller);
|
|
65
|
-
--other-transparency-grey-12: var(--transparency-grey-12-skyller);
|
|
66
|
-
--other-transparency-grey-16: var(--transparency-grey-16-skyller);
|
|
67
|
-
--other-transparency-grey-24: var(--transparency-grey-24-skyller);
|
|
68
|
-
--other-transparency-grey-32: var(--transparency-grey-32-skyller);
|
|
69
|
-
--other-transparency-grey-48: var(--transparency-grey-48-skyller);
|
|
70
|
-
|
|
71
|
-
/* Grey2 (other) */
|
|
72
|
-
--other-transparency-grey2-8: var(--transparency-grey2-8-skyller);
|
|
73
|
-
--other-transparency-grey2-12: var(--transparency-grey2-12-skyller);
|
|
74
|
-
--other-transparency-grey2-16: var(--transparency-grey2-16-skyller);
|
|
75
|
-
--other-transparency-grey2-24: var(--transparency-grey2-24-skyller);
|
|
76
|
-
--other-transparency-grey2-32: var(--transparency-grey2-32-skyller);
|
|
77
|
-
--other-transparency-grey2-48: var(--transparency-grey2-48-skyller);
|
|
78
|
-
|
|
79
|
-
/* White (other) — note: variable uses transparency-white-8 */
|
|
80
|
-
--other-transparency-white-08: var(--transparency-white-8-skyller);
|
|
81
|
-
--other-transparency-white-12: var(--transparency-white-12-skyller);
|
|
82
|
-
--other-transparency-white-16: var(--transparency-white-16-skyller);
|
|
83
|
-
--other-transparency-white-24: var(--transparency-white-24-skyller);
|
|
84
|
-
--other-transparency-white-32: var(--transparency-white-32-skyller);
|
|
85
|
-
--other-transparency-white-48: var(--transparency-white-48-skyller);
|
|
86
|
-
|
|
87
|
-
/* Black (other) */
|
|
88
|
-
--other-transparency-black-08: var(--transparency-black-8-skyller);
|
|
89
|
-
--other-transparency-black-12: var(--transparency-black-12-skyller);
|
|
90
|
-
--other-transparency-black-16: var(--transparency-black-16-skyller);
|
|
91
|
-
--other-transparency-black-24: var(--transparency-black-24-skyller);
|
|
92
|
-
--other-transparency-black-32: var(--transparency-black-32-skyller);
|
|
93
|
-
--other-transparency-black-48: var(--transparency-black-48-skyller);
|
|
94
|
-
}
|
|
@@ -1,83 +0,0 @@
|
|
|
1
|
-
:root[data-theme="xspector"] {
|
|
2
|
-
/* ------------------------------------------------------------------ */
|
|
3
|
-
/* Semantic Colors — from variable_lasted.css */
|
|
4
|
-
/* ------------------------------------------------------------------ */
|
|
5
|
-
|
|
6
|
-
/* Input */
|
|
7
|
-
--input-color-default-text: var(--input-default-text-xspector);
|
|
8
|
-
--input-color-default-stroke: var(--input-default-stroke-xspector);
|
|
9
|
-
--input-color-filled-text: var(--input-filled-text-xspector);
|
|
10
|
-
--input-color-active-stroke: var(--input-active-stroke-xspector);
|
|
11
|
-
--input-color-disable-text: var(--input-disable-text-xspector);
|
|
12
|
-
--input-color-disable-stroke: var(--input-disable-stroke-xspector);
|
|
13
|
-
--input-color-disable-bg: var(--input-disable-bg-xspector);
|
|
14
|
-
--input-color-label-bg: var(--input-label-bg-xspector);
|
|
15
|
-
--input-color-error: var(--input-error-xspector);
|
|
16
|
-
|
|
17
|
-
/* Function button */
|
|
18
|
-
--function-default-solid: var(--function-default-solid-xspector);
|
|
19
|
-
--function-default-hover: var(--function-default-hover-xspector);
|
|
20
|
-
--function-default-hover-bg: var(--function-default-hover-bg-xspector);
|
|
21
|
-
--function-default-stroke: var(--function-default-stroke-xspector);
|
|
22
|
-
--function-default-icon: var(--function-default-icon-xspector);
|
|
23
|
-
--function-default-outline-icon: var(--function-default-outline-icon-xspector);
|
|
24
|
-
--function-active-solid: var(--function-active-solid-xspector);
|
|
25
|
-
--function-active-hover: var(--function-active-hover-xspector);
|
|
26
|
-
--function-active-hover-bg: var(--function-active-hover-bg-xspector);
|
|
27
|
-
--function-active-stroke: var(--function-active-stroke-xspector);
|
|
28
|
-
--function-active-icon: var(--function-active-icon-xspector);
|
|
29
|
-
|
|
30
|
-
/* Text */
|
|
31
|
-
--text-black: var(--text-black-xspector);
|
|
32
|
-
--text-dark: var(--text-dark-xspector);
|
|
33
|
-
--text-medium: var(--text-medium-xspector);
|
|
34
|
-
--text-light: var(--text-light-xspector);
|
|
35
|
-
--text-grey-dark: var(--text-grey-dark-xspector);
|
|
36
|
-
--text-grey-medium: var(--text-grey-medium-xspector);
|
|
37
|
-
--text-grey-light: var(--text-grey-light-xspector);
|
|
38
|
-
--text-white: var(--text-white-xspector);
|
|
39
|
-
|
|
40
|
-
/* Base */
|
|
41
|
-
--base-color-bg: var(--base-bg-bg1-xspector);
|
|
42
|
-
--base-color-bg2: var(--base-bg-bg2-xspector);
|
|
43
|
-
--base-color-bg3: var(--base-bg-bg3-xspector);
|
|
44
|
-
--base-color-workspace-stroke: var(--base-bg-stroke1-xspector);
|
|
45
|
-
--base-color-guideline-stroke: var(--base-bg-stroke2-xspector);
|
|
46
|
-
--base-color-popup: var(--base-modal-modal-xspector);
|
|
47
|
-
--base-color-popup-highlight: var(--base-modal-modal-highlight-xspector);
|
|
48
|
-
--base-color-popup-curtain: var(--base-modal-modal-curtain-xspector);
|
|
49
|
-
--common-white: var(--common-white-xspector);
|
|
50
|
-
--common-black: var(--common-black-xspector);
|
|
51
|
-
|
|
52
|
-
/* Addon */
|
|
53
|
-
--background: var(--base-color-bg);
|
|
54
|
-
--foreground: var(--common-white);
|
|
55
|
-
|
|
56
|
-
--primary: var(--primary-ramps-primary-100);
|
|
57
|
-
--secondary: var(--secondary-ramps-secondary-100);
|
|
58
|
-
--tertiary: var(--tertiary-ramps-tertiary-100);
|
|
59
|
-
--info: var(--info-info-100);
|
|
60
|
-
--success: var(--success-success-100);
|
|
61
|
-
--warning: var(--warning-warning-100);
|
|
62
|
-
--error: var(--error-error-100);
|
|
63
|
-
--grey: var(--grey-grey-100);
|
|
64
|
-
--grey2: var(--grey2-grey2-100);
|
|
65
|
-
|
|
66
|
-
--primary-foreground: var(--state-color-primary-text-solid);
|
|
67
|
-
--secondary-foreground: var(--state-color-secondary-text-solid);
|
|
68
|
-
--tertiary-foreground: var(--state-color-tertiary-text-solid);
|
|
69
|
-
--info-foreground: var(--state-color-info-text-solid);
|
|
70
|
-
--success-foreground: var(--state-color-success-text-solid);
|
|
71
|
-
--warning-foreground: var(--state-color-warning-text-solid);
|
|
72
|
-
--error-foreground: var(--state-color-error-text-solid);
|
|
73
|
-
--grey-foreground: var(--common-black);
|
|
74
|
-
--grey2-foreground: var(--common-black);
|
|
75
|
-
|
|
76
|
-
--surface: var(--base-color-bg);
|
|
77
|
-
--surface-foreground: var(--common-white);
|
|
78
|
-
|
|
79
|
-
--primary-foreground: var(--common-white);
|
|
80
|
-
--secondary-foreground: var(--common-white);
|
|
81
|
-
|
|
82
|
-
--base-color-popup-foreground: var(--text-grey-light);
|
|
83
|
-
}
|
|
@@ -1,142 +0,0 @@
|
|
|
1
|
-
:root[data-theme="xspector"] {
|
|
2
|
-
/* ------------------------------------------------------------------ */
|
|
3
|
-
/* Color Ramps — from variable_lasted.css */
|
|
4
|
-
/* ------------------------------------------------------------------ */
|
|
5
|
-
|
|
6
|
-
/* Primary */
|
|
7
|
-
--primary-ramps-primary-5: var(--ramps-primary-5-xspector);
|
|
8
|
-
--primary-ramps-primary-10: var(--ramps-primary-10-xspector);
|
|
9
|
-
--primary-ramps-primary-20: var(--ramps-primary-20-xspector);
|
|
10
|
-
--primary-ramps-primary-30: var(--ramps-primary-30-xspector);
|
|
11
|
-
--primary-ramps-primary-40: var(--ramps-primary-40-xspector);
|
|
12
|
-
--primary-ramps-primary-50: var(--ramps-primary-50-xspector);
|
|
13
|
-
--primary-ramps-primary-60: var(--ramps-primary-60-xspector);
|
|
14
|
-
--primary-ramps-primary-70: var(--ramps-primary-70-xspector);
|
|
15
|
-
--primary-ramps-primary-80: var(--ramps-primary-80-xspector);
|
|
16
|
-
--primary-ramps-primary-90: var(--ramps-primary-90-xspector);
|
|
17
|
-
--primary-ramps-primary-100: var(--ramps-primary-100-xspector);
|
|
18
|
-
--primary-ramps-primary-110: var(--ramps-primary-110-xspector);
|
|
19
|
-
--primary-ramps-primary-120: var(--ramps-primary-120-xspector);
|
|
20
|
-
--primary-ramps-primary-130: var(--ramps-primary-130-xspector);
|
|
21
|
-
--primary-ramps-primary-140: var(--ramps-primary-140-xspector);
|
|
22
|
-
--primary-ramps-primary-150: var(--ramps-primary-150-xspector);
|
|
23
|
-
|
|
24
|
-
/* Secondary */
|
|
25
|
-
--secondary-ramps-secondary-5: var(--ramps-secondary-5-xspector);
|
|
26
|
-
--secondary-ramps-secondary-10: var(--ramps-secondary-10-xspector);
|
|
27
|
-
--secondary-ramps-secondary-20: var(--ramps-secondary-20-xspector);
|
|
28
|
-
--secondary-ramps-secondary-30: var(--ramps-secondary-30-xspector);
|
|
29
|
-
--secondary-ramps-secondary-40: var(--ramps-secondary-40-xspector);
|
|
30
|
-
--secondary-ramps-secondary-50: var(--ramps-secondary-50-xspector);
|
|
31
|
-
--secondary-ramps-secondary-60: var(--ramps-secondary-60-xspector);
|
|
32
|
-
--secondary-ramps-secondary-70: var(--ramps-secondary-70-xspector);
|
|
33
|
-
--secondary-ramps-secondary-80: var(--ramps-secondary-80-xspector);
|
|
34
|
-
--secondary-ramps-secondary-90: var(--ramps-secondary-90-xspector);
|
|
35
|
-
--secondary-ramps-secondary-100: var(--ramps-secondary-100-xspector);
|
|
36
|
-
--secondary-ramps-secondary-110: var(--ramps-secondary-110-xspector);
|
|
37
|
-
--secondary-ramps-secondary-120: var(--ramps-secondary-120-xspector);
|
|
38
|
-
--secondary-ramps-secondary-130: var(--ramps-secondary-130-xspector);
|
|
39
|
-
--secondary-ramps-secondary-140: var(--ramps-secondary-140-xspector);
|
|
40
|
-
--secondary-ramps-secondary-150: var(--ramps-secondary-150-xspector);
|
|
41
|
-
|
|
42
|
-
/* Tertiary */
|
|
43
|
-
--tertiary-ramps-tertiary-5: var(--ramps-tertiary-5-xspector);
|
|
44
|
-
--tertiary-ramps-tertiary-10: var(--ramps-tertiary-10-xspector);
|
|
45
|
-
--tertiary-ramps-tertiary-20: var(--ramps-tertiary-20-xspector);
|
|
46
|
-
--tertiary-ramps-tertiary-30: var(--ramps-tertiary-30-xspector);
|
|
47
|
-
--tertiary-ramps-tertiary-40: var(--ramps-tertiary-40-xspector);
|
|
48
|
-
--tertiary-ramps-tertiary-50: var(--ramps-tertiary-50-xspector);
|
|
49
|
-
--tertiary-ramps-tertiary-60: var(--ramps-tertiary-60-xspector);
|
|
50
|
-
--tertiary-ramps-tertiary-70: var(--ramps-tertiary-70-xspector);
|
|
51
|
-
--tertiary-ramps-tertiary-80: var(--ramps-tertiary-80-xspector);
|
|
52
|
-
--tertiary-ramps-tertiary-90: var(--ramps-tertiary-90-xspector);
|
|
53
|
-
--tertiary-ramps-tertiary-100: var(--ramps-tertiary-100-xspector);
|
|
54
|
-
--tertiary-ramps-tertiary-110: var(--ramps-tertiary-110-xspector);
|
|
55
|
-
--tertiary-ramps-tertiary-120: var(--ramps-tertiary-120-xspector);
|
|
56
|
-
--tertiary-ramps-tertiary-130: var(--ramps-tertiary-130-xspector);
|
|
57
|
-
--tertiary-ramps-tertiary-140: var(--ramps-tertiary-140-xspector);
|
|
58
|
-
--tertiary-ramps-tertiary-150: var(--ramps-tertiary-150-xspector);
|
|
59
|
-
|
|
60
|
-
/* Grey */
|
|
61
|
-
--grey-grey-5: var(--ramps-grey-5-xspector);
|
|
62
|
-
--grey-grey-10: var(--ramps-grey-10-xspector);
|
|
63
|
-
--grey-grey-20: var(--ramps-grey-20-xspector);
|
|
64
|
-
--grey-grey-30: var(--ramps-grey-30-xspector);
|
|
65
|
-
--grey-grey-40: var(--ramps-grey-40-xspector);
|
|
66
|
-
--grey-grey-50: var(--ramps-grey-50-xspector);
|
|
67
|
-
--grey-grey-60: var(--ramps-grey-60-xspector);
|
|
68
|
-
--grey-grey-70: var(--ramps-grey-70-xspector);
|
|
69
|
-
--grey-grey-80: var(--ramps-grey-80-xspector);
|
|
70
|
-
--grey-grey-90: var(--ramps-grey-90-xspector);
|
|
71
|
-
--grey-grey-100: var(--ramps-grey-100-xspector);
|
|
72
|
-
--grey-grey-110: var(--ramps-grey-110-xspector);
|
|
73
|
-
--grey-grey-120: var(--ramps-grey-120-xspector);
|
|
74
|
-
--grey-grey-130: var(--ramps-grey-130-xspector);
|
|
75
|
-
--grey-grey-140: var(--ramps-grey-140-xspector);
|
|
76
|
-
--grey-grey-150: var(--ramps-grey-150-xspector);
|
|
77
|
-
|
|
78
|
-
/* Grey2 */
|
|
79
|
-
--grey2-grey2-50: var(--ramps-grey2-50-xspector);
|
|
80
|
-
--grey2-grey2-100: var(--ramps-grey2-100-xspector);
|
|
81
|
-
--grey2-grey2-200: var(--ramps-grey2-200-xspector);
|
|
82
|
-
--grey2-grey2-300: var(--ramps-grey2-300-xspector);
|
|
83
|
-
--grey2-grey2-400: var(--ramps-grey2-400-xspector);
|
|
84
|
-
--grey2-grey2-500: var(--ramps-grey2-500-xspector);
|
|
85
|
-
--grey2-grey2-600: var(--ramps-grey2-600-xspector);
|
|
86
|
-
--grey2-grey2-700: var(--ramps-grey2-700-xspector);
|
|
87
|
-
--grey2-grey2-800: var(--ramps-grey2-800-xspector);
|
|
88
|
-
--grey2-grey2-900: var(--ramps-grey2-900-xspector);
|
|
89
|
-
--grey2-grey2-950: var(--ramps-grey2-950-xspector);
|
|
90
|
-
|
|
91
|
-
/* Info */
|
|
92
|
-
--info-info-50: var(--ramps-info-50-xspector);
|
|
93
|
-
--info-info-100: var(--ramps-info-100-xspector);
|
|
94
|
-
--info-info-200: var(--ramps-info-200-xspector);
|
|
95
|
-
--info-info-300: var(--ramps-info-300-xspector);
|
|
96
|
-
--info-info-400: var(--ramps-info-400-xspector);
|
|
97
|
-
--info-info-500: var(--ramps-info-500-xspector);
|
|
98
|
-
--info-info-600: var(--ramps-info-600-xspector);
|
|
99
|
-
--info-info-700: var(--ramps-info-700-xspector);
|
|
100
|
-
--info-info-800: var(--ramps-info-800-xspector);
|
|
101
|
-
--info-info-900: var(--ramps-info-900-xspector);
|
|
102
|
-
--info-info-950: var(--ramps-info-950-xspector);
|
|
103
|
-
|
|
104
|
-
/* Success */
|
|
105
|
-
--success-success-50: var(--ramps-success-50-xspector);
|
|
106
|
-
--success-success-100: var(--ramps-success-100-xspector);
|
|
107
|
-
--success-success-200: var(--ramps-success-200-xspector);
|
|
108
|
-
--success-success-300: var(--ramps-success-300-xspector);
|
|
109
|
-
--success-success-400: var(--ramps-success-400-xspector);
|
|
110
|
-
--success-success-500: var(--ramps-success-500-xspector);
|
|
111
|
-
--success-success-600: var(--ramps-success-600-xspector);
|
|
112
|
-
--success-success-700: var(--ramps-success-700-xspector);
|
|
113
|
-
--success-success-800: var(--ramps-success-800-xspector);
|
|
114
|
-
--success-success-900: var(--ramps-success-900-xspector);
|
|
115
|
-
--success-success-950: var(--ramps-success-950-xspector);
|
|
116
|
-
|
|
117
|
-
/* Warning */
|
|
118
|
-
--warning-warning-50: var(--ramps-warning-50-xspector);
|
|
119
|
-
--warning-warning-100: var(--ramps-warning-100-xspector);
|
|
120
|
-
--warning-warning-200: var(--ramps-warning-200-xspector);
|
|
121
|
-
--warning-warning-300: var(--ramps-warning-300-xspector);
|
|
122
|
-
--warning-warning-400: var(--ramps-warning-400-xspector);
|
|
123
|
-
--warning-warning-500: var(--ramps-warning-500-xspector);
|
|
124
|
-
--warning-warning-600: var(--ramps-warning-600-xspector);
|
|
125
|
-
--warning-warning-700: var(--ramps-warning-700-xspector);
|
|
126
|
-
--warning-warning-800: var(--ramps-warning-800-xspector);
|
|
127
|
-
--warning-warning-900: var(--ramps-warning-900-xspector);
|
|
128
|
-
--warning-warning-950: var(--ramps-warning-950-xspector);
|
|
129
|
-
|
|
130
|
-
/* Error */
|
|
131
|
-
--error-error-50: var(--ramps-error-50-xspector);
|
|
132
|
-
--error-error-100: var(--ramps-error-100-xspector);
|
|
133
|
-
--error-error-200: var(--ramps-error-200-xspector);
|
|
134
|
-
--error-error-300: var(--ramps-error-300-xspector);
|
|
135
|
-
--error-error-400: var(--ramps-error-400-xspector);
|
|
136
|
-
--error-error-500: var(--ramps-error-500-xspector);
|
|
137
|
-
--error-error-600: var(--ramps-error-600-xspector);
|
|
138
|
-
--error-error-700: var(--ramps-error-700-xspector);
|
|
139
|
-
--error-error-800: var(--ramps-error-800-xspector);
|
|
140
|
-
--error-error-900: var(--ramps-error-900-xspector);
|
|
141
|
-
--error-error-950: var(--ramps-error-950-xspector);
|
|
142
|
-
}
|