@nightshadeui/stylesheets 2.5.2 → 2.6.0

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/index.css CHANGED
@@ -2,16 +2,9 @@
2
2
  @import './variables/spacing.css' layer(nightshade);
3
3
  @import './variables/grid.css' layer(nightshade);
4
4
  @import './variables/font.css' layer(nightshade);
5
- @import './variables/palette.css' layer(nightshade);
6
5
  @import './variables/ui.css' layer(nightshade);
6
+ @import './variables/colors.css' layer(nightshade);
7
7
 
8
8
  @import './commons.css' layer(nightshade);
9
9
  @import './util.css' layer(nightshade);
10
- @import './kbd.css' layer(nightshade);
11
10
 
12
- @import './transitions/fade-directional.css' layer(nightshade);
13
- @import './transitions/fade-scale.css' layer(nightshade);
14
- @import './transitions/fade-shove.css' layer(nightshade);
15
- @import './transitions/fade-squash.css' layer(nightshade);
16
- @import './transitions/fade-swipe.css' layer(nightshade);
17
- @import './transitions/fade.css' layer(nightshade);
@@ -0,0 +1 @@
1
+ @import './palette.css' layer(nightshade);
@@ -11,7 +11,7 @@
11
11
  --l-700: 0.48;
12
12
  --l-800: 0.42;
13
13
  --l-900: 0.36;
14
- --l-1000: 0.32;
14
+ --l-950: 0.32;
15
15
 
16
16
  --c-0: 0.01;
17
17
  --c-50: 0.02;
@@ -24,7 +24,7 @@
24
24
  --c-700: 0.06;
25
25
  --c-800: 0.03;
26
26
  --c-900: 0.02;
27
- --c-1000: 0.01;
27
+ --c-950: 0.01;
28
28
 
29
29
  --color-base-text: var(--color-base-900);
30
30
  --color-base-hue: 340deg;
@@ -66,32 +66,6 @@
66
66
  --color-danger-int: 1.5;
67
67
  --color-danger-lum: .9;
68
68
 
69
- --color-base-0: light-dark(var(--color-base-light-0), var(--color-base-dark-0));
70
- --color-base-50: light-dark(var(--color-base-light-50), var(--color-base-dark-50));
71
- --color-base-100: light-dark(var(--color-base-light-100), var(--color-base-dark-100));
72
- --color-base-200: light-dark(var(--color-base-light-200), var(--color-base-dark-200));
73
- --color-base-300: light-dark(var(--color-base-light-300), var(--color-base-dark-300));
74
- --color-base-400: light-dark(var(--color-base-light-400), var(--color-base-dark-400));
75
- --color-base-500: light-dark(var(--color-base-light-500), var(--color-base-dark-500));
76
- --color-base-600: light-dark(var(--color-base-light-600), var(--color-base-dark-600));
77
- --color-base-700: light-dark(var(--color-base-light-700), var(--color-base-dark-700));
78
- --color-base-800: light-dark(var(--color-base-light-800), var(--color-base-dark-800));
79
- --color-base-900: light-dark(var(--color-base-light-900), var(--color-base-dark-900));
80
- --color-base-1000: light-dark(var(--color-base-light-1000), var(--color-base-dark-1000));
81
-
82
- --color-inverse-0: light-dark(var(--color-base-dark-0), var(--color-base-light-0));
83
- --color-inverse-50: light-dark(var(--color-base-dark-50), var(--color-base-light-50));
84
- --color-inverse-100: light-dark(var(--color-base-dark-100), var(--color-base-light-100));
85
- --color-inverse-200: light-dark(var(--color-base-dark-200), var(--color-base-light-200));
86
- --color-inverse-300: light-dark(var(--color-base-dark-300), var(--color-base-light-300));
87
- --color-inverse-400: light-dark(var(--color-base-dark-400), var(--color-base-light-400));
88
- --color-inverse-500: light-dark(var(--color-base-dark-500), var(--color-base-light-500));
89
- --color-inverse-600: light-dark(var(--color-base-dark-600), var(--color-base-light-600));
90
- --color-inverse-700: light-dark(var(--color-base-dark-700), var(--color-base-light-700));
91
- --color-inverse-800: light-dark(var(--color-base-dark-800), var(--color-base-light-800));
92
- --color-inverse-900: light-dark(var(--color-base-dark-900), var(--color-base-light-900));
93
- --color-inverse-1000: light-dark(var(--color-base-dark-1000), var(--color-base-light-1000));
94
-
95
69
  --color-base-light-0: oklch(calc(var(--l-0) * var(--color-base-lum)) calc(var(--c-0) * var(--color-base-int)) var(--color-base-hue));
