@kruzer/styles 3.0.0-alpha.24 → 3.0.0-alpha.26

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 (14) hide show
  1. package/README.md +28 -28
  2. package/dist/assets/fonts/DMSans-Bold.ttf +0 -0
  3. package/dist/assets/fonts/DMSans-Italic.ttf +0 -0
  4. package/dist/assets/fonts/DMSans-Light.ttf +0 -0
  5. package/dist/assets/fonts/DMSans-Medium.ttf +0 -0
  6. package/dist/assets/fonts/DMSans-Regular.ttf +0 -0
  7. package/dist/assets/fonts/Inter-Bold.ttf +0 -0
  8. package/dist/assets/fonts/Inter-Italic.ttf +0 -0
  9. package/dist/assets/fonts/Inter-Light.ttf +0 -0
  10. package/dist/assets/fonts/Inter-Medium.ttf +0 -0
  11. package/dist/assets/fonts/Inter-Regular.ttf +0 -0
  12. package/dist/kruzer-tailwind-preset.cjs +373 -351
  13. package/dist/styles.min.scss +1 -1
  14. package/package.json +35 -33
package/README.md CHANGED
@@ -1,29 +1,29 @@
1
- # README #
2
-
3
- This README would normally document whatever steps are necessary to get your application up and running.
4
-
5
- ### What is this repository for? ###
6
-
7
- * Quick summary
8
- * Version
9
- * [Learn Markdown](https://bitbucket.org/tutorials/markdowndemo)
10
-
11
- ### How do I get set up? ###
12
-
13
- * Summary of set up
14
- * Configuration
15
- * Dependencies
16
- * Database configuration
17
- * How to run tests
18
- * Deployment instructions
19
-
20
- ### Contribution guidelines ###
21
-
22
- * Writing tests
23
- * Code review
24
- * Other guidelines
25
-
26
- ### Who do I talk to? ###
27
-
28
- * Repo owner or admin
1
+ # README #
2
+
3
+ This README would normally document whatever steps are necessary to get your application up and running.
4
+
5
+ ### What is this repository for? ###
6
+
7
+ * Quick summary
8
+ * Version
9
+ * [Learn Markdown](https://bitbucket.org/tutorials/markdowndemo)
10
+
11
+ ### How do I get set up? ###
12
+
13
+ * Summary of set up
14
+ * Configuration
15
+ * Dependencies
16
+ * Database configuration
17
+ * How to run tests
18
+ * Deployment instructions
19
+
20
+ ### Contribution guidelines ###
21
+
22
+ * Writing tests
23
+ * Code review
24
+ * Other guidelines
25
+
26
+ ### Who do I talk to? ###
27
+
28
+ * Repo owner or admin
29
29
  * Other community or team contact
package/dist/assets/fonts/Inter-Bold.ttf ADDED
Binary file
package/dist/kruzer-tailwind-preset.cjs CHANGED
@@ -1,351 +1,373 @@
1
- module.exports = {
2
- theme: {
3
- extend: {
4
- keyframes: {
5
- slideDownAndFade: {
6
- from: { opacity: "0", transform: "translateY(-2px)" },
7
- to: { opacity: "1", transform: "translateY(0)" },
8
- },
9
- slideLeftAndFade: {
10
- from: { opacity: "0", transform: "translateX(2px)" },
11
- to: { opacity: "1", transform: "translateX(0)" },
12
- },
13
- slideUpAndFade: {
14
- from: { opacity: "0", transform: "translateY(2px)" },
15
- to: { opacity: "1", transform: "translateY(0)" },
16
- },
17
- slideRightAndFade: {
18
- from: { opacity: "0", transform: "translateX(-2px)" },
19
- to: { opacity: "1", transform: "translateX(0)" },
20
- },
21
- },
22
- animation: {
23
- slideDownAndFade:
24
- "slideDownAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
25
- slideLeftAndFade:
26
- "slideLeftAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
27
- slideUpAndFade: "slideUpAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
28
- slideRightAndFade:
29
- "slideRightAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
30
- },
31
- gridTemplateColumns: {
32
- xs: "repeat(auto-fill,minmax(12.5rem,1fr))",
33
- sm: "repeat(auto-fill,minmax(22rem,1fr))",
34
- md: "repeat(auto-fill,minmax(30rem,1fr))",
35
- lg: "repeat(auto-fill,minmax(37.5rem,1fr))",
36
- },
37
- gridColumn: {
38
- "span-full": "1 / -1",
39
- },
40
- screens: {
41
- "2md": "930px",
42
- },
43
- lineHeight: {
44
- 120: "120%",
45
- 140: "140%",
46
- },
47
- aria: {
48
- invalid: 'invalid="true"',
49
- },
50
- },
51
- colors: {
52
- neutral: {
53
- 0: "rgb(var(--neutral-0) / <alpha-value>)",
54
- 25: "rgb(var(--neutral-25) / <alpha-value>)",
55
- 50: "rgb(var(--neutral-50) / <alpha-value>)",
56
- 100: "rgb(var(--neutral-100) / <alpha-value>)",
57
- 150: "rgb(var(--neutral-150) / <alpha-value>)",
58
- 200: "rgb(var(--neutral-200) / <alpha-value>)",
59
- 250: "rgb(var(--neutral-250) / <alpha-value>)",
60
- 300: "rgb(var(--neutral-300) / <alpha-value>)",
61
- 350: "rgb(var(--neutral-350) / <alpha-value>)",
62
- 400: "rgb(var(--neutral-400) / <alpha-value>)",
63
- 450: "rgb(var(--neutral-450) / <alpha-value>)",
64
- 500: "rgb(var(--neutral-500) / <alpha-value>)",
65
- 550: "rgb(var(--neutral-550) / <alpha-value>)",
66
- 600: "rgb(var(--neutral-600) / <alpha-value>)",
67
- 650: "rgb(var(--neutral-650) / <alpha-value>)",
68
- 700: "rgb(var(--neutral-700) / <alpha-value>)",
69
- 750: "rgb(var(--neutral-750) / <alpha-value>)",
70
- 800: "rgb(var(--neutral-800) / <alpha-value>)",
71
- 850: "rgb(var(--neutral-850) / <alpha-value>)",
72
- 900: "rgb(var(--neutral-900) / <alpha-value>)",
73
- },
74
- primary: {
75
- 0: "rgb(var(--primary-0) / <alpha-value>)",
76
- 50: "rgb(var(--primary-50) / <alpha-value>)",
77
- 100: "rgb(var(--primary-100) / <alpha-value>)",
78
- 500: "rgb(var(--primary-500) / <alpha-value>)",
79
- 600: "rgb(var(--primary-600) / <alpha-value>)",
80
- 900: "rgb(var(--primary-900) / <alpha-value>)",
81
- },
82
- success: {
83
- 100: "rgb(var(--success-100) / <alpha-value>)",
84
- 500: "rgb(var(--success-500) / <alpha-value>)",
85
- 600: "rgb(var(--success-600) / <alpha-value>)",
86
- },
87
- danger: {
88
- 100: "rgb(var(--danger-100) / <alpha-value>)",
89
- 500: "rgb(var(--danger-500) / <alpha-value>)",
90
- 600: "rgb(var(--danger-600) / <alpha-value>)",
91
- },
92
- warning: {
93
- 100: "rgb(var(--warning-100) / <alpha-value>)",
94
- 500: "rgb(var(--warning-500) / <alpha-value>)",
95
- 600: "rgb(var(--warning-600) / <alpha-value>)",
96
- },
97
- brand: {
98
- 10: "rgb(var(--brand-10) / <alpha-value>)",
99
- 20: "rgb(var(--brand-20) / <alpha-value>)",
100
- 30: "rgb(var(--brand-30) / <alpha-value>)",
101
- 40: "rgb(var(--brand-40) / <alpha-value>)",
102
- 50: "rgb(var(--brand-50) / <alpha-value>)",
103
- 60: "rgb(var(--brand-60) / <alpha-value>)",
104
- 70: "rgb(var(--brand-70) / <alpha-value>)",
105
- 80: "rgb(var(--brand-80) / <alpha-value>)",
106
- },
107
- post: "rgb(var(--post) / <alpha-value>)",
108
- delete: "rgb(var(--delete) / <alpha-value>)",
109
- put: "rgb(var(--put) / <alpha-value>)",
110
- patch: "rgb(var(--patch) / <alpha-value>)",
111
- get: "rgb(var(--get) / <alpha-value>)",
112
- body: "rgb(var(--body-background) / <alpha-value>)",
113
- transparent: "transparent",
114
- customer: {
115
- primary: {
116
- 100: "var(--color-customer-primary-100)",
117
- 200: "var(--color-customer-primary-200)",
118
- 300: "var(--color-customer-primary-300)",
119
- 400: "var(--color-customer-primary-400)",
120
- 500: "var(--color-customer-primary-500)",
121
- 600: "var(--color-customer-primary-600)",
122
- 700: "var(--color-customer-primary-700)",
123
- 800: "var(--color-customer-primary-800)",
124
- 900: "var(--color-customer-primary-900)",
125
- },
126
- secondary: {
127
- 100: "var(--color-customer-secondary-100)",
128
- 200: "var(--color-customer-secondary-200)",
129
- 300: "var(--color-customer-secondary-300)",
130
- 400: "var(--color-customer-secondary-400)",
131
- 500: "var(--color-customer-secondary-500)",
132
- 600: "var(--color-customer-secondary-600)",
133
- 700: "var(--color-customer-secondary-700)",
134
- 800: "var(--color-customer-secondary-800)",
135
- 900: "var(--color-customer-secondary-900)",
136
- },
137
- tertiary: {
138
- 100: "var(--color-customer-tertiary-100)",
139
- 200: "var(--color-customer-tertiary-200)",
140
- 300: "var(--color-customer-tertiary-300)",
141
- 400: "var(--color-customer-tertiary-400)",
142
- 500: "var(--color-customer-tertiary-500)",
143
- 600: "var(--color-customer-tertiary-600)",
144
- 700: "var(--color-customer-tertiary-700)",
145
- 800: "var(--color-customer-tertiary-800)",
146
- 900: "var(--color-customer-tertiary-900)",
147
- },
148
- },
149
- brand: {
150
- primary: {
151
- 100: "#EAEEFA",
152
- 200: "#D6DCF5",
153
- 300: "#8397E2",
154
- 400: "#4C79FA",
155
- 500: "#3151CE",
156
- 600: "#2746AD",
157
- 700: "#1D317C",
158
- 800: "#142052",
159
- 900: "#0A1029",
160
- },
161
- navy: {
162
- 100: "#C9D1FF",
163
- 200: "#9AA5E2",
164
- 300: "#48507D",
165
- 400: "#2A2E45",
166
- 500: "#232534",
167
- 600: "#1C1E2A",
168
- 700: "#191C2A",
169
- 800: "#0E0F15",
170
- 900: "#07070A",
171
- },
172
- paper: {
173
- 100: "#FEFDFB",
174
- 200: "#FEFCF9",
175
- 300: "#FDFBF6",
176
- 400: "#FDF9F3",
177
- 500: "#FCF8F0",
178
- 600: "#F7ECD6",
179
- 700: "#F2E0BD",
180
- 800: "#EDD4A3",
181
- 900: "#EBCE96",
182
- },
183
- green: {
184
- 100: "#E4F7E4",
185
- 200: "#C9EEC8",
186
- 300: "#AFE6AD",
187
- 400: "#8FFF85",
188
- 500: "#79D576",
189
- 600: "#62AC5D",
190
- 700: "#4C8B4A",
191
- 800: "#366534",
192
- 900: "#1F401E",
193
- },
194
- },
195
- product: {
196
- oms: {
197
- 100: "#F8DFD6",
198
- 200: "#F1BFAD",
199
- 300: "#EA9E85",
200
- 400: "#DF8738",
201
- 500: "#DC5E33",
202
- 600: "#CF4A11",
203
- 700: "#84381F",
204
- 800: "#582614",
205
- 900: "#2C130A",
206
- },
207
- pim: {
208
- 100: "#E8F1EF",
209
- 200: "#D2E5E3",
210
- 300: "#C2D7D5",
211
- 400: "#A3BCB9",
212
- 500: "#345B57",
213
- 600: "#27443F",
214
- 700: "#1F3734",
215
- 800: "#152423",
216
- 900: "#0A1211",
217
- },
218
- appstore: {
219
- 100: "#E9F7FF",
220
- 200: "#D5EFFE",
221
- 300: "#AADEFD",
222
- 400: "#A6E6FD",
223
- 500: "#72C8FC",
224
- 600: "#65B0D8",
225
- 700: "#4589B3",
226
- 800: "#184A6A",
227
- 900: "#012B45",
228
- },
229
- devtools: {
230
- 100: "#F7C9E8",
231
- 200: "#E0A5CD",
232
- 300: "#B35C96",
233
- 400: "#9F127A",
234
- 500: "#861360",
235
- 600: "#640D4D",
236
- 700: "#500B3A",
237
- 800: "#360826",
238
- 900: "#1B0413",
239
- },
240
- },
241
- system: {
242
- neutral: {
243
- 100: "#F4F4F8",
244
- 200: "#EEEFF4",
245
- 300: "#E3E3ED",
246
- 400: "#D9DAE5",
247
- 500: "#C6C9D9",
248
- 600: "#A9ADC0",
249
- 700: "#989DAD",
250
- 800: "#777D8A",
251
- 900: "#3D4150",
252
- },
253
- success: {
254
- 100: "#D1FADF",
255
- 200: "#A6F4C5",
256
- 300: "#6CE9A6",
257
- 400: "#32D583",
258
- 500: "#12B76A",
259
- 600: "#039855",
260
- 700: "#027A48",
261
- 800: "#05603A",
262
- 900: "#054F31",
263
- },
264
- error: {
265
- 100: "#FEE4E2",
266
- 200: "#FECDCA",
267
- 300: "#FECDCA",
268
- 400: "#F97066",
269
- 500: "#F04438",
270
- 600: "#D92D20",
271
- 700: "#B42318",
272
- 800: "#912018",
273
- 900: "#7A271A",
274
- },
275
- warning: {
276
- 100: "#FEF0C7",
277
- 200: "#FEDF89",
278
- 300: "#FEC84B",
279
- 400: "#FDB022",
280
- 500: "#F79009",
281
- 600: "#DC6803",
282
- 700: "#B54708",
283
- 800: "#93370D",
284
- 900: "#7A2E0E",
285
- },
286
- global: {
287
- 100: "#FFFFFF",
288
- 900: "#1A1A1A",
289
- },
290
- },
291
- },
292
- spacing: {
293
- 0: "0",
294
- 1: ".154rem",
295
- 2: ".308rem",
296
- 3: ".462rem",
297
- 4: ".615rem",
298
- 5: ".769rem",
299
- 6: ".923rem",
300
- 7: "1.077rem",
301
- 8: "1.231rem",
302
- 9: "1.385rem",
303
- 10: "1.538rem",
304
- 11: "1.692rem",
305
- 12: "1.846rem",
306
- 13: "2rem",
307
- 14: "2.154rem",
308
- 15: "2.308rem",
309
- 16: "2.538rem",
310
- 17: "2.923rem",
311
- 18: "3.308rem",
312
- 19: "3.692rem",
313
- 20: "4.077rem",
314
- 21: "4.462rem",
315
- },
316
- borderRadius: {
317
- none: "0",
318
- sm: "0.308rem",
319
- DEFAULT: ".462rem",
320
- lg: "2.308rem",
321
- full: "9999px",
322
- },
323
- fontSize: {
324
- sm: "0.769rem",
325
- base: "1rem",
326
- md: "1.077rem",
327
- "2md": "1.231rem",
328
- xl: "1.538rem",
329
- "2xl": "2rem",
330
- "3xl": "2.462rem",
331
- },
332
- fontFamily: {
333
- sans: ["Fira Sans", "sans-serif"],
334
- mono: ["Fira Mono", "monospace"],
335
- dmsans: ["DMSans", "sans-serif"],
336
- inter: ["Inter", "sans-serif"],
337
- },
338
- fontWeight: {
339
- regular: 400,
340
- medium: 500,
341
- semibold: 600,
342
- bold: 700,
343
- },
344
- boxShadow: {
345
- sm: "0px 3px 10px 0px rgba(0, 0, 0, 0.05)",
346
- DEFAULT: "0px 2px 10px 0px rgba(0, 0, 0, 0.1)",
347
- md: "0 0px 20px -1px rgb(0 0 0 / 0.1)",
348
- bordered: "0 0px 0px 3px rgb(0 0 0 / 0.1)",
349
- },
350
- },
351
- };
1
+ module.exports = {
2
+ theme: {
3
+ extend: {
4
+ keyframes: {
5
+ slideDownAndFade: {
6
+ from: { opacity: "0", transform: "translateY(-2px)" },
7
+ to: { opacity: "1", transform: "translateY(0)" },
8
+ },
9
+ slideLeftAndFade: {
10
+ from: { opacity: "0", transform: "translateX(2px)" },
11
+ to: { opacity: "1", transform: "translateX(0)" },
12
+ },
13
+ slideUpAndFade: {
14
+ from: { opacity: "0", transform: "translateY(2px)" },
15
+ to: { opacity: "1", transform: "translateY(0)" },
16
+ },
17
+ slideRightAndFade: {
18
+ from: { opacity: "0", transform: "translateX(-2px)" },
19
+ to: { opacity: "1", transform: "translateX(0)" },
20
+ },
21
+ },
22
+ animation: {
23
+ slideDownAndFade:
24
+ "slideDownAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
25
+ slideLeftAndFade:
26
+ "slideLeftAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
27
+ slideUpAndFade: "slideUpAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
28
+ slideRightAndFade:
29
+ "slideRightAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
30
+ },
31
+ gridTemplateColumns: {
32
+ xs: "repeat(auto-fill,minmax(12.5rem,1fr))",
33
+ sm: "repeat(auto-fill,minmax(22rem,1fr))",
34
+ md: "repeat(auto-fill,minmax(30rem,1fr))",
35
+ lg: "repeat(auto-fill,minmax(37.5rem,1fr))",
36
+ },
37
+ gridColumn: {
38
+ "span-full": "1 / -1",
39
+ },
40
+ screens: {
41
+ "2md": "930px",
42
+ },
43
+ lineHeight: {
44
+ 120: "120%",
45
+ 140: "140%",
46
+ },
47
+ aria: {
48
+ invalid: 'invalid="true"',
49
+ },
50
+ },
51
+ colors: {
52
+ neutral: {
53
+ 0: "rgb(var(--neutral-0) / <alpha-value>)",
54
+ 25: "rgb(var(--neutral-25) / <alpha-value>)",
55
+ 50: "rgb(var(--neutral-50) / <alpha-value>)",
56
+ 100: "rgb(var(--neutral-100) / <alpha-value>)",
57
+ 150: "rgb(var(--neutral-150) / <alpha-value>)",
58
+ 200: "rgb(var(--neutral-200) / <alpha-value>)",
59
+ 250: "rgb(var(--neutral-250) / <alpha-value>)",
60
+ 300: "rgb(var(--neutral-300) / <alpha-value>)",
61
+ 350: "rgb(var(--neutral-350) / <alpha-value>)",
62
+ 400: "rgb(var(--neutral-400) / <alpha-value>)",
63
+ 450: "rgb(var(--neutral-450) / <alpha-value>)",
64
+ 500: "rgb(var(--neutral-500) / <alpha-value>)",
65
+ 550: "rgb(var(--neutral-550) / <alpha-value>)",
66
+ 600: "rgb(var(--neutral-600) / <alpha-value>)",
67
+ 650: "rgb(var(--neutral-650) / <alpha-value>)",
68
+ 700: "rgb(var(--neutral-700) / <alpha-value>)",
69
+ 750: "rgb(var(--neutral-750) / <alpha-value>)",
70
+ 800: "rgb(var(--neutral-800) / <alpha-value>)",
71
+ 850: "rgb(var(--neutral-850) / <alpha-value>)",
72
+ 900: "rgb(var(--neutral-900) / <alpha-value>)",
73
+ },
74
+ primary: {
75
+ 0: "rgb(var(--primary-0) / <alpha-value>)",
76
+ 50: "rgb(var(--primary-50) / <alpha-value>)",
77
+ 100: "rgb(var(--primary-100) / <alpha-value>)",
78
+ 500: "rgb(var(--primary-500) / <alpha-value>)",
79
+ 600: "rgb(var(--primary-600) / <alpha-value>)",
80
+ 900: "rgb(var(--primary-900) / <alpha-value>)",
81
+ },
82
+ success: {
83
+ 100: "rgb(var(--success-100) / <alpha-value>)",
84
+ 500: "rgb(var(--success-500) / <alpha-value>)",
85
+ 600: "rgb(var(--success-600) / <alpha-value>)",
86
+ },
87
+ danger: {
88
+ 100: "rgb(var(--danger-100) / <alpha-value>)",
89
+ 500: "rgb(var(--danger-500) / <alpha-value>)",
90
+ 600: "rgb(var(--danger-600) / <alpha-value>)",
91
+ },
92
+ warning: {
93
+ 100: "rgb(var(--warning-100) / <alpha-value>)",
94
+ 500: "rgb(var(--warning-500) / <alpha-value>)",
95
+ 600: "rgb(var(--warning-600) / <alpha-value>)",
96
+ },
97
+ brand: {
98
+ 10: "rgb(var(--brand-10) / <alpha-value>)",
99
+ 20: "rgb(var(--brand-20) / <alpha-value>)",
100
+ 30: "rgb(var(--brand-30) / <alpha-value>)",
101
+ 40: "rgb(var(--brand-40) / <alpha-value>)",
102
+ 50: "rgb(var(--brand-50) / <alpha-value>)",
103
+ 60: "rgb(var(--brand-60) / <alpha-value>)",
104
+ 70: "rgb(var(--brand-70) / <alpha-value>)",
105
+ 80: "rgb(var(--brand-80) / <alpha-value>)",
106
+ },
107
+ post: "rgb(var(--post) / <alpha-value>)",
108
+ delete: "rgb(var(--delete) / <alpha-value>)",
109
+ put: "rgb(var(--put) / <alpha-value>)",
110
+ patch: "rgb(var(--patch) / <alpha-value>)",
111
+ get: "rgb(var(--get) / <alpha-value>)",
112
+ body: "rgb(var(--body-background) / <alpha-value>)",
113
+ transparent: "transparent",
114
+ customer: {
115
+ primary: {
116
+ 100: "var(--color-customer-primary-100)",
117
+ 200: "var(--color-customer-primary-200)",
118
+ 300: "var(--color-customer-primary-300)",
119
+ 400: "var(--color-customer-primary-400)",
120
+ 500: "var(--color-customer-primary-500)",
121
+ 600: "var(--color-customer-primary-600)",
122
+ 700: "var(--color-customer-primary-700)",
123
+ 800: "var(--color-customer-primary-800)",
124
+ 900: "var(--color-customer-primary-900)",
125
+ },
126
+ secondary: {
127
+ 100: "var(--color-customer-secondary-100)",
128
+ 200: "var(--color-customer-secondary-200)",
129
+ 300: "var(--color-customer-secondary-300)",
130
+ 400: "var(--color-customer-secondary-400)",
131
+ 500: "var(--color-customer-secondary-500)",
132
+ 600: "var(--color-customer-secondary-600)",
133
+ 700: "var(--color-customer-secondary-700)",
134
+ 800: "var(--color-customer-secondary-800)",
135
+ 900: "var(--color-customer-secondary-900)",
136
+ },
137
+ tertiary: {
138
+ 100: "var(--color-customer-tertiary-100)",
139
+ 200: "var(--color-customer-tertiary-200)",
140
+ 300: "var(--color-customer-tertiary-300)",
141
+ 400: "var(--color-customer-tertiary-400)",
142
+ 500: "var(--color-customer-tertiary-500)",
143
+ 600: "var(--color-customer-tertiary-600)",
144
+ 700: "var(--color-customer-tertiary-700)",
145
+ 800: "var(--color-customer-tertiary-800)",
146
+ 900: "var(--color-customer-tertiary-900)",
147
+ },
148
+ },
149
+ brand: {
150
+ primary: {
151
+ 100: "#EAEEFA",
152
+ 200: "#D6DCF5",
153
+ 300: "#8397E2",
154
+ 400: "#4C79FA",
155
+ 500: "#3151CE",
156
+ 600: "#2746AD",
157
+ 700: "#1D317C",
158
+ 800: "#142052",
159
+ 900: "#0A1029",
160
+ },
161
+ navy: {
162
+ 100: "#C9D1FF",
163
+ 200: "#9AA5E2",
164
+ 300: "#48507D",
165
+ 400: "#2A2E45",
166
+ 500: "#232534",
167
+ 600: "#1C1E2A",
168
+ 700: "#191C2A",
169
+ 800: "#0E0F15",
170
+ 900: "#07070A",
171
+ },
172
+ paper: {
173
+ 100: "#FEFDFB",
174
+ 200: "#FEFCF9",
175
+ 300: "#FDFBF6",
176
+ 400: "#FDF9F3",
177
+ 500: "#FCF8F0",
178
+ 600: "#F7ECD6",
179
+ 700: "#F2E0BD",
180
+ 800: "#EDD4A3",
181
+ 900: "#EBCE96",
182
+ },
183
+ green: {
184
+ 100: "#E4F7E4",
185
+ 200: "#C9EEC8",
186
+ 300: "#AFE6AD",
187
+ 400: "#8FFF85",
188
+ 500: "#79D576",
189
+ 600: "#62AC5D",
190
+ 700: "#4C8B4A",
191
+ 800: "#366534",
192
+ 900: "#1F401E",
193
+ },
194
+ },
195
+ product: {
196
+ oms: {
197
+ 100: "#F8DFD6",
198
+ 200: "#F1BFAD",
199
+ 300: "#EA9E85",
200
+ 400: "#DF8738",
201
+ 500: "#DC5E33",
202
+ 600: "#CF4A11",
203
+ 700: "#84381F",
204
+ 800: "#582614",
205
+ 900: "#2C130A",
206
+ },
207
+ pim: {
208
+ 100: "#E8F1EF",
209
+ 200: "#D2E5E3",
210
+ 300: "#C2D7D5",
211
+ 400: "#A3BCB9",
212
+ 500: "#345B57",
213
+ 600: "#27443F",
214
+ 700: "#1F3734",
215
+ 800: "#152423",
216
+ 900: "#0A1211",
217
+ },
218
+ appstore: {
219
+ 100: "#E9F7FF",
220
+ 200: "#D5EFFE",
221
+ 300: "#AADEFD",
222
+ 400: "#A6E6FD",
223
+ 500: "#72C8FC",
224
+ 600: "#65B0D8",
225
+ 700: "#4589B3",
226
+ 800: "#184A6A",
227
+ 900: "#012B45",
228
+ },
229
+ devtools: {
230
+ 100: "#F7C9E8",
231
+ 200: "#E0A5CD",
232
+ 300: "#B35C96",
233
+ 400: "#9F127A",
234
+ 500: "#861360",
235
+ 600: "#640D4D",
236
+ 700: "#500B3A",
237
+ 800: "#360826",
238
+ 900: "#1B0413",
239
+ },
240
+ black: {
241
+ 100: "#E5E7EB",
242
+ 200: "#D1D5DB",
243
+ 300: "#9CA3AF",
244
+ 400: "#6B7280",
245
+ 500: "#374151",
246
+ 600: "#1F2937",
247
+ 700: "#111827",
248
+ 800: "#0B0F19",
249
+ 900: "#05070D",
250
+ },
251
+ neutral: {
252
+ 100: "#F4F4F8",
253
+ 200: "#EEEFF4",
254
+ 300: "#E3E3ED",
255
+ 400: "#D9DAE5",
256
+ 500: "#C6C9D9",
257
+ 600: "#A9ADC0",
258
+ 700: "#989DAD",
259
+ 800: "#777D8A",
260
+ 900: "#3D4150",
261
+ },
262
+ },
263
+ system: {
264
+ neutral: {
265
+ 100: "#F4F4F8",
266
+ 200: "#EEEFF4",
267
+ 300: "#E3E3ED",
268
+ 400: "#D9DAE5",
269
+ 500: "#C6C9D9",
270
+ 600: "#A9ADC0",
271
+ 700: "#989DAD",
272
+ 800: "#777D8A",
273
+ 900: "#3D4150",
274
+ },
275
+ success: {
276
+ 100: "#D1FADF",
277
+ 200: "#A6F4C5",
278
+ 300: "#6CE9A6",
279
+ 400: "#32D583",
280
+ 500: "#12B76A",
281
+ 600: "#039855",
282
+ 700: "#027A48",
283
+ 800: "#05603A",
284
+ 900: "#054F31",
285
+ },
286
+ error: {
287
+ 100: "#FEE4E2",
288
+ 200: "#FECDCA",
289
+ 300: "#FECDCA",
290
+ 400: "#F97066",
291
+ 500: "#F04438",
292
+ 600: "#D92D20",
293
+ 700: "#B42318",
294
+ 800: "#912018",
295
+ 900: "#7A271A",
296
+ },
297
+ warning: {
298
+ 100: "#FEF0C7",
299
+ 200: "#FEDF89",
300
+ 300: "#FEC84B",
301
+ 400: "#FDB022",
302
+ 500: "#F79009",
303
+ 600: "#DC6803",
304
+ 700: "#B54708",
305
+ 800: "#93370D",
306
+ 900: "#7A2E0E",
307
+ },
308
+ global: {
309
+ 100: "#FFFFFF",
310
+ 900: "#1A1A1A",
311
+ },
312
+ },
313
+ },
314
+ spacing: {
315
+ 0: "0",
316
+ 1: ".154rem",
317
+ 2: ".308rem",
318
+ 3: ".462rem",
319
+ 4: ".615rem",
320
+ 5: ".769rem",
321
+ 6: ".923rem",
322
+ 7: "1.077rem",
323
+ 8: "1.231rem",
324
+ 9: "1.385rem",
325
+ 10: "1.538rem",
326
+ 11: "1.692rem",
327
+ 12: "1.846rem",
328
+ 13: "2rem",
329
+ 14: "2.154rem",
330
+ 15: "2.308rem",
331
+ 16: "2.538rem",
332
+ 17: "2.923rem",
333
+ 18: "3.308rem",
334
+ 19: "3.692rem",
335
+ 20: "4.077rem",
336
+ 21: "4.462rem",
337
+ },
338
+ borderRadius: {
339
+ none: "0",
340
+ sm: "0.308rem",
341
+ DEFAULT: ".462rem",
342
+ lg: "2.308rem",
343
+ full: "9999px",
344
+ },
345
+ fontSize: {
346
+ sm: "0.769rem",
347
+ base: "1rem",
348
+ md: "1.077rem",
349
+ "2md": "1.231rem",
350
+ xl: "1.538rem",
351
+ "2xl": "2rem",
352
+ "3xl": "2.462rem",
353
+ },
354
+ fontFamily: {
355
+ sans: ["Fira Sans", "sans-serif"],
356
+ mono: ["Fira Mono", "monospace"],
357
+ dmsans: ["DMSans", "sans-serif"],
358
+ inter: ["Inter", "sans-serif"],
359
+ },
360
+ fontWeight: {
361
+ regular: 400,
362
+ medium: 500,
363
+ semibold: 600,
364
+ bold: 700,
365
+ },
366
+ boxShadow: {
367
+ sm: "0px 3px 10px 0px rgba(0, 0, 0, 0.05)",
368
+ DEFAULT: "0px 2px 10px 0px rgba(0, 0, 0, 0.1)",
369
+ md: "0 0px 20px -1px rgb(0 0 0 / 0.1)",
370
+ bordered: "0 0px 0px 3px rgb(0 0 0 / 0.1)",
371
+ },
372
+ },
373
+ };
package/dist/styles.min.scss CHANGED
@@ -1 +1 @@
1
- @import"https://fonts.googleapis.com/css2?family=Fira+Mono:wght@400;500&family=Fira+Sans:wght@400;500;600;700&display=swap";@tailwind base;@tailwind components;@tailwind utilities;*{margin:0;padding:0;box-sizing:border-box}body{position:relative}@media(max-width: 640px){html{font-size:16px}}@media(min-width: 640px){html{font-size:13px}}@layer base{:root{--neutral-0: 255 255 255;--neutral-25: 250 250 250;--neutral-50: 243 243 243;--neutral-100: 230 230 230;--neutral-150: 217 217 217;--neutral-200: 204 204 204;--neutral-250: 191 191 191;--neutral-300: 179 179 179;--neutral-350: 165 165 165;--neutral-400: 153 153 153;--neutral-450: 140 140 140;--neutral-500: 128 128 128;--neutral-550: 115 115 115;--neutral-600: 102 102 102;--neutral-650: 90 90 90;--neutral-700: 76 76 76;--neutral-750: 64 64 64;--neutral-800: 51 51 51;--neutral-850: 38 38 38;--neutral-900: 21 24 30;--primary-0: 246 248 254;--primary-50: 232 239 253;--primary-100: 206 227 253;--primary-500: 9 112 246;--primary-600: 7 90 197;--primary-900: 2 22 49;--success-100: 240 254 230;--success-500: 116 217 38;--success-600: 93 173 31;--danger-100: 254 232 230;--danger-500: 246 24 9;--danger-600: 197 19 7;--warning-100: 254 244 230;--warning-500: 246 143 9;--warning-600: 197 114 7;--brand-10: 155 212 255;--brand-20: 55 170 255;--brand-30: 89 131 247;--brand-40: 87 153 247;--brand-50: 27 123 247;--brand-60: 27 105 253;--brand-70: 11 94 215;--brand-80: 8 43 94;--post: var(--success-600);--delete: var(--danger-500);--put: var(--warning-500);--patch: 180 45 255;--get: var(--primary-500);--body-background: var(--neutral-50);--color-customer-primary-100: #f0f9ff;--color-customer-primary-200: #e0f2fe;--color-customer-primary-300: #bae6fd;--color-customer-primary-400: #7dd3fc;--color-customer-primary-500: #38bdf8;--color-customer-primary-600: #0ea5e9;--color-customer-primary-700: #0284c7;--color-customer-primary-800: #0369a1;--color-customer-primary-900: #0c4a6e;--color-customer-secondary-100: #f5f5f5;--color-customer-secondary-200: #e5e5e5;--color-customer-secondary-300: #d4d4d4;--color-customer-secondary-400: #a3a3a3;--color-customer-secondary-500: #737373;--color-customer-secondary-600: #525252;--color-customer-secondary-700: #404040;--color-customer-secondary-800: #262626;--color-customer-secondary-900: #0a0a0a;--color-customer-tertiary-100: #f9fafb;--color-customer-tertiary-200: #f3f4f6;--color-customer-tertiary-300: #e5e7eb;--color-customer-tertiary-400: #d1d5db;--color-customer-tertiary-500: #9ca3af;--color-customer-tertiary-600: #6b7280;--color-customer-tertiary-700: #4b5563;--color-customer-tertiary-800: #374151;--color-customer-tertiary-900: #1f2937}}@font-face{font-family:"DMSans";src:url("./../../assets/fonts/DMSans-Regular.ttf") format("truetype");font-weight:400;font-style:normal}@font-face{font-family:"DMSans";src:url("./../../assets/fonts/DMSans-Bold.ttf") format("truetype");font-weight:700;font-style:normal}@font-face{font-family:"DMSans";src:url("./../../assets/fonts/DMSans-Italic.ttf") format("truetype");font-weight:400;font-style:italic}@font-face{font-family:"DMSans";src:url("./../../assets/fonts/DMSans-Light.ttf") format("truetype");font-weight:300;font-style:normal}@font-face{font-family:"DMSans";src:url("./../../assets/fonts/DMSans-Medium.ttf") format("truetype");font-weight:500;font-style:normal}@font-face{font-family:"Inter";src:url("./../../assets/fonts/Inter-Regular.ttf") format("truetype");font-weight:400;font-style:normal}@font-face{font-family:"Inter";src:url("./../../assets/fonts/Inter-Bold.ttf") format("truetype");font-weight:700;font-style:normal}@font-face{font-family:"Inter";src:url("./../../assets/fonts/Inter-Italic.ttf") format("truetype");font-weight:400;font-style:italic}@font-face{font-family:"Inter";src:url("./../../assets/fonts/Inter-Light.ttf") format("truetype");font-weight:300;font-style:normal}@font-face{font-family:"Inter";src:url("./../../assets/fonts/Inter-Medium.ttf") format("truetype");font-weight:500;font-style:normal}body{font-family:"Fira Sans",sans-serif;font-weight:400;font-style:normal;@apply text-neutral-700}h1{@apply text-3xl;line-height:140%}h2{@apply text-2xl;line-height:140%}h3{@apply text-xl;line-height:140%}h4{@apply text-2md;line-height:140%}h4{@apply text-md;line-height:140%}a,p,span{@apply text-base;line-height:140%}small{@apply text-sm;line-height:120%}p{white-space:normal;line-height:140%}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{@apply bg-neutral-600 rounded}.krz-grid-xs{@apply grid grid-cols-xs gap-4}.krz-grid-sm{@apply grid grid-cols-sm gap-4}.krz-grid-md{@apply grid grid-cols-md gap-4}.krz-grid-lg{@apply grid grid-cols-lg gap-4}
1
+ @import"https://fonts.googleapis.com/css2?family=Fira+Mono:wght@400;500&family=Fira+Sans:wght@400;500;600;700&display=swap";@tailwind base;@tailwind components;@tailwind utilities;*{margin:0;padding:0;box-sizing:border-box}body{position:relative}@media(max-width: 640px){html{font-size:16px}}@media(min-width: 640px){html{font-size:13px}}@layer base{:root{--neutral-0: 255 255 255;--neutral-25: 250 250 250;--neutral-50: 243 243 243;--neutral-100: 230 230 230;--neutral-150: 217 217 217;--neutral-200: 204 204 204;--neutral-250: 191 191 191;--neutral-300: 179 179 179;--neutral-350: 165 165 165;--neutral-400: 153 153 153;--neutral-450: 140 140 140;--neutral-500: 128 128 128;--neutral-550: 115 115 115;--neutral-600: 102 102 102;--neutral-650: 90 90 90;--neutral-700: 76 76 76;--neutral-750: 64 64 64;--neutral-800: 51 51 51;--neutral-850: 38 38 38;--neutral-900: 21 24 30;--primary-0: 246 248 254;--primary-50: 232 239 253;--primary-100: 206 227 253;--primary-500: 9 112 246;--primary-600: 7 90 197;--primary-900: 2 22 49;--success-100: 240 254 230;--success-500: 116 217 38;--success-600: 93 173 31;--danger-100: 254 232 230;--danger-500: 246 24 9;--danger-600: 197 19 7;--warning-100: 254 244 230;--warning-500: 246 143 9;--warning-600: 197 114 7;--brand-10: 155 212 255;--brand-20: 55 170 255;--brand-30: 89 131 247;--brand-40: 87 153 247;--brand-50: 27 123 247;--brand-60: 27 105 253;--brand-70: 11 94 215;--brand-80: 8 43 94;--post: var(--success-600);--delete: var(--danger-500);--put: var(--warning-500);--patch: 180 45 255;--get: var(--primary-500);--body-background: var(--neutral-50);--color-customer-primary-100: #f0f9ff;--color-customer-primary-200: #e0f2fe;--color-customer-primary-300: #bae6fd;--color-customer-primary-400: #7dd3fc;--color-customer-primary-500: #38bdf8;--color-customer-primary-600: #0ea5e9;--color-customer-primary-700: #0284c7;--color-customer-primary-800: #0369a1;--color-customer-primary-900: #0c4a6e;--color-customer-secondary-100: #f5f5f5;--color-customer-secondary-200: #e5e5e5;--color-customer-secondary-300: #d4d4d4;--color-customer-secondary-400: #a3a3a3;--color-customer-secondary-500: #737373;--color-customer-secondary-600: #525252;--color-customer-secondary-700: #404040;--color-customer-secondary-800: #262626;--color-customer-secondary-900: #0a0a0a;--color-customer-tertiary-100: #f9fafb;--color-customer-tertiary-200: #f3f4f6;--color-customer-tertiary-300: #e5e7eb;--color-customer-tertiary-400: #d1d5db;--color-customer-tertiary-500: #9ca3af;--color-customer-tertiary-600: #6b7280;--color-customer-tertiary-700: #4b5563;--color-customer-tertiary-800: #374151;--color-customer-tertiary-900: #1f2937}}@font-face{font-family:"DMSans";src:url("~@kruzer/styles/assets/fonts/DMSans-Light.ttf") format("truetype");font-weight:300;font-style:normal}@font-face{font-family:"DMSans";src:url("~@kruzer/styles/assets/fonts/DMSans-Regular.ttf") format("truetype");font-weight:400;font-style:normal}@font-face{font-family:"DMSans";src:url("~@kruzer/styles/assets/fonts/DMSans-Italic.ttf") format("truetype");font-weight:400;font-style:italic}@font-face{font-family:"DMSans";src:url("~@kruzer/styles/assets/fonts/DMSans-Medium.ttf") format("truetype");font-weight:500;font-style:normal}@font-face{font-family:"DMSans";src:url("~@kruzer/styles/assets/fonts/DMSans-Bold.ttf") format("truetype");font-weight:600;font-style:normal}@font-face{font-family:"DMSans";src:url("~@kruzer/styles/assets/fonts/DMSans-Bold.ttf") format("truetype");font-weight:700;font-style:normal}@font-face{font-family:"Inter";src:url("~@kruzer/styles/assets/fonts/Inter-Light.ttf") format("truetype");font-weight:300;font-style:normal}@font-face{font-family:"Inter";src:url("~@kruzer/styles/assets/fonts/Inter-Regular.ttf") format("truetype");font-weight:400;font-style:normal}@font-face{font-family:"Inter";src:url("~@kruzer/styles/assets/fonts/Inter-Italic.ttf") format("truetype");font-weight:400;font-style:italic}@font-face{font-family:"Inter";src:url("~@kruzer/styles/assets/fonts/Inter-Medium.ttf") format("truetype");font-weight:500;font-style:normal}@font-face{font-family:"Inter";src:url("~@kruzer/styles/assets/fonts/Inter-Bold.ttf") format("truetype");font-weight:600;font-style:normal}@font-face{font-family:"Inter";src:url("~@kruzer/styles/assets/fonts/Inter-Bold.ttf") format("truetype");font-weight:700;font-style:normal}body{font-family:"Fira Sans",sans-serif;font-weight:400;font-style:normal;@apply text-neutral-700}h1{@apply text-3xl;line-height:140%}h2{@apply text-2xl;line-height:140%}h3{@apply text-xl;line-height:140%}h4{@apply text-2md;line-height:140%}h4{@apply text-md;line-height:140%}a,p,span{@apply text-base;line-height:140%}small{@apply text-sm;line-height:120%}p{white-space:normal;line-height:140%}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{@apply bg-neutral-600 rounded}.krz-grid-xs{@apply grid grid-cols-xs gap-4}.krz-grid-sm{@apply grid grid-cols-sm gap-4}.krz-grid-md{@apply grid grid-cols-md gap-4}.krz-grid-lg{@apply grid grid-cols-lg gap-4}
package/package.json CHANGED
@@ -1,34 +1,36 @@
1
- {
2
- "name": "@kruzer/styles",
3
- "version": "3.0.0-alpha.24",
4
- "type": "module",
5
- "main": "./dist/styles.js",
6
- "module": "./dist/styles.js",
7
- "files": [
8
- "dist/styles.min.scss",
9
- "dist/kruzer-tailwind-preset.cjs",
10
- "dist/styles.js"
11
- ],
12
- "scripts": {
13
- "dev": "vite",
14
- "build": "sass src/styles/main.scss src/styles/styles.min.scss --no-source-map --style compressed && tsc && vite build",
15
- "preview": "vite preview"
16
- },
17
- "keywords": [
18
- "scss",
19
- "css",
20
- "tailwindcss"
21
- ],
22
- "author": "Kruzer Product Team",
23
- "license": "ISC",
24
- "devDependencies": {
25
- "@types/node": "^18.15.5",
26
- "autoprefixer": "^10.4.14",
27
- "postcss": "^8.4.21",
28
- "sass": "^1.59.3",
29
- "tailwindcss": "^3.4.1",
30
- "typescript": "^4.9.3",
31
- "vite": "^4.2.0",
32
- "vite-plugin-static-copy": "^0.13.1"
33
- }
1
+ {
2
+ "name": "@kruzer/styles",
3
+ "version": "3.0.0-alpha.26",
4
+ "type": "module",
5
+ "main": "./dist/styles.js",
6
+ "module": "./dist/styles.js",
7
+ "files": [
8
+ "dist/styles.min.scss",
9
+ "dist/kruzer-tailwind-preset.cjs",
10
+ "dist/styles.js",
11
+ "dist/assets"
12
+ ],
13
+ "scripts": {
14
+ "dev": "vite",
15
+ "build": "sass src/styles/main.scss src/styles/styles.min.scss --no-source-map --style compressed && tsc && vite build",
16
+ "preview": "vite preview",
17
+ "publish": "npm publish --tag alpha"
18
+ },
19
+ "keywords": [
20
+ "scss",
21
+ "css",
22
+ "tailwindcss"
23
+ ],
24
+ "author": "Kruzer Product Team",
25
+ "license": "ISC",
26
+ "devDependencies": {
27
+ "@types/node": "^18.15.5",
28
+ "autoprefixer": "^10.4.14",
29
+ "postcss": "^8.4.21",
30
+ "sass": "^1.59.3",
31
+ "tailwindcss": "^3.4.1",
32
+ "typescript": "^4.9.3",
33
+ "vite": "^4.2.0",
34
+ "vite-plugin-static-copy": "^0.13.1"
35
+ }
34
36
  }