frutjam 0.8.0-beta.4 → 0.8.1-beta.1

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 (15) hide show
  1. package/package.json +1 -1
  2. package/src/components/accordion.css +1 -1
  3. package/src/components/button.css +30 -83
  4. package/src/components/checkbox.css +1 -1
  5. package/src/components/drawer.css +1 -1
  6. package/src/components/dropdown.css +1 -1
  7. package/src/components/input.css +33 -9
  8. package/src/components/modal.css +1 -1
  9. package/src/components/popover.css +1 -1
  10. package/src/theme/{skins → jams}/base.css +3 -3
  11. package/src/theme/jams/darkberry.css +128 -0
  12. package/src/theme/jams/snowberry.css +133 -0
  13. package/src/theme/skins/darkberry.css +0 -119
  14. package/src/theme/skins/snowberry.css +0 -119
  15. /package/src/theme/{skins → jams}/pinkberry.css +0 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "frutjam",
3
- "version": "0.8.0-beta.4",
3
+ "version": "0.8.1-beta.1",
4
4
  "description": "A utility-first CSS framework UI Library",
5
5
  "main": "./dist/frutjam.css",
6
6
  "browser": "dist/frutjam.css",
package/src/components/accordion.css CHANGED
@@ -1,4 +1,4 @@
1
- @import '../theme/skins/base.css';
1
+ @import '../theme/jams/base.css';
2
2
  @utility accordion {
3
3
  @layer components {
4
4
  @apply grid divide-y divide-info-100 border border-info-100 cursor-pointer rounded-md;
package/src/components/button.css CHANGED
@@ -1,4 +1,4 @@
1
- @import "../theme/skins/base.css";
1
+ @import "../theme/jams/base.css";
2
2
  @import "../theme/animation/wiggle.css";
3
3
 
4
4
  @utility btn-size {
@@ -72,44 +72,29 @@
72
72
 
73
73
  @utility btn-link-active {
74
74
  background: transparent;
75
- color: light-dark(
76
- var(--btn-800),
77
- var(--btn-500)
78
- );
75
+ color: light-dark(var(--btn-800), var(--btn-500));
79
76
  text-decoration: underline;
80
77
  text-underline-offset: 4px;
81
78
  cursor: pointer;
82
- }
79
+ }
83
80
 
84
81
  @utility btn-ghost-active {
85
82
  /* for default btn */
86
83
  &:is(.btn) {
87
- background-color: light-dark(
88
- var(--btn-200),
89
- var(--btn-900)
90
- );
91
- color: light-dark(
92
- var(--btn-950),
93
- var(--btn-100)
94
- );
84
+ background-color: light-dark(var(--btn-200), var(--btn-900));
85
+ color: light-dark(var(--btn-950), var(--btn-100));
95
86
  }
96
87
 
97
88
  /* for all btn exclude default btn */
98
89
  &:not(.btn) {
99
- background-color: light-dark(
100
- var(--btn-700),
101
- var(--btn-900)
102
- );
103
- color: light-dark(
104
- var(--btn-50),
105
- var(--btn-100)
106
- );
90
+ background-color: light-dark(var(--btn-700), var(--btn-900));
91
+ color: light-dark(var(--btn-50), var(--btn-100));
107
92
  }
108
93
  }
109
94
 
110
95
  @utility btn-active {
111
- &:is(.btn-link) {
112
- @apply btn-link-active
96
+ &:is(.btn-link) {
97
+ @apply btn-link-active;
113
98
  }
114
99
  &:is(.btn-ghost) {
115
100
  @apply btn-ghost-active;
@@ -119,55 +104,31 @@
119
104
 
120
105
  /* for default btn */
121
106
  &:is(.btn) {
122
- background-color: light-dark(
123
- var(--btn-300),
124
- var(--btn-900)
125
- );
126
- color: light-dark(
127
- var(--btn-950),
128
- var(--btn-100)
129
- );
107
+ background-color: light-dark(var(--btn-300), var(--btn-900));
108
+ color: light-dark(var(--btn-950), var(--btn-100));
130
109
  }
131
110
 
132
111
  /* for all btn exclude default btn */
133
112
  &:not(.btn) {
134
- background-color: light-dark(
135
- var(--btn-700),
136
- var(--btn-800)
137
- );
138
- color: light-dark(
139
- var(--btn-50),
140
- var(--btn-100)
141
- );
113
+ background-color: light-dark(var(--btn-700), var(--btn-800));
114
+ color: light-dark(var(--btn-50), var(--btn-100));
142
115
  }
143
116
  }
144
117
  }
145
118
 
146
119
  @utility btn-dashed {
147
120
  &:not(.btn-active) {
148
- background: transparent;
149
- outline: 1px dashed light-dark(
150
- var(--btn-500),
151
- var(--btn-700)
152
- );
153
- color: light-dark(
154
- var(--btn-700),
155
- var(--btn-500)
156
- );
121
+ background: transparent;
122
+ outline: 1px dashed light-dark(var(--btn-500), var(--btn-700));
123
+ color: light-dark(var(--btn-700), var(--btn-500));
157
124
  }
158
125
  }
159
126
 
160
127
  @utility btn-outline {
161
128
  &:not(.btn-active) {
162
129
  background: transparent;
163
- outline: 1px solid light-dark(
164
- var(--btn-500),
165
- var(--btn-800)
166
- );
167
- color: light-dark(
168
- var(--btn-800),
169
- var(--btn-200)
170
- );
130
+ outline: 1px solid light-dark(var(--btn-500), var(--btn-800));
131
+ color: light-dark(var(--btn-800), var(--btn-200));
171
132
  }
172
133
  }
173
134
 
@@ -175,38 +136,33 @@
175
136
  &:not(.btn-active) {
176
137
  background-color: light-dark(
177
138
  var(--btn-100),
178
- color-mix(in oklab,var(--btn-900)10%,transparent)
179
- );
180
- color: light-dark(
181
- var(--btn-800),
182
- var(--btn-400)
139
+ color-mix(in oklab, var(--btn-900) 10%, transparent)
183
140
  );
141
+ color: light-dark(var(--btn-800), var(--btn-400));
184
142
  }
185
143
  }
186
144
 
187
145
  @utility btn-ghost {
188
146
  &:not(.btn-active) {
189
147
  background: transparent;
190
- color: light-dark(
191
- var(--btn-600),
192
- var(--btn-300)
193
- );
148
+ color: light-dark(var(--btn-600), var(--btn-300));
194
149
  }
195
150
  }
196
151
 
197
152
  @utility btn-link {
198
153
  &:not(.btn-active) {
199
154
  background: transparent;
200
- color: light-dark(
201
- var(--btn-700),
202
- var(--btn-500)
203
- );
155
+ color: light-dark(var(--btn-700), var(--btn-500));
204
156
  }
205
157
  }
206
158
 
207
159
  @utility btn-core {
208
160
  @apply btn-md text-shadow-xs/5 gap-1.5 text-xs leading-normal;
209
- transition: translate 0.2s ease-out, visibility 0.2s allow-discrete, background-color 0.2s ease-out, opacity 0.1s ease-out;
161
+ transition:
162
+ translate 0.2s ease-out,
163
+ visibility 0.2s allow-discrete,
164
+ background-color 0.2s ease-out,
165
+ opacity 0.1s ease-out;
210
166
  position: relative;
211
167
  display: inline-flex;
212
168
  flex-shrink: 0;
@@ -224,22 +180,13 @@
224
180
 
225
181
  /* for default btn */
226
182
  &:is(.btn) {
227
- background-color: light-dark(
228
- var(--btn-200),
229
- var(--btn-800)
230
- );
231
- color: light-dark(
232
- var(--btn-900),
233
- var(--btn-50)
234
- );
183
+ background-color: light-dark(var(--btn-200), var(--btn-800));
184
+ color: light-dark(var(--btn-900), var(--btn-50));
235
185
  }
236
186
 
237
187
  /* for all btn exclude default btn */
238
188
  &:not(.btn) {
239
- background-color: light-dark(
240
- var(--btn-600),
241
- var(--btn-700)
242
- );
189
+ background-color: light-dark(var(--btn-600), var(--btn-700));
243
190
  color: var(--btn-50);
244
191
  }
245
192
 
package/src/components/checkbox.css CHANGED
@@ -1,4 +1,4 @@
1
- @import '../theme/skins/base.css';
1
+ @import '../theme/jams/base.css';
2
2
 
3
3
  @utility checkbox-xs {
4
4
  @layer components {
package/src/components/drawer.css CHANGED
@@ -1,4 +1,4 @@
1
- @import "../theme/skins/base.css";
1
+ @import "../theme/jams/base.css";
2
2
  @utility drawer {
3
3
  @layer components {
4
4
  @apply pointer-events-none invisible fixed inset-0 m-0 grid h-full max-h-none w-full max-w-none place-items-start bg-transparent p-0 text-inherit z-999 overflow-hidden overscroll-contain;
package/src/components/dropdown.css CHANGED
@@ -1,4 +1,4 @@
1
- @import "../theme/skins/base.css";
1
+ @import "../theme/jams/base.css";
2
2
  @import "../theme/placement.css";
3
3
 
4
4
  @utility dropdown {
package/src/components/input.css CHANGED
@@ -1,4 +1,4 @@
1
- @import "../theme/skins/base.css";
1
+ @import "../theme/jams/base.css";
2
2
 
3
3
  @utility input-size {
4
4
  padding-inline: var(--input-inline);
@@ -7,44 +7,44 @@
7
7
  }
8
8
 
9
9
  @utility input-xs {
10
- --input-inline: 0.875rem;
10
+ --input-inline: 0.475rem;
11
11
  --input-block: 0.375rem;
12
12
  --input-text-size: 0.75rem;
13
13
  @apply input-size;
14
14
  }
15
15
 
16
16
  @utility input-sm {
17
- --input-inline: 1rem;
17
+ --input-inline: 0.6rem;
18
18
  --input-block: 0.5rem;
19
19
  --input-text-size: 0.875rem;
20
20
  @apply input-size;
21
21
  }
22
22
 
23
23
  @utility input-md {
24
- --input-inline: 1.125rem;
24
+ --input-inline: 0.75rem;
25
25
  --input-block: 0.625rem;
26
26
  --input-text-size: 1rem;
27
27
  @apply input-size;
28
28
  }
29
29
 
30
30
  @utility input-lg {
31
- --input-inline: 1.25rem;
31
+ --input-inline:0.9rem;
32
32
  --input-block: 0.75rem;
33
33
  --input-text-size: 1rem;
34
34
  @apply input-size;
35
35
  }
36
36
 
37
37
  @utility input-xl {
38
- --input-inline: 1.375rem;
38
+ --input-inline: 1rem;
39
39
  --input-block: 0.875rem;
40
40
  --input-text-size: 1rem;
41
41
  @apply input-size;
42
42
  }
43
43
 
44
44
  @utility input-2xl {
45
- --input-inline: 1.5rem;
45
+ --input-inline: 1.25rem;
46
46
  --input-block: 1rem;
47
- --input-text-size: 1.125rem;
47
+ --input-text-size: 1.025rem;
48
48
  @apply input-size;
49
49
  }
50
50
 
@@ -94,7 +94,31 @@
94
94
  );
95
95
  }
96
96
 
97
- &:is(.input) {
97
+ &::file-selector-button{
98
+ @apply mr-4 inline-flex items-center;
99
+ font-size: clamp(0.75rem, calc(1rem/2), 1.025rem);
100
+ border-radius: calc(var(--radius-input)/2);
101
+ border: 0;
102
+ background: light-dark(
103
+ var(--input-300),
104
+ var(--input-800)
105
+ );
106
+ font-weight: semibold;
107
+ color: light-dark(
108
+ var(--input-800),
109
+ var(--input-400)
110
+ );
111
+ padding-block: calc(var(--input-block)/6);
112
+ padding-inline: calc(var(--input-inline)/2);
113
+ &:hover{
114
+ color: light-dark(
115
+ var(--input-600),
116
+ var(--input-300)
117
+ );
118
+ }
119
+ }
120
+
121
+ &:is(.input) {
98
122
  outline: 1px solid light-dark(
99
123
  var(--input-300),
100
124
  var(--input-800)
package/src/components/modal.css CHANGED
@@ -1,4 +1,4 @@
1
- @import "../theme/skins/base.css";
1
+ @import "../theme/jams/base.css";
2
2
  @import "../theme/placement.css";
3
3
  @import "../theme/animation/slide.css";
4
4
 
package/src/components/popover.css CHANGED
@@ -1,4 +1,4 @@
1
- @import "../theme/skins/base.css";
1
+ @import "../theme/jams/base.css";
2
2
  @utility modal {
3
3
  @layer components {
4
4
  @apply pointer-events-none invisible fixed inset-0 m-0 grid h-full max-h-none w-full max-w-none items-center justify-items-center bg-transparent p-0 text-inherit z-999 overflow-hidden overscroll-contain;
package/src/theme/{skins → jams}/base.css RENAMED
@@ -1,9 +1,9 @@
1
1
  @import "../../base/preflight.css" layer(theme);
2
- @import "./snowberry.css" layer(theme);
3
- @import "./darkberry.css" layer(theme);
2
+ @import "./snowberry.css";
3
+ @import "./darkberry.css";
4
4
 
5
5
  @custom-variant light (&:where([data-theme="light"], [data-theme="light"] *, [data-theme="snowberry"], [data-theme="snowberry"] *));
6
- @custom-variant dark (&:where([data-theme="dark"], [data-theme="dark"] *, [data-theme="darkberry"], [data-theme="darkberry"] *));
6
+ @custom-variant dark (&:where(.dark, .dark *, [data-theme="dark"], [data-theme="dark"] *, [data-theme="darkberry"], [data-theme="darkberry"] *));
7
7
 
8
8
  :root {
9
9
  color-scheme: var(--color-scheme);
package/src/theme/jams/darkberry.css ADDED
@@ -0,0 +1,128 @@
1
+ @utility darkberry{
2
+ --color-scheme: dark;
3
+
4
+ --radius-btn: 0.5rem;
5
+ --radius-input: 0.5rem;
6
+ --radius-checkbox: 0.375rem;
7
+ --radius-modal: 1rem;
8
+
9
+ --core-50: oklch(.985 .001 106.423);
10
+ --core-100: oklch(.97 .001 106.424);
11
+ --core-200: oklch(.923 .003 48.717);
12
+ --core-300: oklch(.869 .005 56.366);
13
+ --core-400: oklch(.709 .01 56.259);
14
+ --core-500: oklch(.553 .013 58.071);
15
+ --core-600: oklch(.444 .011 73.639);
16
+ --core-700: oklch(.374 .01 67.558);
17
+ --core-800: oklch(.268 .007 34.298);
18
+ --core-900: oklch(.216 .006 56.043);
19
+ --core-950: oklch(.147 .004 49.25);
20
+
21
+ --default-50: oklch(0.985 0 0);
22
+ --default-100: oklch(0.967 0.001 286.375);
23
+ --default-200: oklch(0.92 0.004 286.32);
24
+ --default-300: oklch(0.871 0.006 286.286);
25
+ --default-400: oklch(0.705 0.015 286.067);
26
+ --default-500: oklch(0.552 0.016 285.938);
27
+ --default-600: oklch(0.442 0.017 285.786);
28
+ --default-700: oklch(0.37 0.013 285.805);
29
+ --default-800: oklch(0.274 0.006 286.033);
30
+ --default-900: oklch(0.21 0.006 285.885);
31
+ --default-950: oklch(0.141 0.005 285.823);
32
+
33
+ --primary-50: oklch(0.97 0.014 254.604);
34
+ --primary-100: oklch(0.932 0.032 255.585);
35
+ --primary-200: oklch(0.882 0.059 254.128);
36
+ --primary-300: oklch(0.809 0.105 251.813);
37
+ --primary-400: oklch(0.707 0.165 254.624);
38
+ --primary-500: oklch(0.623 0.214 259.815);
39
+ --primary-600: oklch(0.546 0.245 262.881);
40
+ --primary-700: oklch(0.488 0.243 264.376);
41
+ --primary-800: oklch(0.424 0.199 265.638);
42
+ --primary-900: oklch(0.379 0.146 265.522);
43
+ --primary-950: oklch(0.282 0.091 267.935);
44
+
45
+ --secondary-50: oklch(0.969 0.015 12.422);
46
+ --secondary-100: oklch(0.941 0.03 12.58);
47
+ --secondary-200: oklch(0.892 0.058 10.001);
48
+ --secondary-300: oklch(0.81 0.117 11.638);
49
+ --secondary-400: oklch(0.712 0.194 13.428);
50
+ --secondary-500: oklch(0.645 0.246 16.439);
51
+ --secondary-600: oklch(0.586 0.253 17.585);
52
+ --secondary-700: oklch(0.514 0.222 16.935);
53
+ --secondary-800: oklch(0.455 0.188 13.697);
54
+ --secondary-900: oklch(0.41 0.159 10.272);
55
+ --secondary-950: oklch(0.271 0.105 12.094);
56
+
57
+ --accent-50: oklch(0.969 0.016 293.756);
58
+ --accent-100: oklch(0.943 0.029 294.588);
59
+ --accent-200: oklch(0.894 0.057 293.283);
60
+ --accent-300: oklch(0.811 0.111 293.571);
61
+ --accent-400: oklch(0.702 0.183 293.541);
62
+ --accent-500: oklch(0.606 0.25 292.717);
63
+ --accent-600: oklch(0.541 0.281 293.009);
64
+ --accent-700: oklch(0.491 0.27 292.581);
65
+ --accent-800: oklch(0.432 0.232 292.759);
66
+ --accent-900: oklch(0.38 0.189 293.745);
67
+ --accent-950: oklch(0.283 0.141 291.089);
68
+
69
+
70
+ --info-50: oklch(0.979 0.021 166.113);
71
+ --info-100: oklch(0.95 0.052 163.051);
72
+ --info-200: oklch(0.905 0.093 164.15);
73
+ --info-300: oklch(0.845 0.143 164.978);
74
+ --info-400: oklch(0.765 0.177 163.223);
75
+ --info-500: oklch(0.696 0.17 162.48);
76
+ --info-600: oklch(0.596 0.145 163.225);
77
+ --info-700: oklch(0.508 0.118 165.612);
78
+ --info-800: oklch(0.432 0.095 166.913);
79
+ --info-900: oklch(0.378 0.077 168.94);
80
+ --info-950: oklch(0.262 0.051 172.552);
81
+
82
+ --success-50: oklch(0.982 0.018 155.826);
83
+ --success-100: oklch(0.962 0.044 156.743);
84
+ --success-200: oklch(0.925 0.084 155.995);
85
+ --success-300: oklch(0.871 0.15 154.449);
86
+ --success-400: oklch(0.792 0.209 151.711);
87
+ --success-500: oklch(0.723 0.219 149.579);
88
+ --success-600: oklch(0.627 0.194 149.214);
89
+ --success-700: oklch(0.527 0.154 150.069);
90
+ --success-800: oklch(0.448 0.119 151.328);
91
+ --success-900: oklch(0.393 0.095 152.535);
92
+ --success-950: oklch(0.266 0.065 152.934);
93
+
94
+ --warning-50: oklch(0.987 0.026 102.212);
95
+ --warning-100: oklch(0.973 0.071 103.193);
96
+ --warning-200: oklch(0.945 0.129 101.54);
97
+ --warning-300: oklch(0.905 0.182 98.111);
98
+ --warning-400: oklch(0.852 0.199 91.936);
99
+ --warning-500: oklch(0.795 0.184 86.047);
100
+ --warning-600: oklch(0.681 0.162 75.834);
101
+ --warning-700: oklch(0.554 0.135 66.442);
102
+ --warning-800: oklch(0.476 0.114 61.907);
103
+ --warning-900: oklch(0.421 0.095 57.708);
104
+ --warning-950: oklch(0.286 0.066 53.813);
105
+
106
+ --error-50: oklch(0.971 0.013 17.38);
107
+ --error-100: oklch(0.936 0.032 17.717);
108
+ --error-200: oklch(0.885 0.062 18.334);
109
+ --error-300: oklch(0.808 0.114 19.571);
110
+ --error-400: oklch(0.704 0.191 22.216);
111
+ --error-500: oklch(0.637 0.237 25.331);
112
+ --error-600: oklch(0.577 0.245 27.325);
113
+ --error-700: oklch(0.505 0.213 27.518);
114
+ --error-800: oklch(0.444 0.177 26.899);
115
+ --error-900: oklch(0.396 0.141 25.723);
116
+ --error-950: oklch(0.258 0.092 26.042);
117
+ }
118
+
119
+
120
+ @media (prefers-color-scheme: dark) {
121
+ :root:not([data-theme]) {
122
+ @apply darkberry;
123
+ }
124
+ }
125
+
126
+ [data-theme="darkberry"], [data-theme="dark"] {
127
+ @apply darkberry
128
+ }
package/src/theme/jams/snowberry.css ADDED
@@ -0,0 +1,133 @@
1
+ /* @layer theme {
2
+ [data-theme="snowberry"], [data-theme="light"] {
3
+
4
+ }
5
+ } */
6
+
7
+ @utility snowberry {
8
+ --color-scheme: light;
9
+
10
+ --radius-btn: 0.5rem;
11
+ --radius-input: 0.5rem;
12
+ --radius-checkbox: 0.375rem;
13
+ --radius-modal: 1rem;
14
+
15
+ --core-50: oklch(.985 .001 106.423);
16
+ --core-100: oklch(.97 .001 106.424);
17
+ --core-200: oklch(.923 .003 48.717);
18
+ --core-300: oklch(.869 .005 56.366);
19
+ --core-400: oklch(.709 .01 56.259);
20
+ --core-500: oklch(.553 .013 58.071);
21
+ --core-600: oklch(.444 .011 73.639);
22
+ --core-700: oklch(.374 .01 67.558);
23
+ --core-800: oklch(.268 .007 34.298);
24
+ --core-900: oklch(.216 .006 56.043);
25
+ --core-950: oklch(.147 .004 49.25);
26
+
27
+ --default-50: oklch(0.985 0 0);
28
+ --default-100: oklch(0.967 0.001 286.375);
29
+ --default-200: oklch(0.92 0.004 286.32);
30
+ --default-300: oklch(0.871 0.006 286.286);
31
+ --default-400: oklch(0.705 0.015 286.067);
32
+ --default-500: oklch(0.552 0.016 285.938);
33
+ --default-600: oklch(0.442 0.017 285.786);
34
+ --default-700: oklch(0.37 0.013 285.805);
35
+ --default-800: oklch(0.274 0.006 286.033);
36
+ --default-900: oklch(0.21 0.006 285.885);
37
+ --default-950: oklch(0.141 0.005 285.823);
38
+
39
+ --primary-50: oklch(0.97 0.014 254.604);
40
+ --primary-100: oklch(0.932 0.032 255.585);
41
+ --primary-200: oklch(0.882 0.059 254.128);
42
+ --primary-300: oklch(0.809 0.105 251.813);
43
+ --primary-400: oklch(0.707 0.165 254.624);
44
+ --primary-500: oklch(0.623 0.214 259.815);
45
+ --primary-600: oklch(0.546 0.245 262.881);
46
+ --primary-700: oklch(0.488 0.243 264.376);
47
+ --primary-800: oklch(0.424 0.199 265.638);
48
+ --primary-900: oklch(0.379 0.146 265.522);
49
+ --primary-950: oklch(0.282 0.091 267.935);
50
+
51
+ --secondary-50: oklch(0.969 0.015 12.422);
52
+ --secondary-100: oklch(0.941 0.03 12.58);
53
+ --secondary-200: oklch(0.892 0.058 10.001);
54
+ --secondary-300: oklch(0.81 0.117 11.638);
55
+ --secondary-400: oklch(0.712 0.194 13.428);
56
+ --secondary-500: oklch(0.645 0.246 16.439);
57
+ --secondary-600: oklch(0.586 0.253 17.585);
58
+ --secondary-700: oklch(0.514 0.222 16.935);
59
+ --secondary-800: oklch(0.455 0.188 13.697);
60
+ --secondary-900: oklch(0.41 0.159 10.272);
61
+ --secondary-950: oklch(0.271 0.105 12.094);
62
+
63
+ --accent-50: oklch(0.969 0.016 293.756);
64
+ --accent-100: oklch(0.943 0.029 294.588);
65
+ --accent-200: oklch(0.894 0.057 293.283);
66
+ --accent-300: oklch(0.811 0.111 293.571);
67
+ --accent-400: oklch(0.702 0.183 293.541);
68
+ --accent-500: oklch(0.606 0.25 292.717);
69
+ --accent-600: oklch(0.541 0.281 293.009);
70
+ --accent-700: oklch(0.491 0.27 292.581);
71
+ --accent-800: oklch(0.432 0.232 292.759);
72
+ --accent-900: oklch(0.38 0.189 293.745);
73
+ --accent-950: oklch(0.283 0.141 291.089);
74
+
75
+
76
+ --info-50: oklch(0.979 0.021 166.113);
77
+ --info-100: oklch(0.95 0.052 163.051);
78
+ --info-200: oklch(0.905 0.093 164.15);
79
+ --info-300: oklch(0.845 0.143 164.978);
80
+ --info-400: oklch(0.765 0.177 163.223);
81
+ --info-500: oklch(0.696 0.17 162.48);
82
+ --info-600: oklch(0.596 0.145 163.225);
83
+ --info-700: oklch(0.508 0.118 165.612);
84
+ --info-800: oklch(0.432 0.095 166.913);
85
+ --info-900: oklch(0.378 0.077 168.94);
86
+ --info-950: oklch(0.262 0.051 172.552);
87
+
88
+ --success-50: oklch(0.982 0.018 155.826);
89
+ --success-100: oklch(0.962 0.044 156.743);
90
+ --success-200: oklch(0.925 0.084 155.995);
91
+ --success-300: oklch(0.871 0.15 154.449);
92
+ --success-400: oklch(0.792 0.209 151.711);
93
+ --success-500: oklch(0.723 0.219 149.579);
94
+ --success-600: oklch(0.627 0.194 149.214);
95
+ --success-700: oklch(0.527 0.154 150.069);
96
+ --success-800: oklch(0.448 0.119 151.328);
97
+ --success-900: oklch(0.393 0.095 152.535);
98
+ --success-950: oklch(0.266 0.065 152.934);
99
+
100
+ --warning-50: oklch(0.987 0.026 102.212);
101
+ --warning-100: oklch(0.973 0.071 103.193);
102
+ --warning-200: oklch(0.945 0.129 101.54);
103
+ --warning-300: oklch(0.905 0.182 98.111);
104
+ --warning-400: oklch(0.852 0.199 91.936);
105
+ --warning-500: oklch(0.795 0.184 86.047);
106
+ --warning-600: oklch(0.681 0.162 75.834);
107
+ --warning-700: oklch(0.554 0.135 66.442);
108
+ --warning-800: oklch(0.476 0.114 61.907);
109
+ --warning-900: oklch(0.421 0.095 57.708);
110
+ --warning-950: oklch(0.286 0.066 53.813);
111
+
112
+ --error-50: oklch(0.971 0.013 17.38);
113
+ --error-100: oklch(0.936 0.032 17.717);
114
+ --error-200: oklch(0.885 0.062 18.334);
115
+ --error-300: oklch(0.808 0.114 19.571);
116
+ --error-400: oklch(0.704 0.191 22.216);
117
+ --error-500: oklch(0.637 0.237 25.331);
118
+ --error-600: oklch(0.577 0.245 27.325);
119
+ --error-700: oklch(0.505 0.213 27.518);
120
+ --error-800: oklch(0.444 0.177 26.899);
121
+ --error-900: oklch(0.396 0.141 25.723);
122
+ --error-950: oklch(0.258 0.092 26.042);
123
+ }
124
+
125
+ @media (prefers-color-scheme: light) {
126
+ :root:not([data-theme]) {
127
+ @apply snowberry;
128
+ }
129
+ }
130
+
131
+ [data-theme="snowberry"], [data-theme="light"] {
132
+ @apply snowberry
133
+ }
package/src/theme/skins/darkberry.css DELETED
@@ -1,119 +0,0 @@
1
- @layer theme {
2
- [data-theme="darkberry"], [data-theme="dark"] {
3
- --color-scheme: dark;
4
-
5
- --radius-btn: 0.5rem;
6
- --radius-input: 0.5rem;
7
- --radius-checkbox: 0.375rem;
8
- --radius-modal: 1rem;
9
-
10
- --core-50: oklch(.985 .001 106.423);
11
- --core-100: oklch(.97 .001 106.424);
12
- --core-200: oklch(.923 .003 48.717);
13
- --core-300: oklch(.869 .005 56.366);
14
- --core-400: oklch(.709 .01 56.259);
15
- --core-500: oklch(.553 .013 58.071);
16
- --core-600: oklch(.444 .011 73.639);
17
- --core-700: oklch(.374 .01 67.558);
18
- --core-800: oklch(.268 .007 34.298);
19
- --core-900: oklch(.216 .006 56.043);
20
- --core-950: oklch(.147 .004 49.25);
21
-
22
- --default-50: oklch(0.985 0 0);
23
- --default-100: oklch(0.967 0.001 286.375);
24
- --default-200: oklch(0.92 0.004 286.32);
25
- --default-300: oklch(0.871 0.006 286.286);
26
- --default-400: oklch(0.705 0.015 286.067);
27
- --default-500: oklch(0.552 0.016 285.938);
28
- --default-600: oklch(0.442 0.017 285.786);
29
- --default-700: oklch(0.37 0.013 285.805);
30
- --default-800: oklch(0.274 0.006 286.033);
31
- --default-900: oklch(0.21 0.006 285.885);
32
- --default-950: oklch(0.141 0.005 285.823);
33
-
34
- --primary-50: oklch(0.97 0.014 254.604);
35
- --primary-100: oklch(0.932 0.032 255.585);
36
- --primary-200: oklch(0.882 0.059 254.128);
37
- --primary-300: oklch(0.809 0.105 251.813);
38
- --primary-400: oklch(0.707 0.165 254.624);
39
- --primary-500: oklch(0.623 0.214 259.815);
40
- --primary-600: oklch(0.546 0.245 262.881);
41
- --primary-700: oklch(0.488 0.243 264.376);
42
- --primary-800: oklch(0.424 0.199 265.638);
43
- --primary-900: oklch(0.379 0.146 265.522);
44
- --primary-950: oklch(0.282 0.091 267.935);
45
-
46
- --secondary-50: oklch(0.969 0.015 12.422);
47
- --secondary-100: oklch(0.941 0.03 12.58);
48
- --secondary-200: oklch(0.892 0.058 10.001);
49
- --secondary-300: oklch(0.81 0.117 11.638);
50
- --secondary-400: oklch(0.712 0.194 13.428);
51
- --secondary-500: oklch(0.645 0.246 16.439);
52
- --secondary-600: oklch(0.586 0.253 17.585);
53
- --secondary-700: oklch(0.514 0.222 16.935);
54
- --secondary-800: oklch(0.455 0.188 13.697);
55
- --secondary-900: oklch(0.41 0.159 10.272);
56
- --secondary-950: oklch(0.271 0.105 12.094);
57
-
58
- --accent-50: oklch(0.969 0.016 293.756);
59
- --accent-100: oklch(0.943 0.029 294.588);
60
- --accent-200: oklch(0.894 0.057 293.283);
61
- --accent-300: oklch(0.811 0.111 293.571);
62
- --accent-400: oklch(0.702 0.183 293.541);
63
- --accent-500: oklch(0.606 0.25 292.717);
64
- --accent-600: oklch(0.541 0.281 293.009);
65
- --accent-700: oklch(0.491 0.27 292.581);
66
- --accent-800: oklch(0.432 0.232 292.759);
67
- --accent-900: oklch(0.38 0.189 293.745);
68
- --accent-950: oklch(0.283 0.141 291.089);
69
-
70
-
71
- --info-50: oklch(0.979 0.021 166.113);
72
- --info-100: oklch(0.95 0.052 163.051);
73
- --info-200: oklch(0.905 0.093 164.15);
74
- --info-300: oklch(0.845 0.143 164.978);
75
- --info-400: oklch(0.765 0.177 163.223);
76
- --info-500: oklch(0.696 0.17 162.48);
77
- --info-600: oklch(0.596 0.145 163.225);
78
- --info-700: oklch(0.508 0.118 165.612);
79
- --info-800: oklch(0.432 0.095 166.913);
80
- --info-900: oklch(0.378 0.077 168.94);
81
- --info-950: oklch(0.262 0.051 172.552);
82
-
83
- --success-50: oklch(0.982 0.018 155.826);
84
- --success-100: oklch(0.962 0.044 156.743);
85
- --success-200: oklch(0.925 0.084 155.995);
86
- --success-300: oklch(0.871 0.15 154.449);
87
- --success-400: oklch(0.792 0.209 151.711);
88
- --success-500: oklch(0.723 0.219 149.579);
89
- --success-600: oklch(0.627 0.194 149.214);
90
- --success-700: oklch(0.527 0.154 150.069);
91
- --success-800: oklch(0.448 0.119 151.328);
92
- --success-900: oklch(0.393 0.095 152.535);
93
- --success-950: oklch(0.266 0.065 152.934);
94
-
95
- --warning-50: oklch(0.987 0.026 102.212);
96
- --warning-100: oklch(0.973 0.071 103.193);
97
- --warning-200: oklch(0.945 0.129 101.54);
98
- --warning-300: oklch(0.905 0.182 98.111);
99
- --warning-400: oklch(0.852 0.199 91.936);
100
- --warning-500: oklch(0.795 0.184 86.047);
101
- --warning-600: oklch(0.681 0.162 75.834);
102
- --warning-700: oklch(0.554 0.135 66.442);
103
- --warning-800: oklch(0.476 0.114 61.907);
104
- --warning-900: oklch(0.421 0.095 57.708);
105
- --warning-950: oklch(0.286 0.066 53.813);
106
-
107
- --error-50: oklch(0.971 0.013 17.38);
108
- --error-100: oklch(0.936 0.032 17.717);
109
- --error-200: oklch(0.885 0.062 18.334);
110
- --error-300: oklch(0.808 0.114 19.571);
111
- --error-400: oklch(0.704 0.191 22.216);
112
- --error-500: oklch(0.637 0.237 25.331);
113
- --error-600: oklch(0.577 0.245 27.325);
114
- --error-700: oklch(0.505 0.213 27.518);
115
- --error-800: oklch(0.444 0.177 26.899);
116
- --error-900: oklch(0.396 0.141 25.723);
117
- --error-950: oklch(0.258 0.092 26.042);
118
- }
119
- }
package/src/theme/skins/snowberry.css DELETED
@@ -1,119 +0,0 @@
1
- @layer theme {
2
- :root, [data-theme="snowberry"], [data-theme="light"] {
3
- --color-scheme: light;
4
-
5
- --radius-btn: 0.5rem;
6
- --radius-input: 0.5rem;
7
- --radius-checkbox: 0.375rem;
8
- --radius-modal: 1rem;
9
-
10
- --core-50: oklch(.985 .001 106.423);
11
- --core-100: oklch(.97 .001 106.424);
12
- --core-200: oklch(.923 .003 48.717);
13
- --core-300: oklch(.869 .005 56.366);
14
- --core-400: oklch(.709 .01 56.259);
15
- --core-500: oklch(.553 .013 58.071);
16
- --core-600: oklch(.444 .011 73.639);
17
- --core-700: oklch(.374 .01 67.558);
18
- --core-800: oklch(.268 .007 34.298);
19
- --core-900: oklch(.216 .006 56.043);
20
- --core-950: oklch(.147 .004 49.25);
21
-
22
- --default-50: oklch(0.985 0 0);
23
- --default-100: oklch(0.967 0.001 286.375);
24
- --default-200: oklch(0.92 0.004 286.32);
25
- --default-300: oklch(0.871 0.006 286.286);
26
- --default-400: oklch(0.705 0.015 286.067);
27
- --default-500: oklch(0.552 0.016 285.938);
28
- --default-600: oklch(0.442 0.017 285.786);
29
- --default-700: oklch(0.37 0.013 285.805);
30
- --default-800: oklch(0.274 0.006 286.033);
31
- --default-900: oklch(0.21 0.006 285.885);
32
- --default-950: oklch(0.141 0.005 285.823);
33
-
34
- --primary-50: oklch(0.97 0.014 254.604);
35
- --primary-100: oklch(0.932 0.032 255.585);
36
- --primary-200: oklch(0.882 0.059 254.128);
37
- --primary-300: oklch(0.809 0.105 251.813);
38
- --primary-400: oklch(0.707 0.165 254.624);
39
- --primary-500: oklch(0.623 0.214 259.815);
40
- --primary-600: oklch(0.546 0.245 262.881);
41
- --primary-700: oklch(0.488 0.243 264.376);
42
- --primary-800: oklch(0.424 0.199 265.638);
43
- --primary-900: oklch(0.379 0.146 265.522);
44
- --primary-950: oklch(0.282 0.091 267.935);
45
-
46
- --secondary-50: oklch(0.969 0.015 12.422);
47
- --secondary-100: oklch(0.941 0.03 12.58);
48
- --secondary-200: oklch(0.892 0.058 10.001);
49
- --secondary-300: oklch(0.81 0.117 11.638);
50
- --secondary-400: oklch(0.712 0.194 13.428);
51
- --secondary-500: oklch(0.645 0.246 16.439);
52
- --secondary-600: oklch(0.586 0.253 17.585);
53
- --secondary-700: oklch(0.514 0.222 16.935);
54
- --secondary-800: oklch(0.455 0.188 13.697);
55
- --secondary-900: oklch(0.41 0.159 10.272);
56
- --secondary-950: oklch(0.271 0.105 12.094);
57
-
58
- --accent-50: oklch(0.969 0.016 293.756);
59
- --accent-100: oklch(0.943 0.029 294.588);
60
- --accent-200: oklch(0.894 0.057 293.283);
61
- --accent-300: oklch(0.811 0.111 293.571);
62
- --accent-400: oklch(0.702 0.183 293.541);
63
- --accent-500: oklch(0.606 0.25 292.717);
64
- --accent-600: oklch(0.541 0.281 293.009);
65
- --accent-700: oklch(0.491 0.27 292.581);
66
- --accent-800: oklch(0.432 0.232 292.759);
67
- --accent-900: oklch(0.38 0.189 293.745);
68
- --accent-950: oklch(0.283 0.141 291.089);
69
-
70
-
71
- --info-50: oklch(0.979 0.021 166.113);
72
- --info-100: oklch(0.95 0.052 163.051);
73
- --info-200: oklch(0.905 0.093 164.15);
74
- --info-300: oklch(0.845 0.143 164.978);
75
- --info-400: oklch(0.765 0.177 163.223);
76
- --info-500: oklch(0.696 0.17 162.48);
77
- --info-600: oklch(0.596 0.145 163.225);
78
- --info-700: oklch(0.508 0.118 165.612);
79
- --info-800: oklch(0.432 0.095 166.913);
80
- --info-900: oklch(0.378 0.077 168.94);
81
- --info-950: oklch(0.262 0.051 172.552);
82
-
83
- --success-50: oklch(0.982 0.018 155.826);
84
- --success-100: oklch(0.962 0.044 156.743);
85
- --success-200: oklch(0.925 0.084 155.995);
86
- --success-300: oklch(0.871 0.15 154.449);
87
- --success-400: oklch(0.792 0.209 151.711);
88
- --success-500: oklch(0.723 0.219 149.579);
89
- --success-600: oklch(0.627 0.194 149.214);
90
- --success-700: oklch(0.527 0.154 150.069);
91
- --success-800: oklch(0.448 0.119 151.328);
92
- --success-900: oklch(0.393 0.095 152.535);
93
- --success-950: oklch(0.266 0.065 152.934);
94
-
95
- --warning-50: oklch(0.987 0.026 102.212);
96
- --warning-100: oklch(0.973 0.071 103.193);
97
- --warning-200: oklch(0.945 0.129 101.54);
98
- --warning-300: oklch(0.905 0.182 98.111);
99
- --warning-400: oklch(0.852 0.199 91.936);
100
- --warning-500: oklch(0.795 0.184 86.047);
101
- --warning-600: oklch(0.681 0.162 75.834);
102
- --warning-700: oklch(0.554 0.135 66.442);
103
- --warning-800: oklch(0.476 0.114 61.907);
104
- --warning-900: oklch(0.421 0.095 57.708);
105
- --warning-950: oklch(0.286 0.066 53.813);
106
-
107
- --error-50: oklch(0.971 0.013 17.38);
108
- --error-100: oklch(0.936 0.032 17.717);
109
- --error-200: oklch(0.885 0.062 18.334);
110
- --error-300: oklch(0.808 0.114 19.571);
111
- --error-400: oklch(0.704 0.191 22.216);
112
- --error-500: oklch(0.637 0.237 25.331);
113
- --error-600: oklch(0.577 0.245 27.325);
114
- --error-700: oklch(0.505 0.213 27.518);
115
- --error-800: oklch(0.444 0.177 26.899);
116
- --error-900: oklch(0.396 0.141 25.723);
117
- --error-950: oklch(0.258 0.092 26.042);
118
- }
119
- }
/package/src/theme/{skins → jams}/pinkberry.css RENAMED
File without changes