@salt-ds/theme 0.0.0-snapshot-20240726124318 → 0.0.0-snapshot-20240910092109

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.
Files changed (79) hide show
  1. package/css/global.css +3 -10
  2. package/css/theme-next.css +1119 -31
  3. package/css/theme.css +2196 -55
  4. package/index.css +2227 -2
  5. package/package.json +3 -4
  6. package/CHANGELOG.md +0 -1308
  7. package/README.md +0 -1
  8. package/css/characteristics/accent-next.css +0 -5
  9. package/css/characteristics/accent.css +0 -5
  10. package/css/characteristics/actionable-next.css +0 -41
  11. package/css/characteristics/actionable.css +0 -47
  12. package/css/characteristics/category-next.css +0 -22
  13. package/css/characteristics/category.css +0 -141
  14. package/css/characteristics/container-next.css +0 -16
  15. package/css/characteristics/container.css +0 -18
  16. package/css/characteristics/content-next.css +0 -14
  17. package/css/characteristics/content.css +0 -15
  18. package/css/characteristics/draggable.css +0 -10
  19. package/css/characteristics/editable-next.css +0 -19
  20. package/css/characteristics/editable.css +0 -33
  21. package/css/characteristics/focused-next.css +0 -3
  22. package/css/characteristics/focused.css +0 -21
  23. package/css/characteristics/navigable-next.css +0 -6
  24. package/css/characteristics/navigable.css +0 -21
  25. package/css/characteristics/overlayable-next.css +0 -4
  26. package/css/characteristics/overlayable.css +0 -12
  27. package/css/characteristics/selectable-next.css +0 -20
  28. package/css/characteristics/selectable.css +0 -31
  29. package/css/characteristics/separable-next.css +0 -5
  30. package/css/characteristics/separable.css +0 -7
  31. package/css/characteristics/status-next.css +0 -34
  32. package/css/characteristics/status.css +0 -34
  33. package/css/characteristics/target-next.css +0 -4
  34. package/css/characteristics/target.css +0 -10
  35. package/css/characteristics/text-next.css +0 -56
  36. package/css/characteristics/text.css +0 -226
  37. package/css/characteristics/track-next.css +0 -3
  38. package/css/characteristics/track.css +0 -8
  39. package/css/deprecated/characteristics.css +0 -186
  40. package/css/deprecated/fade.css +0 -8
  41. package/css/deprecated/foundations.css +0 -107
  42. package/css/deprecated/palette.css +0 -159
  43. package/css/foundations/alpha-next.css +0 -48
  44. package/css/foundations/animation.css +0 -155
  45. package/css/foundations/color-next.css +0 -148
  46. package/css/foundations/color.css +0 -297
  47. package/css/foundations/curve-next.css +0 -31
  48. package/css/foundations/duration.css +0 -6
  49. package/css/foundations/fade.css +0 -72
  50. package/css/foundations/opacity.css +0 -9
  51. package/css/foundations/shadow.css +0 -23
  52. package/css/foundations/size.css +0 -51
  53. package/css/foundations/spacing.css +0 -31
  54. package/css/foundations/typography.css +0 -12
  55. package/css/foundations/zindex.css +0 -14
  56. package/css/palette/accent-next.css +0 -63
  57. package/css/palette/accent.css +0 -11
  58. package/css/palette/alpha-next.css +0 -19
  59. package/css/palette/background-next.css +0 -16
  60. package/css/palette/categorical.css +0 -163
  61. package/css/palette/corner-next.css +0 -12
  62. package/css/palette/error.css +0 -17
  63. package/css/palette/foreground-next.css +0 -22
  64. package/css/palette/info-next.css +0 -10
  65. package/css/palette/info.css +0 -15
  66. package/css/palette/interact.css +0 -91
  67. package/css/palette/navigate.css +0 -17
  68. package/css/palette/negative-next.css +0 -10
  69. package/css/palette/negative.css +0 -7
  70. package/css/palette/neutral-next.css +0 -34
  71. package/css/palette/neutral.css +0 -51
  72. package/css/palette/opacity.css +0 -9
  73. package/css/palette/positive-next.css +0 -10
  74. package/css/palette/positive.css +0 -7
  75. package/css/palette/success.css +0 -17
  76. package/css/palette/text-next.css +0 -50
  77. package/css/palette/text.css +0 -24
  78. package/css/palette/warning-next.css +0 -10
  79. package/css/palette/warning.css +0 -17