96
70
  --color-base-light-50: oklch(calc(var(--l-50) * var(--color-base-lum)) calc(var(--c-50) * var(--color-base-int)) var(--color-base-hue));
97
71
  --color-base-light-100: oklch(calc(var(--l-100) * var(--color-base-lum)) calc(var(--c-100) * var(--color-base-int)) var(--color-base-hue));
@@ -103,9 +77,9 @@
103
77
  --color-base-light-700: oklch(calc(var(--l-700) * var(--color-base-lum)) calc(var(--c-700) * var(--color-base-int)) var(--color-base-hue));
104
78
  --color-base-light-800: oklch(calc(var(--l-800) * var(--color-base-lum)) calc(var(--c-800) * var(--color-base-int)) var(--color-base-hue));
105
79
  --color-base-light-900: oklch(calc(var(--l-900) * var(--color-base-lum)) calc(var(--c-900) * var(--color-base-int)) var(--color-base-hue));
106
- --color-base-light-1000: oklch(calc(var(--l-1000) * var(--color-base-lum)) calc(var(--c-1000) * var(--color-base-int)) var(--color-base-hue));
80
+ --color-base-light-950: oklch(calc(var(--l-950) * var(--color-base-lum)) calc(var(--c-950) * var(--color-base-int)) var(--color-base-hue));
107
81
 
108
- --color-base-dark-0: oklch(calc(var(--l-1000) * var(--color-inverse-lum)) calc(var(--c-1000) * var(--color-inverse-int)) var(--color-inverse-hue));
82
+ --color-base-dark-0: oklch(calc(var(--l-950) * var(--color-inverse-lum)) calc(var(--c-950) * var(--color-inverse-int)) var(--color-inverse-hue));
109
83
  --color-base-dark-50: oklch(calc(var(--l-900) * var(--color-inverse-lum)) calc(var(--c-900) * var(--color-inverse-int)) var(--color-inverse-hue));
110
84
  --color-base-dark-100: oklch(calc(var(--l-800) * var(--color-inverse-lum)) calc(var(--c-800) * var(--color-inverse-int)) var(--color-inverse-hue));
111
85
  --color-base-dark-200: oklch(calc(var(--l-700) * var(--color-inverse-lum)) calc(var(--c-700) * var(--color-inverse-int)) var(--color-inverse-hue));
@@ -116,7 +90,7 @@
116
90
  --color-base-dark-700: oklch(calc(var(--l-200) * var(--color-inverse-lum)) calc(var(--c-200) * var(--color-inverse-int)) var(--color-inverse-hue));
117
91
  --color-base-dark-800: oklch(calc(var(--l-100) * var(--color-inverse-lum)) calc(var(--c-100) * var(--color-inverse-int)) var(--color-inverse-hue));
118
92
  --color-base-dark-900: oklch(calc(var(--l-50) * var(--color-inverse-lum)) calc(var(--c-50) * var(--color-inverse-int)) var(--color-inverse-hue));
119
- --color-base-dark-1000: oklch(calc(var(--l-0) * var(--color-inverse-lum)) calc(var(--c-0) * var(--color-inverse-int)) var(--color-inverse-hue));
93
+ --color-base-dark-950: oklch(calc(var(--l-0) * var(--color-inverse-lum)) calc(var(--c-0) * var(--color-inverse-int)) var(--color-inverse-hue));
120
94
 