package/css/palette/categorical.css DELETED
@@ -1,163 +0,0 @@
1
- .salt-theme[data-mode="light"] {
2
- --salt-palette-categorical-1: var(--salt-color-cobalt-500);
3
- --salt-palette-categorical-1-strong: var(--salt-color-cobalt-600);
4
- --salt-palette-categorical-1-weakest: var(--salt-color-cobalt-100);
5
-
6
- --salt-palette-categorical-2: var(--salt-color-cider-500);
7
- --salt-palette-categorical-2-strong: var(--salt-color-cider-600);
8
- --salt-palette-categorical-2-weakest: var(--salt-color-cider-100);
9
-
10
- --salt-palette-categorical-3: var(--salt-color-plum-500);
11
- --salt-palette-categorical-3-strong: var(--salt-color-plum-600);
12
- --salt-palette-categorical-3-weakest: var(--salt-color-plum-100);
13
-
14
- --salt-palette-categorical-4: var(--salt-color-aqua-500);
15
- --salt-palette-categorical-4-strong: var(--salt-color-aqua-600);
16
- --salt-palette-categorical-4-weakest: var(--salt-color-aqua-100);
17
-
18
- --salt-palette-categorical-5: var(--salt-color-slate-500);
19
- --salt-palette-categorical-5-strong: var(--salt-color-slate-600);
20
- --salt-palette-categorical-5-weakest: var(--salt-color-slate-100);
21
-
22
- --salt-palette-categorical-6: var(--salt-color-rose-500);
23
- --salt-palette-categorical-6-strong: var(--salt-color-rose-600);
24
- --salt-palette-categorical-6-weakest: var(--salt-color-rose-100);
25
-
26
- --salt-palette-categorical-7: var(--salt-color-olive-500);
27
- --salt-palette-categorical-7-strong: var(--salt-color-olive-600);
28
- --salt-palette-categorical-7-weakest: var(--salt-color-olive-100);
29
-
30
- --salt-palette-categorical-8: var(--salt-color-salmon-500);
31
- --salt-palette-categorical-8-strong: var(--salt-color-salmon-600);
32
- --salt-palette-categorical-8-weakest: var(--salt-color-salmon-100);
33
-
34
- --salt-palette-categorical-9: var(--salt-color-indigo-500);
35
- --salt-palette-categorical-9-strong: var(--salt-color-indigo-600);
36
- --salt-palette-categorical-9-weakest: var(--salt-color-indigo-100);
37
-
38
- --salt-palette-categorical-10: var(--salt-color-jade-500);
39
- --salt-palette-categorical-10-strong: var(--salt-color-jade-600);
40
- --salt-palette-categorical-10-weakest: var(--salt-color-jade-100);
41
-
42
- --salt-palette-categorical-11: var(--salt-color-citrine-500);
43
- --salt-palette-categorical-11-strong: var(--salt-color-citrine-600);
44
- --salt-palette-categorical-11-weakest: var(--salt-color-citrine-100);
45
-
46
- --salt-palette-categorical-12: var(--salt-color-autumn-500);
47
- --salt-palette-categorical-12-strong: var(--salt-color-autumn-600);
48
- --salt-palette-categorical-12-weakest: var(--salt-color-autumn-100);
49
-
50
- --salt-palette-categorical-13: var(--salt-color-lavender-500);
51
- --salt-palette-categorical-13-strong: var(--salt-color-lavender-600);
52
- --salt-palette-categorical-13-weakest: var(--salt-color-lavender-100);
53
-
54
- --salt-palette-categorical-14: var(--salt-color-ocean-500);
55
- --salt-palette-categorical-14-strong: var(--salt-color-ocean-600);
56
- --salt-palette-categorical-14-weakest: var(--salt-color-ocean-100);
57
-
58
- --salt-palette-categorical-15: var(--salt-color-smoke-500);
59
- --salt-palette-categorical-15-strong: var(--salt-color-smoke-600);
60
- --salt-palette-categorical-15-weakest: var(--salt-color-smoke-100);
61
-
62
- --salt-palette-categorical-16: var(--salt-color-fuchsia-500);
63
- --salt-palette-categorical-16-strong: var(--salt-color-fuchsia-600);
64
- --salt-palette-categorical-16-weakest: var(--salt-color-fuchsia-100);
65
-
66
- --salt-palette-categorical-17: var(--salt-color-lime-500);
67
- --salt-palette-categorical-17-strong: var(--salt-color-lime-600);
68
- --salt-palette-categorical-17-weakest: var(--salt-color-lime-100);
69
-
70
- --salt-palette-categorical-18: var(--salt-color-fur-500);
71
- --salt-palette-categorical-18-strong: var(--salt-color-fur-600);
72
- --salt-palette-categorical-18-weakest: var(--salt-color-fur-100);
73
-
74
- --salt-palette-categorical-19: var(--salt-color-violet-500);
75
- --salt-palette-categorical-19-strong: var(--salt-color-violet-600);
76
- --salt-palette-categorical-19-weakest: var(--salt-color-violet-100);
77
-
78
- --salt-palette-categorical-20: var(--salt-color-forest-500);
79
- --salt-palette-categorical-20-strong: var(--salt-color-forest-600);
80
- --salt-palette-categorical-20-weakest: var(--salt-color-forest-100);
81
- }
82
-
83
- .salt-theme[data-mode="dark"] {
84
- --salt-palette-categorical-1: var(--salt-color-cobalt-500);
85
- --salt-palette-categorical-1-strong: var(--salt-color-cobalt-400);
86
- --salt-palette-categorical-1-weakest: var(--salt-color-cobalt-900);
87
-
88
- --salt-palette-categorical-2: var(--salt-color-cider-500);
89
- --salt-palette-categorical-2-strong: var(--salt-color-cider-400);
90
- --salt-palette-categorical-2-weakest: var(--salt-color-cider-900);
91
-
92
- --salt-palette-categorical-3: var(--salt-color-plum-500);
93
- --salt-palette-categorical-3-strong: var(--salt-color-plum-400);
94
- --salt-palette-categorical-3-weakest: var(--salt-color-plum-900);
95
-
96
- --salt-palette-categorical-4: var(--salt-color-aqua-500);
97
- --salt-palette-categorical-4-strong: var(--salt-color-aqua-400);
98
- --salt-palette-categorical-4-weakest: var(--salt-color-aqua-900);
99
-
100
- --salt-palette-categorical-5: var(--salt-color-slate-500);
101
- --salt-palette-categorical-5-strong: var(--salt-color-slate-400);
102
- --salt-palette-categorical-5-weakest: var(--salt-color-slate-900);
103
-
104
- --salt-palette-categorical-6: var(--salt-color-rose-500);
105
- --salt-palette-categorical-6-strong: var(--salt-color-rose-400);
106
- --salt-palette-categorical-6-weakest: var(--salt-color-rose-900);
107
-
108
- --salt-palette-categorical-7: var(--salt-color-olive-500);
109
- --salt-palette-categorical-7-strong: var(--salt-color-olive-400);
110
- --salt-palette-categorical-7-weakest: var(--salt-color-olive-900);
111
-
112
- --salt-palette-categorical-8: var(--salt-color-salmon-500);
113
- --salt-palette-categorical-8-strong: var(--salt-color-salmon-400);
114
- --salt-palette-categorical-8-weakest: var(--salt-color-salmon-900);
115
-
116
- --salt-palette-categorical-9: var(--salt-color-indigo-500);
117
- --salt-palette-categorical-9-strong: var(--salt-color-indigo-400);
118
- --salt-palette-categorical-9-weakest: var(--salt-color-indigo-900);
119
-
120
- --salt-palette-categorical-10: var(--salt-color-jade-500);
121
- --salt-palette-categorical-10-strong: var(--salt-color-jade-400);
122
- --salt-palette-categorical-10-weakest: var(--salt-color-jade-900);
123
-
124
- --salt-palette-categorical-11: var(--salt-color-citrine-500);
125
- --salt-palette-categorical-11-strong: var(--salt-color-citrine-400);
126
- --salt-palette-categorical-11-weakest: var(--salt-color-citrine-900);
127
-
128
- --salt-palette-categorical-12: var(--salt-color-autumn-500);
129
- --salt-palette-categorical-12-strong: var(--salt-color-autumn-400);
130
- --salt-palette-categorical-12-weakest: var(--salt-color-autumn-900);
131
-
132
- --salt-palette-categorical-13: var(--salt-color-lavender-500);
133
- --salt-palette-categorical-13-strong: var(--salt-color-lavender-400);
134
- --salt-palette-categorical-13-weakest: var(--salt-color-lavender-900);
135
-
136
- --salt-palette-categorical-14: var(--salt-color-ocean-500);
137
- --salt-palette-categorical-14-strong: var(--salt-color-ocean-400);
138
- --salt-palette-categorical-14-weakest: var(--salt-color-ocean-900);
139
-
140
- --salt-palette-categorical-15: var(--salt-color-smoke-500);
141
- --salt-palette-categorical-15-strong: var(--salt-color-smoke-400);
142
- --salt-palette-categorical-15-weakest: var(--salt-color-smoke-900);
143
-
144
- --salt-palette-categorical-16: var(--salt-color-fuchsia-500);
145
- --salt-palette-categorical-16-strong: var(--salt-color-fuchsia-400);
146
- --salt-palette-categorical-16-weakest: var(--salt-color-fuchsia-900);
147
-
148
- --salt-palette-categorical-17: var(--salt-color-lime-500);
149
- --salt-palette-categorical-17-strong: var(--salt-color-lime-400);
150
- --salt-palette-categorical-17-weakest: var(--salt-color-lime-900);
151
-
152
- --salt-palette-categorical-18: var(--salt-color-fur-500);
153
- --salt-palette-categorical-18-strong: var(--salt-color-fur-400);
154
- --salt-palette-categorical-18-weakest: var(--salt-color-fur-900);
155
-
156
- --salt-palette-categorical-19: var(--salt-color-violet-500);
157
- --salt-palette-categorical-19-strong: var(--salt-color-violet-400);
158
- --salt-palette-categorical-19-weakest: var(--salt-color-violet-900);
159
-
160
- --salt-palette-categorical-20: var(--salt-color-forest-500);
161
- --salt-palette-categorical-20-strong: var(--salt-color-forest-400);
162
- --salt-palette-categorical-20-weakest: var(--salt-color-forest-900);
163
- }
package/css/palette/corner-next.css DELETED
@@ -1,12 +0,0 @@
1
- .salt-theme-next[data-corner="rounded"] {
2
- --salt-palette-corner-weaker: var(--salt-curve-50);
3
- --salt-palette-corner-weak: var(--salt-curve-100);
4
- --salt-palette-corner: var(--salt-curve-150);
5
- --salt-palette-corner-strongest: var(--salt-curve-999);
6
- }
7
- .salt-theme-next[data-corner="sharp"] {
8
- --salt-palette-corner-weaker: var(--salt-curve-0);
9
- --salt-palette-corner-weak: var(--salt-curve-0);
10
- --salt-palette-corner: var(--salt-curve-0);
11
- --salt-palette-corner-strongest: var(--salt-curve-999);
12
- }
package/css/palette/error.css DELETED
@@ -1,17 +0,0 @@
1
- .salt-theme[data-mode="light"] {
2
- --salt-palette-error-background: var(--salt-color-red-10);
3
- --salt-palette-error-bold-background: var(--salt-color-red-500);
4
- --salt-palette-error-background-selected: var(--salt-color-red-20);
5
- --salt-palette-error-border: var(--salt-color-red-500);
6
- --salt-palette-error-foreground-decorative: var(--salt-color-red-500);
7
- --salt-palette-error-foreground-informative: var(--salt-color-red-600);
8
- }
9
-
10
- .salt-theme[data-mode="dark"] {
11
- --salt-palette-error-background: var(--salt-color-red-900);
12
- --salt-palette-error-bold-background: var(--salt-color-red-500);
13
- --salt-palette-error-background-selected: var(--salt-color-red-900);
14
- --salt-palette-error-border: var(--salt-color-red-400);
15
- --salt-palette-error-foreground-decorative: var(--salt-color-red-400);
16
- --salt-palette-error-foreground-informative: var(--salt-color-red-200);
17
- }
package/css/palette/foreground-next.css DELETED
@@ -1,22 +0,0 @@
1
- .salt-theme.salt-theme-next[data-mode="light"] {
2
- --salt-palette-foreground-active: var(--salt-color-blue-700);
3
- --salt-palette-foreground-hover: var(--salt-color-blue-600);
4
- --salt-palette-foreground-primary: var(--salt-color-black);
5
- --salt-palette-foreground-primary-disabled: var(--salt-color-black-40a);
6
- --salt-palette-foreground-primary-alt: var(--salt-color-white);
7
- --salt-palette-foreground-primary-alt-disabled: var(--salt-color-white-40a);
8
- --salt-palette-foreground-secondary: var(--salt-color-gray-600);
9
- --salt-palette-foreground-secondary-disabled: var(--salt-color-gray-600-40a);
10
- --salt-palette-foreground-visited: var(--salt-color-purple-800);
11
- }
12
- .salt-theme.salt-theme-next[data-mode="dark"] {
13
- --salt-palette-foreground-active: var(--salt-color-blue-300);
14
- --salt-palette-foreground-hover: var(--salt-color-blue-400);
15
- --salt-palette-foreground-primary: var(--salt-color-white);
16
- --salt-palette-foreground-primary-disabled: var(--salt-color-white-40a);
17
- --salt-palette-foreground-primary-alt: var(--salt-color-white);
18
- --salt-palette-foreground-primary-alt-disabled: var(--salt-color-white-40a);
19
- --salt-palette-foreground-secondary: var(--salt-color-gray-400);
20
- --salt-palette-foreground-secondary-disabled: var(--salt-color-gray-400-40a);
21
- --salt-palette-foreground-visited: var(--salt-color-purple-200);
22
- }
package/css/palette/info-next.css DELETED
@@ -1,10 +0,0 @@
1
- .salt-theme.salt-theme-next[data-mode="light"] {
2
- --salt-palette-info: var(--salt-color-blue-500);
3
- --salt-palette-info-strong: var(--salt-color-blue-600);
4
- --salt-palette-info-weak: var(--salt-color-blue-100);
5
- }
6
- .salt-theme.salt-theme-next[data-mode="dark"] {
7
- --salt-palette-info: var(--salt-color-blue-500);
8
- --salt-palette-info-strong: var(--salt-color-blue-400);
9
- --salt-palette-info-weak: var(--salt-color-blue-900);
10
- }
package/css/palette/info.css DELETED
@@ -1,15 +0,0 @@
1
- .salt-theme[data-mode="light"] {
2
- --salt-palette-info-background: var(--salt-color-blue-10);
3
- --salt-palette-info-bold-background: var(--salt-color-blue-500);
4
- --salt-palette-info-border: var(--salt-color-blue-500);
5
- --salt-palette-info-foreground-decorative: var(--salt-color-blue-500);
6
- --salt-palette-info-foreground-informative: var(--salt-color-blue-600);
7
- }
8
-
9
- .salt-theme[data-mode="dark"] {
10
- --salt-palette-info-background: var(--salt-color-blue-900);
11
- --salt-palette-info-bold-background: var(--salt-color-blue-500);
12
- --salt-palette-info-border: var(--salt-color-blue-400);
13
- --salt-palette-info-foreground-decorative: var(--salt-color-blue-400);
14
- --salt-palette-info-foreground-informative: var(--salt-color-blue-200);
15
- }
package/css/palette/interact.css DELETED
@@ -1,91 +0,0 @@
1
- .salt-theme[data-mode="light"] {
2
- --salt-palette-interact-background: transparent;
3
- --salt-palette-interact-background-blurSelected: var(--salt-color-gray-30);
4
- --salt-palette-interact-background-hover: var(--salt-color-blue-10);
5
- --salt-palette-interact-background-active: var(--salt-color-blue-30);
6
- --salt-palette-interact-background-disabled: transparent;
7
- --salt-palette-interact-background-activeDisabled: var(--salt-color-blue-30-fade-background);
8
- --salt-palette-interact-border: var(--salt-color-gray-200);
9
- --salt-palette-interact-border-active: var(--salt-color-blue-600);
10
- --salt-palette-interact-border-activeDisabled: var(--salt-color-blue-600-fade-fill);
11
- --salt-palette-interact-border-disabled: var(--salt-color-gray-200-fade-border);
12
- --salt-palette-interact-border-hover: var(--salt-color-blue-500);
13
- --salt-palette-interact-border-readonly: var(--salt-color-gray-200-fade-border-readonly);
14
- --salt-palette-interact-foreground: var(--salt-color-gray-200);
15
- --salt-palette-interact-foreground-active: var(--salt-color-blue-600);
16
- --salt-palette-interact-foreground-activeDisabled: var(--salt-color-blue-600-fade-foreground);
17
- --salt-palette-interact-foreground-disabled: var(--salt-color-gray-200-fade-foreground);
18
- --salt-palette-interact-foreground-hover: var(--salt-color-blue-500);
19
- --salt-palette-interact-outline: var(--salt-color-blue-600);
20
-
21
- --salt-palette-interact-cta-background: var(--salt-color-blue-600);
22
- --salt-palette-interact-cta-background-active: var(--salt-color-blue-700);
23
- --salt-palette-interact-cta-background-disabled: var(--salt-color-blue-600-fade-background);
24
- --salt-palette-interact-cta-background-hover: var(--salt-color-blue-500);
25
- --salt-palette-interact-cta-foreground: var(--salt-color-white);
26
- --salt-palette-interact-cta-foreground-active: var(--salt-color-white);
27
- --salt-palette-interact-cta-foreground-disabled: var(--salt-color-white-fade-foreground);
28
- --salt-palette-interact-cta-foreground-hover: var(--salt-color-white);
29
- --salt-palette-interact-primary-background: var(--salt-color-gray-60);
30
- --salt-palette-interact-primary-background-active: var(--salt-color-gray-200);
31
- --salt-palette-interact-primary-background-disabled: var(--salt-color-gray-60-fade-background);
32
- --salt-palette-interact-primary-background-hover: var(--salt-color-gray-40);
33
- --salt-palette-interact-primary-foreground: var(--salt-color-gray-900);
34
- --salt-palette-interact-primary-foreground-active: var(--salt-color-white);
35
- --salt-palette-interact-primary-foreground-disabled: var(--salt-color-gray-900-fade-foreground);
36
- --salt-palette-interact-primary-foreground-hover: var(--salt-color-gray-900);
37
- --salt-palette-interact-secondary-background: transparent;
38
- --salt-palette-interact-secondary-background-active: var(--salt-color-gray-200);
39
- --salt-palette-interact-secondary-background-disabled: transparent;
40
- --salt-palette-interact-secondary-background-hover: var(--salt-color-gray-40);
41
- --salt-palette-interact-secondary-foreground: var(--salt-color-gray-900);
42
- --salt-palette-interact-secondary-foreground-active: var(--salt-color-white);
43
- --salt-palette-interact-secondary-foreground-disabled: var(--salt-color-gray-900-fade-foreground);
44
- --salt-palette-interact-secondary-foreground-hover: var(--salt-color-gray-900);
45
- }
46
-
47
- .salt-theme[data-mode="dark"] {
48
- --salt-palette-interact-background: transparent;
49
- --salt-palette-interact-background-active: var(--salt-color-blue-700);
50
- --salt-palette-interact-background-blurSelected: var(--salt-color-gray-600);
51
- --salt-palette-interact-background-hover: var(--salt-color-blue-800);
52
- --salt-palette-interact-background-disabled: transparent;
53
- --salt-palette-interact-background-activeDisabled: var(--salt-color-blue-700-fade-background);
54
- --salt-palette-interact-border: var(--salt-color-gray-90);
55
- --salt-palette-interact-border-active: var(--salt-color-blue-100);
56
- --salt-palette-interact-border-activeDisabled: var(--salt-color-blue-100-fade-fill);
57
- --salt-palette-interact-border-disabled: var(--salt-color-gray-90-fade-border);
58
- --salt-palette-interact-border-hover: var(--salt-color-blue-500);
59
- --salt-palette-interact-border-readonly: var(--salt-color-gray-90-fade-border-readonly);
60
- --salt-palette-interact-foreground: var(--salt-color-gray-90);
61
- --salt-palette-interact-foreground-active: var(--salt-color-blue-100);
62
- --salt-palette-interact-foreground-activeDisabled: var(--salt-color-blue-100-fade-foreground);
63
- --salt-palette-interact-foreground-disabled: var(--salt-color-gray-90-fade-foreground);
64
- --salt-palette-interact-foreground-hover: var(--salt-color-blue-500);
65
- --salt-palette-interact-outline: var(--salt-color-blue-100);
66
-
67
- --salt-palette-interact-cta-background: var(--salt-color-blue-600);
68
- --salt-palette-interact-cta-background-active: var(--salt-color-blue-700);
69
- --salt-palette-interact-cta-background-disabled: var(--salt-color-blue-600-fade-background);
70
- --salt-palette-interact-cta-background-hover: var(--salt-color-blue-500);
71
- --salt-palette-interact-cta-foreground: var(--salt-color-white);
72
- --salt-palette-interact-cta-foreground-active: var(--salt-color-white);
73
- --salt-palette-interact-cta-foreground-disabled: var(--salt-color-white-fade-foreground);
74
- --salt-palette-interact-cta-foreground-hover: var(--salt-color-white);
75
- --salt-palette-interact-primary-background: var(--salt-color-gray-300);
76
- --salt-palette-interact-primary-background-active: var(--salt-color-gray-70);
77
- --salt-palette-interact-primary-background-disabled: var(--salt-color-gray-300-fade-background);
78
- --salt-palette-interact-primary-background-hover: var(--salt-color-gray-200);
79
- --salt-palette-interact-primary-foreground: var(--salt-color-white);
80
- --salt-palette-interact-primary-foreground-active: var(--salt-color-gray-900);
81
- --salt-palette-interact-primary-foreground-disabled: var(--salt-color-white-fade-foreground);
82
- --salt-palette-interact-primary-foreground-hover: var(--salt-color-white);
83
- --salt-palette-interact-secondary-background: transparent;
84
- --salt-palette-interact-secondary-background-active: var(--salt-color-gray-70);
85
- --salt-palette-interact-secondary-background-disabled: transparent;
86
- --salt-palette-interact-secondary-background-hover: var(--salt-color-gray-200);
87
- --salt-palette-interact-secondary-foreground: var(--salt-color-white);
88
- --salt-palette-interact-secondary-foreground-active: var(--salt-color-gray-900);
89
- --salt-palette-interact-secondary-foreground-disabled: var(--salt-color-white-fade-foreground);
90
- --salt-palette-interact-secondary-foreground-hover: var(--salt-color-white);
91
- }
package/css/palette/navigate.css DELETED
@@ -1,17 +0,0 @@
1
- .salt-theme[data-mode="light"] {
2
- --salt-palette-navigate-background-hover: var(--salt-color-black-fade-background-hover);
3
- --salt-palette-navigate-foreground-hover: var(--salt-color-blue-600);
4
- --salt-palette-navigate-foreground-active: var(--salt-color-blue-700);
5
- --salt-palette-navigate-foreground-visited: var(--salt-color-purple-800);
6
- --salt-palette-navigate-indicator-hover: var(--salt-color-gray-90);
7
- --salt-palette-navigate-indicator-active: var(--salt-color-orange-600);
8
- }
9
-
10
- .salt-theme[data-mode="dark"] {
11
- --salt-palette-navigate-background-hover: var(--salt-color-white-fade-background-hover);
12
- --salt-palette-navigate-foreground-hover: var(--salt-color-blue-200);
13
- --salt-palette-navigate-foreground-active: var(--salt-color-blue-300);
14
- --salt-palette-navigate-foreground-visited: var(--salt-color-purple-100);
15
- --salt-palette-navigate-indicator-hover: var(--salt-color-gray-90);
16
- --salt-palette-navigate-indicator-active: var(--salt-color-orange-400);
17
- }
package/css/palette/negative-next.css DELETED
@@ -1,10 +0,0 @@
1
- .salt-theme.salt-theme-next[data-mode="light"] {
2
- --salt-palette-negative: var(--salt-color-red-500);
3
- --salt-palette-negative-strong: var(--salt-color-red-600);
4
- --salt-palette-negative-weak: var(--salt-color-red-100);
5
- }
6
- .salt-theme.salt-theme-next[data-mode="dark"] {
7
- --salt-palette-negative: var(--salt-color-red-500);
8
- --salt-palette-negative-strong: var(--salt-color-red-400);
9
- --salt-palette-negative-weak: var(--salt-color-red-900);
10
- }
package/css/palette/negative.css DELETED
@@ -1,7 +0,0 @@
1
- .salt-theme[data-mode="light"] {
2
- --salt-palette-negative-foreground: var(--salt-color-red-700);
3
- }
4
-
5
- .salt-theme[data-mode="dark"] {
6
- --salt-palette-negative-foreground: var(--salt-color-red-300);
7
- }
package/css/palette/neutral-next.css DELETED
@@ -1,34 +0,0 @@
1
- .salt-theme.salt-theme-next[data-mode="light"] {
2
- --salt-palette-neutral: var(--salt-color-gray-500);
3
- --salt-palette-neutral-disabled: var(--salt-color-gray-500-40a);
4
- --salt-palette-neutral-readonly: var(--salt-color-gray-500-10a);
5
- --salt-palette-neutral-strong: var(--salt-color-gray-600);
6
- --salt-palette-neutral-strong-disabled: var(--salt-color-gray-600-40a);
7
- --salt-palette-neutral-stronger: var(--salt-color-gray-700);
8
- --salt-palette-neutral-strongest: var(--salt-color-gray-800);
9
- --salt-palette-neutral-weak: var(--salt-color-gray-400);
10
- --salt-palette-neutral-weak-disabled: var(--salt-color-gray-400-40a);
11
- --salt-palette-neutral-weaker: var(--salt-color-gray-300);
12
- --salt-palette-neutral-weaker-disabled: var(--salt-color-gray-300-40a);
13
- --salt-palette-neutral-weaker-readonly: var(--salt-color-gray-300-10a);
14
- --salt-palette-neutral-weakest: var(--salt-color-gray-200);
15
- --salt-palette-neutral-action-hover: var(--salt-color-gray-600);
16
- --salt-palette-neutral-action-active: var(--salt-color-gray-800);
17
- }
18
- .salt-theme.salt-theme-next[data-mode="dark"] {
19
- --salt-palette-neutral: var(--salt-color-gray-500);
20
- --salt-palette-neutral-disabled: var(--salt-color-gray-500-40a);
21
- --salt-palette-neutral-readonly: var(--salt-color-gray-500-10a);
22
- --salt-palette-neutral-strong: var(--salt-color-gray-400);
23
- --salt-palette-neutral-strong-disabled: var(--salt-color-gray-400-40a);
24
- --salt-palette-neutral-stronger: var(--salt-color-gray-300);
25
- --salt-palette-neutral-strongest: var(--salt-color-gray-200);
26
- --salt-palette-neutral-weak: var(--salt-color-gray-600);
27
- --salt-palette-neutral-weak-disabled: var(--salt-color-gray-600-40a);
28
- --salt-palette-neutral-weaker: var(--salt-color-gray-700);
29
- --salt-palette-neutral-weaker-disabled: var(--salt-color-gray-700-40a);
30
- --salt-palette-neutral-weaker-readonly: var(--salt-color-gray-700-10a);
31
- --salt-palette-neutral-weakest: var(--salt-color-gray-800);
32
- --salt-palette-neutral-action-hover: var(--salt-color-gray-600);
33
- --salt-palette-neutral-action-active: var(--salt-color-gray-800);
34
- }
package/css/palette/neutral.css DELETED
@@ -1,51 +0,0 @@
1
- .salt-theme[data-mode="light"] {
2
- --salt-palette-neutral-primary-background: var(--salt-color-white);
3
- --salt-palette-neutral-primary-background-disabled: var(--salt-color-white-fade-background);
4
- --salt-palette-neutral-primary-background-readonly: var(--salt-color-white-fade-background-readonly);
5
- --salt-palette-neutral-primary-foreground: var(--salt-color-gray-900);
6
- --salt-palette-neutral-primary-foreground-disabled: var(--salt-color-gray-900-fade-foreground);
7
- --salt-palette-neutral-primary-separator: var(--salt-color-black-fade-separatorOpacity-primary);
8
- --salt-palette-neutral-primary-border: var(--salt-color-gray-50);
9
- --salt-palette-neutral-primary-border-disabled: var(--salt-color-gray-50-fade-border);
10
- --salt-palette-neutral-secondary-background: var(--salt-color-gray-20);
11
- --salt-palette-neutral-secondary-background-disabled: var(--salt-color-gray-20-fade-background);
12
- --salt-palette-neutral-secondary-background-readonly: var(--salt-color-gray-20-fade-background-readonly);
13
- --salt-palette-neutral-secondary-border: var(--salt-color-gray-50);
14
- --salt-palette-neutral-secondary-border-disabled: var(--salt-color-gray-50-fade-border);
15
- --salt-palette-neutral-secondary-foreground: var(--salt-color-gray-200);
16
- --salt-palette-neutral-secondary-foreground-disabled: var(--salt-color-gray-200-fade-foreground);
17
- --salt-palette-neutral-backdrop: var(--salt-color-white-fade-backdrop);
18
- --salt-palette-neutral-secondary-separator: var(--salt-color-black-fade-separatorOpacity-secondary);
19
- --salt-palette-neutral-tertiary-separator: var(--salt-color-black-fade-separatorOpacity-tertiary);
20
- --salt-palette-neutral-selection: var(--salt-color-black-fade-background-selection);
21
- --salt-palette-neutral-tertiary-background: var(--salt-color-gray-30);
22
- --salt-palette-neutral-tertiary-background-disabled: var(--salt-color-gray-30-fade-background);
23
- --salt-palette-neutral-tertiary-border: var(--salt-color-gray-50);
24
- --salt-palette-neutral-tertiary-border-disabled: var(--salt-color-gray-50-fade-background);
25
- }
26
-
27
- .salt-theme[data-mode="dark"] {
28
- --salt-palette-neutral-primary-background: var(--salt-color-gray-800);
29
- --salt-palette-neutral-primary-background-disabled: var(--salt-color-gray-800-fade-background);
30
- --salt-palette-neutral-primary-background-readonly: var(--salt-color-gray-800-fade-background-readonly);
31
- --salt-palette-neutral-primary-border: var(--salt-color-gray-300);
32
- --salt-palette-neutral-primary-border-disabled: var(--salt-color-gray-300-fade-border);
33
- --salt-palette-neutral-primary-foreground: var(--salt-color-white);
34
- --salt-palette-neutral-primary-foreground-disabled: var(--salt-color-white-fade-foreground);
35
- --salt-palette-neutral-primary-separator: var(--salt-color-white-fade-separatorOpacity-primary);
36
- --salt-palette-neutral-secondary-background: var(--salt-color-gray-600);
37
- --salt-palette-neutral-secondary-background-disabled: var(--salt-color-gray-600-fade-background);
38
- --salt-palette-neutral-secondary-background-readonly: var(--salt-color-gray-600-fade-background-readonly);
39
- --salt-palette-neutral-secondary-border: var(--salt-color-gray-300);
40
- --salt-palette-neutral-secondary-border-disabled: var(--salt-color-gray-300-fade-border);
41
- --salt-palette-neutral-secondary-foreground: var(--salt-color-gray-70);
42
- --salt-palette-neutral-secondary-foreground-disabled: var(--salt-color-gray-70-fade-foreground);
43
- --salt-palette-neutral-backdrop: var(--salt-color-black-fade-backdrop);
44
- --salt-palette-neutral-secondary-separator: var(--salt-color-white-fade-separatorOpacity-secondary);
45
- --salt-palette-neutral-tertiary-separator: var(--salt-color-white-fade-separatorOpacity-tertiary);
46
- --salt-palette-neutral-selection: var(--salt-color-white-fade-background-selection);
47
- --salt-palette-neutral-tertiary-background: var(--salt-color-gray-500);
48
- --salt-palette-neutral-tertiary-background-disabled: var(--salt-color-gray-500-fade-background);
49
- --salt-palette-neutral-tertiary-border: var(--salt-color-gray-300);
50
- --salt-palette-neutral-tertiary-border-disabled: var(--salt-color-gray-300-fade-background);
51
- }
package/css/palette/opacity.css DELETED
@@ -1,9 +0,0 @@
1
- .salt-theme {
2
- --salt-palette-opacity-backdrop: var(--salt-opacity-70);
3
- --salt-palette-opacity-disabled: var(--salt-opacity-40);
4
- --salt-palette-opacity-background-readonly: var(--salt-opacity-0);
5
- --salt-palette-opacity-border-readonly: var(--salt-opacity-15);
6
- --salt-palette-opacity-primary-border: var(--salt-opacity-45);
7
- --salt-palette-opacity-secondary-border: var(--salt-opacity-25);
8
- --salt-palette-opacity-tertiary-border: var(--salt-opacity-15);
9
- }
package/css/palette/positive-next.css DELETED
@@ -1,10 +0,0 @@
1
- .salt-theme.salt-theme-next[data-mode="light"] {
2
- --salt-palette-positive: var(--salt-color-green-500);
3
- --salt-palette-positive-strong: var(--salt-color-green-600);
4
- --salt-palette-positive-weak: var(--salt-color-green-100);
5
- }
6
- .salt-theme.salt-theme-next[data-mode="dark"] {
7
- --salt-palette-positive: var(--salt-color-green-500);
8
- --salt-palette-positive-strong: var(--salt-color-green-400);
9
- --salt-palette-positive-weak: var(--salt-color-green-900);
10
- }
package/css/palette/positive.css DELETED
@@ -1,7 +0,0 @@
1
- .salt-theme[data-mode="light"] {
2
- --salt-palette-positive-foreground: var(--salt-color-green-700);
3
- }
4
-
5
- .salt-theme[data-mode="dark"] {
6
- --salt-palette-positive-foreground: var(--salt-color-green-300);
7
- }
package/css/palette/success.css DELETED
@@ -1,17 +0,0 @@
1
- .salt-theme[data-mode="light"] {
2
- --salt-palette-success-background: var(--salt-color-green-10);
3
- --salt-palette-success-bold-background: var(--salt-color-green-500);
4
- --salt-palette-success-background-selected: var(--salt-color-green-20);
5
- --salt-palette-success-border: var(--salt-color-green-500);
6
- --salt-palette-success-foreground-decorative: var(--salt-color-green-500);
7
- --salt-palette-success-foreground-informative: var(--salt-color-green-600);
8
- }
9
-
10
- .salt-theme[data-mode="dark"] {
11
- --salt-palette-success-background: var(--salt-color-green-900);
12
- --salt-palette-success-bold-background: var(--salt-color-green-500);
13
- --salt-palette-success-background-selected: var(--salt-color-green-900);
14
- --salt-palette-success-border: var(--salt-color-green-400);
15
- --salt-palette-success-foreground-decorative: var(--salt-color-green-400);
16
- --salt-palette-success-foreground-informative: var(--salt-color-green-200);
17
- }
package/css/palette/text-next.css DELETED
@@ -1,50 +0,0 @@
1
- .salt-theme-next.salt-theme[data-heading-font="Open Sans"] {
2
- --salt-palette-text-fontFamily-heading: var(--salt-typography-fontFamily-openSans);
3
-
4
- --salt-palette-text-display-fontWeight: var(--salt-typography-fontWeight-semiBold);
5
- --salt-palette-text-display-fontWeight-small: var(--salt-typography-fontWeight-regular);
6
- --salt-palette-text-display-fontWeight-strong: var(--salt-typography-fontWeight-bold);
7
-
8
- --salt-palette-text-heading-fontWeight: var(--salt-typography-fontWeight-semiBold);
9
- --salt-palette-text-heading-fontWeight-small: var(--salt-typography-fontWeight-regular);
10
- --salt-palette-text-heading-fontWeight-strong: var(--salt-typography-fontWeight-bold);
11
-
12
- --salt-palette-text-body-fontWeight: var(--salt-typography-fontWeight-regular);
13
- --salt-palette-text-body-fontWeight-small: var(--salt-typography-fontWeight-light);
14
- --salt-palette-text-body-fontWeight-strong: var(--salt-typography-fontWeight-semiBold);
15
-
16
- --salt-palette-text-notation-fontWeight: var(--salt-typography-fontWeight-semiBold);
17
- --salt-palette-text-notation-fontWeight-small: var(--salt-typography-fontWeight-regular);
18
- --salt-palette-text-notation-fontWeight-strong: var(--salt-typography-fontWeight-bold);
19
- }
20
-
21
- .salt-theme-next.salt-theme[data-heading-font="Amplitude"] {
22
- --salt-palette-text-fontFamily-heading: var(--salt-typography-fontFamily-amplitude);
23
-
24
- --salt-palette-text-display-fontWeight: var(--salt-typography-fontWeight-medium);
25
- --salt-palette-text-display-fontWeight-strong: var(--salt-typography-fontWeight-bold);
26
- --salt-palette-text-display-fontWeight-small: var(--salt-typography-fontWeight-regular);
27
-
28
- --salt-palette-text-heading-fontWeight: var(--salt-typography-fontWeight-medium);
29
- --salt-palette-text-heading-fontWeight-small: var(--salt-typography-fontWeight-regular);
30
- --salt-palette-text-heading-fontWeight-strong: var(--salt-typography-fontWeight-bold);
31
-
32
- --salt-palette-text-body-fontWeight: var(--salt-typography-fontWeight-regular);
33
- --salt-palette-text-body-fontWeight-small: var(--salt-typography-fontWeight-light);
34
- --salt-palette-text-body-fontWeight-strong: var(--salt-typography-fontWeight-semiBold);
35
-
36
- --salt-palette-text-notation-fontWeight: var(--salt-typography-fontWeight-semiBold);
37
- --salt-palette-text-notation-fontWeight-small: var(--salt-typography-fontWeight-regular);
38
- --salt-palette-text-notation-fontWeight-strong: var(--salt-typography-fontWeight-bold);
39
- }
40
-
41
- .salt-theme-next.salt-theme[data-action-font="Open Sans"] {
42
- --salt-palette-text-fontFamily-action: var(--salt-typography-fontFamily-openSans);
43
-
44
- --salt-palette-text-action-fontWeight: var(--salt-typography-fontWeight-semiBold);
45
- }
46
- .salt-theme-next.salt-theme[data-action-font="Amplitude"] {
47
- --salt-palette-text-fontFamily-action: var(--salt-typography-fontFamily-amplitude);
48
-
49
- --salt-palette-text-action-fontWeight: var(--salt-typography-fontWeight-medium);
50
- }
package/css/palette/text.css DELETED
@@ -1,24 +0,0 @@
1
- .salt-theme {
2
- --salt-palette-text-fontFamily: var(--salt-typography-fontFamily-openSans);
3
- --salt-palette-text-fontFamily-heading: var(--salt-typography-fontFamily-openSans);
4
- --salt-palette-text-fontFamily-code: var(--salt-typography-fontFamily-ptMono);
5
- --salt-palette-text-fontFamily-action: var(--salt-typography-fontFamily-openSans);
6
-
7
- --salt-palette-text-action-fontWeight: var(--salt-typography-fontWeight-semiBold);
8
-
9
- --salt-palette-text-display-fontWeight: var(--salt-typography-fontWeight-semiBold);
10
- --salt-palette-text-display-fontWeight-small: var(--salt-typography-fontWeight-regular);
11
- --salt-palette-text-display-fontWeight-strong: var(--salt-typography-fontWeight-bold);
12
-
13
- --salt-palette-text-heading-fontWeight: var(--salt-typography-fontWeight-semiBold);
14
- --salt-palette-text-heading-fontWeight-small: var(--salt-typography-fontWeight-regular);
15
- --salt-palette-text-heading-fontWeight-strong: var(--salt-typography-fontWeight-bold);
16
-
17
- --salt-palette-text-body-fontWeight: var(--salt-typography-fontWeight-regular);
18
- --salt-palette-text-body-fontWeight-small: var(--salt-typography-fontWeight-light);
19
- --salt-palette-text-body-fontWeight-strong: var(--salt-typography-fontWeight-semiBold);
20
-
21
- --salt-palette-text-notation-fontWeight: var(--salt-typography-fontWeight-semiBold);
22
- --salt-palette-text-notation-fontWeight-small: var(--salt-typography-fontWeight-regular);
23
- --salt-palette-text-notation-fontWeight-strong: var(--salt-typography-fontWeight-bold);
24
- }
package/css/palette/warning-next.css DELETED
@@ -1,10 +0,0 @@
1
- .salt-theme.salt-theme-next[data-mode="light"] {
2
- --salt-palette-warning: var(--salt-color-orange-500);
3
- --salt-palette-warning-strong: var(--salt-color-orange-600);
4
- --salt-palette-warning-weak: var(--salt-color-orange-100);
5
- }
6
- .salt-theme.salt-theme-next[data-mode="dark"] {
7
- --salt-palette-warning: var(--salt-color-orange-500);
8
- --salt-palette-warning-strong: var(--salt-color-orange-400);
9
- --salt-palette-warning-weak: var(--salt-color-orange-900);
10
- }
package/css/palette/warning.css DELETED
@@ -1,17 +0,0 @@
1
- .salt-theme[data-mode="light"] {
2
- --salt-palette-warning-background: var(--salt-color-orange-10);
3
- --salt-palette-warning-bold-background: var(--salt-color-orange-800);
4
- --salt-palette-warning-background-selected: var(--salt-color-orange-20);
5
- --salt-palette-warning-border: var(--salt-color-orange-700);
6
- --salt-palette-warning-foreground-decorative: var(--salt-color-orange-700);
7
- --salt-palette-warning-foreground-informative: var(--salt-color-orange-850);
8
- }
9
-
10
- .salt-theme[data-mode="dark"] {
11
- --salt-palette-warning-background: var(--salt-color-orange-900);
12
- --salt-palette-warning-bold-background: var(--salt-color-orange-800);
13
- --salt-palette-warning-background-selected: var(--salt-color-orange-900);
14
- --salt-palette-warning-border: var(--salt-color-orange-500);
15
- --salt-palette-warning-foreground-decorative: var(--salt-color-orange-500);
16
- --salt-palette-warning-foreground-informative: var(--salt-color-orange-400);
17
- }