121
95
  --color-primary-0: oklch(calc(var(--l-0) * var(--color-primary-lum)) calc(var(--c-0) * var(--color-primary-int)) var(--color-primary-hue));
122
96
  --color-primary-50: oklch(calc(var(--l-50) * var(--color-primary-lum)) calc(var(--c-50) * var(--color-primary-int)) var(--color-primary-hue));
@@ -129,7 +103,7 @@
129
103
  --color-primary-700: oklch(calc(var(--l-700) * var(--color-primary-lum)) calc(var(--c-700) * var(--color-primary-int)) var(--color-primary-hue));
130
104
  --color-primary-800: oklch(calc(var(--l-800) * var(--color-primary-lum)) calc(var(--c-800) * var(--color-primary-int)) var(--color-primary-hue));
131
105
  --color-primary-900: oklch(calc(var(--l-900) * var(--color-primary-lum)) calc(var(--c-900) * var(--color-primary-int)) var(--color-primary-hue));
132
- --color-primary-1000: oklch(calc(var(--l-1000) * var(--color-primary-lum)) calc(var(--c-1000) * var(--color-primary-int)) var(--color-primary-hue));
106
+ --color-primary-950: oklch(calc(var(--l-950) * var(--color-primary-lum)) calc(var(--c-950) * var(--color-primary-int)) var(--color-primary-hue));
133
107
 
134
108
  --color-secondary-0: oklch(calc(var(--l-0) * var(--color-secondary-lum)) calc(var(--c-0) * var(--color-secondary-int)) var(--color-secondary-hue));
135
109
  --color-secondary-50: oklch(calc(var(--l-50) * var(--color-secondary-lum)) calc(var(--c-50) * var(--color-secondary-int)) var(--color-secondary-hue));
@@ -142,7 +116,7 @@
142
116
  --color-secondary-700: oklch(calc(var(--l-700) * var(--color-secondary-lum)) calc(var(--c-700) * var(--color-secondary-int)) var(--color-secondary-hue));
143
117
  --color-secondary-800: oklch(calc(var(--l-800) * var(--color-secondary-lum)) calc(var(--c-800) * var(--color-secondary-int)) var(--color-secondary-hue));
144
118
  --color-secondary-900: oklch(calc(var(--l-900) * var(--color-secondary-lum)) calc(var(--c-900) * var(--color-secondary-int)) var(--color-secondary-hue));
145
- --color-secondary-1000: oklch(calc(var(--l-1000) * var(--color-secondary-lum)) calc(var(--c-1000) * var(--color-secondary-int)) var(--color-secondary-hue));
119
+ --color-secondary-950: oklch(calc(var(--l-950) * var(--color-secondary-lum)) calc(var(--c-950) * var(--color-secondary-int)) var(--color-secondary-hue));
146
120
 
147
121
  --color-tertiary-0: oklch(calc(var(--l-0) * var(--color-tertiary-lum)) calc(var(--c-0) * var(--color-tertiary-int)) var(--color-tertiary-hue));
148
122
  --color-tertiary-50: oklch(calc(var(--l-50) * var(--color-tertiary-lum)) calc(var(--c-50) * var(--color-tertiary-int)) var(--color-tertiary-hue));
@@ -155,7 +129,7 @@
155
129
  --color-tertiary-700: oklch(calc(var(--l-700) * var(--color-tertiary-lum)) calc(var(--c-700) * var(--color-tertiary-int)) var(--color-tertiary-hue));
156
130
  --color-tertiary-800: oklch(calc(var(--l-800) * var(--color-tertiary-lum)) calc(var(--c-800) * var(--color-tertiary-int)) var(--color-tertiary-hue));
157
131
  --color-tertiary-900: oklch(calc(var(--l-900) * var(--color-tertiary-lum)) calc(var(--c-900) * var(--color-tertiary-int)) var(--color-tertiary-hue));
158
- --color-tertiary-1000: oklch(calc(var(--l-1000) * var(--color-tertiary-lum)) calc(var(--c-1000) * var(--color-tertiary-int)) var(--color-tertiary-hue));
132
+ --color-tertiary-950: oklch(calc(var(--l-950) * var(--color-tertiary-lum)) calc(var(--c-950) * var(--color-tertiary-int)) var(--color-tertiary-hue));
159
133
 
160
134
  --color-success-0: oklch(calc(var(--l-0) * var(--color-success-lum)) calc(var(--c-0) * var(--color-success-int)) var(--color-success-hue));
161
135
  --color-success-50: oklch(calc(var(--l-50) * var(--color-success-lum)) calc(var(--c-50) * var(--color-success-int)) var(--color-success-hue));
@@ -168,7 +142,7 @@
168
142
  --color-success-700: oklch(calc(var(--l-700) * var(--color-success-lum)) calc(var(--c-700) * var(--color-success-int)) var(--color-success-hue));
169
143
  --color-success-800: oklch(calc(var(--l-800) * var(--color-success-lum)) calc(var(--c-800) * var(--color-success-int)) var(--color-success-hue));
170
144
  --color-success-900: oklch(calc(var(--l-900) * var(--color-success-lum)) calc(var(--c-900) * var(--color-success-int)) var(--color-success-hue));
171
- --color-success-1000: oklch(calc(var(--l-1000) * var(--color-success-lum)) calc(var(--c-1000) * var(--color-success-int)) var(--color-success-hue));
145
+ --color-success-950: oklch(calc(var(--l-950) * var(--color-success-lum)) calc(var(--c-950) * var(--color-success-int)) var(--color-success-hue));
172
146
 
173
147
  --color-warning-0: oklch(calc(var(--l-0) * var(--color-warning-lum)) calc(var(--c-0) * var(--color-warning-int)) var(--color-warning-hue));
174
148
  --color-warning-50: oklch(calc(var(--l-50) * var(--color-warning-lum)) calc(var(--c-50) * var(--color-warning-int)) var(--color-warning-hue));
@@ -181,7 +155,7 @@
181
155
  --color-warning-700: oklch(calc(var(--l-700) * var(--color-warning-lum)) calc(var(--c-700) * var(--color-warning-int)) var(--color-warning-hue));
182
156
  --color-warning-800: oklch(calc(var(--l-800) * var(--color-warning-lum)) calc(var(--c-800) * var(--color-warning-int)) var(--color-warning-hue));
183
157
  --color-warning-900: oklch(calc(var(--l-900) * var(--color-warning-lum)) calc(var(--c-900) * var(--color-warning-int)) var(--color-warning-hue));
184
- --color-warning-1000: oklch(calc(var(--l-1000) * var(--color-warning-lum)) calc(var(--c-1000) * var(--color-warning-int)) var(--color-warning-hue));
158
+ --color-warning-950: oklch(calc(var(--l-950) * var(--color-warning-lum)) calc(var(--c-950) * var(--color-warning-int)) var(--color-warning-hue));
185
159
 
186
160
  --color-danger-0: oklch(calc(var(--l-0) * var(--color-danger-lum)) calc(var(--c-0) * var(--color-danger-int)) var(--color-danger-hue));
187
161
  --color-danger-50: oklch(calc(var(--l-50) * var(--color-danger-lum)) calc(var(--c-50) * var(--color-danger-int)) var(--color-danger-hue));
@@ -194,5 +168,5 @@
194
168
  --color-danger-700: oklch(calc(var(--l-700) * var(--color-danger-lum)) calc(var(--c-700) * var(--color-danger-int)) var(--color-danger-hue));
195
169
  --color-danger-800: oklch(calc(var(--l-800) * var(--color-danger-lum)) calc(var(--c-800) * var(--color-danger-int)) var(--color-danger-hue));
196
170
  --color-danger-900: oklch(calc(var(--l-900) * var(--color-danger-lum)) calc(var(--c-900) * var(--color-danger-int)) var(--color-danger-hue));
197
- --color-danger-1000: oklch(calc(var(--l-1000) * var(--color-danger-lum)) calc(var(--c-1000) * var(--color-danger-int)) var(--color-danger-hue));
171
+ --color-danger-950: oklch(calc(var(--l-950) * var(--color-danger-lum)) calc(var(--c-950) * var(--color-danger-int)) var(--color-danger-hue));
198
172
  }
@@ -0,0 +1 @@
1
+ @import './kbd.css' layer(nightshade);
@@ -0,0 +1,6 @@
1
+ @import './fade-directional.css' layer(nightshade);
2
+ @import './fade-scale.css' layer(nightshade);
3
+ @import './fade-shove.css' layer(nightshade);
4
+ @import './fade-squash.css' layer(nightshade);
5
+ @import './fade-swipe.css' layer(nightshade);
6
+ @import './fade.css' layer(nightshade);
package/package.json CHANGED
@@ -1,11 +1,14 @@
1
1
  {
2
2
  "name": "@nightshadeui/stylesheets",
3
- "version": "2.5.2",
3
+ "version": "2.6.0",
4
4
  "description": "Nightshade UI CSS",
5
5
  "author": "Boris Okunskiy",
6
6
  "license": "ISC",
7
7
  "sideEffects": false,
8
8
  "exports": {
9
- ".": "./index.css"
9
+ ".": "./index.css",
10
+ "./dynamic-palette": "./modules/dynamic-palette/index.css",
11
+ "./kbd": "./modules/kbd/index.css",
12
+ "./transitions": "./modules/transitions/index.css"
10
13
  }
11
14
  }
@@ -0,0 +1,29 @@
1
+ :root {
2
+
3
+ --color-base-0: light-dark(var(--color-base-light-0), var(--color-base-dark-0));
4
+ --color-base-50: light-dark(var(--color-base-light-50), var(--color-base-dark-50));
5
+ --color-base-100: light-dark(var(--color-base-light-100), var(--color-base-dark-100));
6
+ --color-base-200: light-dark(var(--color-base-light-200), var(--color-base-dark-200));
7
+ --color-base-300: light-dark(var(--color-base-light-300), var(--color-base-dark-300));
8
+ --color-base-400: light-dark(var(--color-base-light-400), var(--color-base-dark-400));
9
+ --color-base-500: light-dark(var(--color-base-light-500), var(--color-base-dark-500));
10
+ --color-base-600: light-dark(var(--color-base-light-600), var(--color-base-dark-600));
11
+ --color-base-700: light-dark(var(--color-base-light-700), var(--color-base-dark-700));
12
+ --color-base-800: light-dark(var(--color-base-light-800), var(--color-base-dark-800));
13
+ --color-base-900: light-dark(var(--color-base-light-900), var(--color-base-dark-900));
14
+ --color-base-950: light-dark(var(--color-base-light-950), var(--color-base-dark-950));
15
+
16
+ --color-inverse-0: light-dark(var(--color-base-dark-0), var(--color-base-light-0));
17
+ --color-inverse-50: light-dark(var(--color-base-dark-50), var(--color-base-light-50));
18
+ --color-inverse-100: light-dark(var(--color-base-dark-100), var(--color-base-light-100));
19
+ --color-inverse-200: light-dark(var(--color-base-dark-200), var(--color-base-light-200));
20
+ --color-inverse-300: light-dark(var(--color-base-dark-300), var(--color-base-light-300));
21
+ --color-inverse-400: light-dark(var(--color-base-dark-400), var(--color-base-light-400));
22
+ --color-inverse-500: light-dark(var(--color-base-dark-500), var(--color-base-light-500));
23
+ --color-inverse-600: light-dark(var(--color-base-dark-600), var(--color-base-light-600));
24
+ --color-inverse-700: light-dark(var(--color-base-dark-700), var(--color-base-light-700));
25
+ --color-inverse-800: light-dark(var(--color-base-dark-800), var(--color-base-light-800));
26
+ --color-inverse-900: light-dark(var(--color-base-dark-900), var(--color-base-light-900));
27
+ --color-inverse-950: light-dark(var(--color-base-dark-950), var(--color-base-light-950));
28
+
29
+ }
File without changes
File without changes