@clasing/ui 0.1.25 → 0.1.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 (6) hide show
  1. package/dist/index.d.ts +26 -21
  2. package/dist/index.es.js +1113 -1057
  3. package/dist/index.umd.js +10 -10
  4. package/dist/style.css +1 -1
  5. package/package.json +88 -86
  6. package/tailwind.config.js +61 -196
package/tailwind.config.js CHANGED
@@ -88,8 +88,8 @@ module.exports = {
88
88
  disabled: 'transparent',
89
89
  },
90
90
  background: {
91
- enabled: 'hsl(var(--color-blue-500) / <alpha-value>)',
92
- hover: 'hsl(var(--color-blue-700) / <alpha-value>)',
91
+ enabled: 'hsl(var(--color-blue-700) / <alpha-value>)',
92
+ hover: 'hsl(var(--color-blue-800) / <alpha-value>)',
93
93
  pressed: 'hsl(var(--color-blue-900) / <alpha-value>)',
94
94
  disabled: 'hsl(var(--color-neutral-300) / <alpha-value>)',
95
95
  },
@@ -202,7 +202,7 @@ module.exports = {
202
202
  pressed: 'transparent',
203
203
  disabled: 'transparent',
204
204
  },
205
- bg: {
205
+ background: {
206
206
  enabled: 'hsl(var(--color-brand-500) / <alpha-value>)',
207
207
  hover: 'hsl(var(--color-brand-700) / <alpha-value>)',
208
208
  pressed: 'hsl(var(--color-brand-900) / <alpha-value>)',
@@ -222,7 +222,7 @@ module.exports = {
222
222
  pressed: 'transparent',
223
223
  disabled: 'hsl(var(--color-neutral-300) / <alpha-value>)',
224
224
  },
225
- bg: {
225
+ background: {
226
226
  enabled: 'transparent',
227
227
  hover: 'hsl(var(--color-neutral-300) / <alpha-value>)',
228
228
  pressed: 'hsl(var(--color-neutral-900) / <alpha-value>)',
@@ -242,7 +242,7 @@ module.exports = {
242
242
  pressed: 'transparent',
243
243
  disabled: 'transparent',
244
244
  },
245
- bg: {
245
+ background: {
246
246
  enabled: 'transparent',
247
247
  hover: 'hsl(var(--color-neutral-300) / <alpha-value>)',
248
248
  pressed: 'hsl(var(--color-neutral-900) / <alpha-value>)',
@@ -263,216 +263,81 @@ module.exports = {
263
263
  subtle: 'hsl(var(--color-neutral-700) / <alpha-value>)',
264
264
  subtlest: 'hsl(var(--color-neutral-500) / <alpha-value>)',
265
265
  inverse: 'hsl(var(--color-neutral-000) / <alpha-value>)',
266
- 'subtle-inverse': 'hsl(var(--color-neutral-300) / <alpha-value>)',
267
- 'subtlest-inverse': 'hsl(var(--color-neutral-500) / <alpha-value>)',
268
- disabled: 'hsl(var(--color-neutral-200) / <alpha-value>)',
266
+ 'inverse-subtle': 'hsl(var(--color-neutral-300) / <alpha-value>)',
267
+ 'inverse-subtlest': 'hsl(var(--color-neutral-400) / <alpha-value>)',
268
+ disabled: 'hsl(var(--color-neutral-300) / <alpha-value>)',
269
269
  'disabled-bolder': 'hsl(var(--color-neutral-400) / <alpha-value>)',
270
270
  },
271
271
  utility: {
272
- warning: 'hsl(var(--color-mustard-500) / <alpha-value>)',
273
- 'warning-bolder': 'hsl(var(--color-mustard-900) / <alpha-value>)',
274
- danger: 'hsl(var(--color-fuchsia-500) / <alpha-value>)',
275
- 'danger-bolder': 'hsl(var(--color-fuchsia-900) / <alpha-value>)',
276
- success: 'hsl(var(--color-lime-500) / <alpha-value>)',
277
- 'success-bolder': 'hsl(var(--color-lime-900) / <alpha-value>)',
278
- discovery: 'hsl(var(--color-violet-500) / <alpha-value>)',
279
- informative: 'hsl(var(--color-marine-500) / <alpha-value>)',
272
+ warning: 'hsl(var(--color-warning-main) / <alpha-value>)',
273
+ error: 'hsl(var(--color-error-main) / <alpha-value>)',
274
+ success: 'hsl(var(--color-success-main) / <alpha-value>)',
275
+ info: 'hsl(var(--color-info-main) / <alpha-value>)',
280
276
  },
281
277
  accent: {
282
- 'brand-subtle': 'hsl(var(--color-brand-200) / <alpha-value>)',
278
+ 'brand-subtle': 'hsl(var(--color-brand-300) / <alpha-value>)',
283
279
  brand: 'hsl(var(--color-brand-500) / <alpha-value>)',
284
280
  'brand-bolder': 'hsl(var(--color-brand-800) / <alpha-value>)',
281
+ 'blue-subtle': 'hsl(var(--color-blue-300) / <alpha-value>)',
285
282
  blue: 'hsl(var(--color-blue-500) / <alpha-value>)',
286
283
  'blue-bolder': 'hsl(var(--color-blue-800) / <alpha-value>)',
287
- mustard: 'hsl(var(--color-mustard-500) / <alpha-value>)',
288
- 'mustard-bolder': 'hsl(var(--color-mustard-800) / <alpha-value>)',
289
- green: 'hsl(var(--color-green-500) / <alpha-value>)',
290
- 'green-bolder': 'hsl(var(--color-green-800) / <alpha-value>)',
291
- lime: 'hsl(var(--color-lime-500) / <alpha-value>)',
292
- 'lime-bolder': 'hsl(var(--color-lime-800) / <alpha-value>)',
293
- fuchsia: 'hsl(var(--color-fuchsia-500) / <alpha-value>)',
294
- 'fuchsia-bolder': 'hsl(var(--color-fuchsia-800) / <alpha-value>)',
295
- marine: 'hsl(var(--color-marine-500) / <alpha-value>)',
296
- 'marine-bolder': 'hsl(var(--color-marine-800) / <alpha-value>)',
297
- violet: 'hsl(var(--color-violet-500) / <alpha-value>)',
298
- 'violet-bolder': 'hsl(var(--color-violet-800) / <alpha-value>)',
299
- gray: 'hsl(var(--color-gray-500) / <alpha-value>)',
300
- 'gray-bolder': 'hsl(var(--color-gray-800) / <alpha-value>)',
301
- 'ice-subtlest': 'hsl(var(--color-ice-100) / <alpha-value>)',
302
- 'ice-subtle': 'hsl(var(--color-ice-300) / <alpha-value>)',
303
- ice: 'hsl(var(--color-ice-500) / <alpha-value>)',
304
- 'ice-bolder': 'hsl(var(--color-ice-800) / <alpha-value>)',
284
+ 'yellow-subtle': 'hsl(var(--color-yellow-200) / <alpha-value>)',
285
+ yellow: 'hsl(var(--color-yellow-500) / <alpha-value>)',
286
+ 'yellow-bolder': 'hsl(var(--color-yellow-800) / <alpha-value>)',
305
287
  },
306
288
  link: {
307
- enabled: 'hsl(var(--color-blue-500) / <alpha-value>)',
289
+ default: 'hsl(var(--color-blue-500) / <alpha-value>)',
308
290
  hover: 'hsl(var(--color-blue-700) / <alpha-value>)',
309
291
  pressed: 'hsl(var(--color-blue-900) / <alpha-value>)',
310
292
  },
311
293
  },
312
294
  surface: {
313
- neutral: {
314
- primary: 'hsl(var(--color-neutral-000) / <alpha-value>)',
315
- secondary: 'hsl(var(--color-neutral-100) / <alpha-value>)',
316
- tertiary: 'hsl(var(--color-neutral-200) / <alpha-value>)',
317
- 'primary-inverse': 'hsl(var(--color-neutral-900) / <alpha-value>)',
318
- 'secondary-inverse': 'hsl(var(--color-neutral-800) / <alpha-value>)',
319
- 'tertiary-inverse': 'hsl(var(--color-neutral-700) / <alpha-value>)',
320
- },
321
- accent: {
322
- 'brand-subtlest': 'hsl(var(--color-brand-000) / <alpha-value>)',
323
- 'brand-subtle': 'hsl(var(--color-brand-100) / <alpha-value>)',
324
- },
295
+ primary: 'hsl(var(--color-white) / <alpha-value>)',
296
+ secondary: 'hsl(var(--color-neutral-100) / <alpha-value>)',
297
+ overlay: 'hsl(var(--color-black) / 50%)',
325
298
  },
326
- bg: {
327
- white: 'hsl(var(--color-neutral-000) / <alpha-value>)',
328
- disabled: 'hsl(var(--color-neutral-400) / <alpha-value>)',
329
- default: 'hsl(var(--color-neutral-200) / <alpha-value>)',
330
- 'default-hover': 'hsl(var(--color-neutral-400) / <alpha-value>)',
331
- 'default-pressed': 'hsl(var(--color-neutral-600) / <alpha-value>)',
332
- subtle: 'hsl(var(--color-neutral-100) / <alpha-value>)',
333
- 'subtle-hover': 'hsl(var(--color-neutral-200) / <alpha-value>)',
334
- 'subtle-pressed': 'hsl(var(--color-neutral-400) / <alpha-value>)',
335
- bolder: 'hsl(var(--color-neutral-800) / <alpha-value>)',
336
- 'bolder-hover': 'hsl(var(--color-neutral-900) / <alpha-value>)',
337
- 'bolder-pressed': 'hsl(var(--color-neutral-900) / <alpha-value>)',
299
+ background: {
300
+ transparent: 'transparent',
301
+ white: 'hsl(var(--color-white) / <alpha-value>)',
302
+ black: 'hsl(var(--color-black) / <alpha-value>)',
303
+ neutral: 'hsl(var(--color-neutral-050) / <alpha-value>)',
304
+ disabled: 'hsl(var(--color-neutral-100) / <alpha-value>)',
338
305
  'brand-subtle': 'hsl(var(--color-brand-000) / <alpha-value>)',
339
- 'brand-subtle-hover': 'hsl(var(--color-brand-200) / <alpha-value>)',
340
- 'brand-subtle-pressed': 'hsl(var(--color-brand-400) / <alpha-value>)',
341
306
  brand: 'hsl(var(--color-brand-500) / <alpha-value>)',
342
- 'brand-hover': 'hsl(var(--color-brand-700) / <alpha-value>)',
343
- 'brand-pressed': 'hsl(var(--color-brand-900) / <alpha-value>)',
344
- accent: {
345
- 'blue-subtle': 'hsl(var(--color-blue-000) / <alpha-value>)',
346
- 'blue-subtle-hover': 'hsl(var(--color-blue-200) / <alpha-value>)',
347
- 'blue-subtle-pressed': 'hsl(var(--color-blue-400) / <alpha-value>)',
348
- blue: 'hsl(var(--color-blue-500) / <alpha-value>)',
349
- 'blue-hover': 'hsl(var(--color-blue-700) / <alpha-value>)',
350
- 'blue-pressed': 'hsl(var(--color-blue-900) / <alpha-value>)',
351
- 'mustard-subtle': 'hsl(var(--color-mustard-000) / <alpha-value>)',
352
- 'mustard-subtle-hover':
353
- 'hsl(var(--color-mustard-200) / <alpha-value>)',
354
- 'mustard-subtle-pressed':
355
- 'hsl(var(--color-mustard-500) / <alpha-value>)',
356
- mustard: 'hsl(var(--color-mustard-500) / <alpha-value>)',
357
- 'mustard-hover': 'hsl(var(--color-mustard-700) / <alpha-value>)',
358
- 'mustard-pressed': 'hsl(var(--color-mustard-900) / <alpha-value>)',
359
- 'green-subtle': 'hsl(var(--color-green-000) / <alpha-value>)',
360
- 'green-subtle-hover': 'hsl(var(--color-green-200) / <alpha-value>)',
361
- 'green-subtle-pressed': 'hsl(var(--color-green-500) / <alpha-value>)',
362
- green: 'hsl(var(--color-green-500) / <alpha-value>)',
363
- 'green-hover': 'hsl(var(--color-green-700) / <alpha-value>)',
364
- 'green-pressed': 'hsl(var(--color-green-900) / <alpha-value>)',
365
- 'lime-subtle': 'hsl(var(--color-lime-000) / <alpha-value>)',
366
- 'lime-subtle-hover': 'hsl(var(--color-lime-200) / <alpha-value>)',
367
- 'lime-subtle-pressed': 'hsl(var(--color-lime-500) / <alpha-value>)',
368
- lime: 'hsl(var(--color-lime-500) / <alpha-value>)',
369
- 'lime-hover': 'hsl(var(--color-lime-700) / <alpha-value>)',
370
- 'lime-pressed': 'hsl(var(--color-lime-900) / <alpha-value>)',
371
- 'fuchsia-subtle': 'hsl(var(--color-fuchsia-000) / <alpha-value>)',
372
- 'fuchsia-subtle-hover':
373
- 'hsl(var(--color-fuchsia-200) / <alpha-value>)',
374
- 'fuchsia-subtle-pressed':
375
- 'hsl(var(--color-fuchsia-500) / <alpha-value>)',
376
- fuchsia: 'hsl(var(--color-fuchsia-500) / <alpha-value>)',
377
- 'fuchsia-hover': 'hsl(var(--color-fuchsia-700) / <alpha-value>)',
378
- 'fuchsia-pressed': 'hsl(var(--color-fuchsia-900) / <alpha-value>)',
379
- 'marine-subtle': 'hsl(var(--color-marine-000) / <alpha-value>)',
380
- 'marine-subtle-hover': 'hsl(var(--color-marine-200) / <alpha-value>)',
381
- 'marine-subtle-pressed':
382
- 'hsl(var(--color-marine-500) / <alpha-value>)',
383
- marine: 'hsl(var(--color-marine-500) / <alpha-value>)',
384
- 'marine-hover': 'hsl(var(--color-marine-700) / <alpha-value>)',
385
- 'marine-pressed': 'hsl(var(--color-marine-500) / <alpha-value>)',
386
- 'violet-subtle': 'hsl(var(--color-violet-000) / <alpha-value>)',
387
- 'violet-subtle-hover': 'hsl(var(--color-violet-200) / <alpha-value>)',
388
- 'violet-subtle-pressed':
389
- 'hsl(var(--color-violet-500) / <alpha-value>)',
390
- violet: 'hsl(var(--color-violet-500) / <alpha-value>)',
391
- 'violet-hover': 'hsl(var(--color-violet-700) / <alpha-value>)',
392
- 'violet-pressed': 'hsl(var(--color-violet-900) / <alpha-value>)',
393
- 'gray-subtle': 'hsl(var(--color-gray-000) / <alpha-value>)',
394
- 'gray-subtle-hover': 'hsl(var(--color-gray-200) / <alpha-value>)',
395
- 'gray-subtle-pressed': 'hsl(var(--color-gray-500) / <alpha-value>)',
396
- gray: 'hsl(var(--color-gray-500) / <alpha-value>)',
397
- 'gray-hover': 'hsl(var(--color-gray-700) / <alpha-value>)',
398
- 'gray-pressed': 'hsl(var(--color-gray-900) / <alpha-value>)',
399
- 'ice-subtle': 'hsl(var(--color-ice-000) / <alpha-value>)',
400
- 'ice-subtle-hover': 'hsl(var(--color-ice-200) / <alpha-value>)',
401
- 'ice-subtle-pressed': 'hsl(var(--color-ice-500) / <alpha-value>)',
402
- ice: 'hsl(var(--color-ice-500) / <alpha-value>)',
403
- 'ice-hover': 'hsl(var(--color-ice-700) / <alpha-value>)',
404
- 'ice-pressed': 'hsl(var(--color-ice-900) / <alpha-value>)',
405
- },
307
+ 'blue-subtle': 'hsl(var(--color-blue-000) / <alpha-value>)',
308
+ blue: 'hsl(var(--color-blue-500) / <alpha-value>)',
309
+ 'yellow-subtle': 'hsl(var(--color-yellow-000) / <alpha-value>)',
310
+ yellow: 'hsl(var(--color-yellow-500) / <alpha-value>)',
406
311
  utility: {
407
- danger: 'hsl(var(--color-fuchsia-000) / <alpha-value>)',
408
- 'danger-hover': 'hsl(var(--color-fuchsia-300) / <alpha-value>)',
409
- 'danger-pressed': 'hsl(var(--color-fuchsia-500) / <alpha-value>)',
410
- 'danger-bolder': 'hsl(var(--color-fuchsia-500) / <alpha-value>)',
411
- 'danger-bolder-hover':
412
- 'hsl(var(--color-fuchsia-700) / <alpha-value>)',
413
- 'danger-bolder-pressed':
414
- 'hsl(var(--color-fuchsia-900) / <alpha-value>)',
415
- warning: 'hsl(var(--color-mustard-000) / <alpha-value>)',
416
- 'warning-hover': 'hsl(var(--color-mustard-300) / <alpha-value>)',
417
- 'warning-pressed': 'hsl(var(--color-mustard-500) / <alpha-value>)',
418
- 'warning-bolder': 'hsl(var(--color-mustard-500) / <alpha-value>)',
419
- 'warning-bolder-hover':
420
- 'hsl(var(--color-mustard-700) / <alpha-value>)',
421
- 'warning-bolder-pressed':
422
- 'hsl(var(--color-mustard-900) / <alpha-value>)',
423
- success: 'hsl(var(--color-lime-000) / <alpha-value>)',
424
- 'success-hover': 'hsl(var(--color-lime-200) / <alpha-value>)',
425
- 'success-pressed': 'hsl(var(--color-lime-500) / <alpha-value>)',
426
- 'success-bolder': 'hsl(var(--color-lime-500) / <alpha-value>)',
427
- 'success-bolder-hover': 'hsl(var(--color-lime-700) / <alpha-value>)',
428
- 'success-bolder-pressed':
429
- 'hsl(var(--color-lime-900) / <alpha-value>)',
430
- discovery: 'hsl(var(--color-violet-000) / <alpha-value>)',
431
- 'discovery-hover': 'hsl(var(--color-violet-300) / <alpha-value>)',
432
- 'discovery-pressed': 'hsl(var(--color-violet-500) / <alpha-value>)',
433
- 'discovery-bolder': 'hsl(var(--color-violet-500) / <alpha-value>)',
434
- 'discovery-bolder-hover':
435
- 'hsl(var(--color-violet-700) / <alpha-value>)',
436
- 'discovery-bolder-pressed':
437
- 'hsl(var(--color-violet-900) / <alpha-value>)',
438
- informative: 'hsl(var(--color-marine-000) / <alpha-value>)',
439
- 'informative-hover': 'hsl(var(--color-marine-300) / <alpha-value>)',
440
- 'informative-pressed': 'hsl(var(--color-marine-500) / <alpha-value>)',
441
- 'informative-bolder': 'hsl(var(--color-marine-500) / <alpha-value>)',
442
- 'informative-bolder-hover':
443
- 'hsl(var(--color-marine-700) / <alpha-value>)',
444
- 'informative-bolder-pressed':
445
- 'hsl(var(--color-marine-900) / <alpha-value>)',
312
+ 'error-light': 'hsl(var(--color-error-light) / <alpha-value>)',
313
+ error: 'hsl(var(--color-error-main) / <alpha-value>)',
314
+ 'warning-light': 'hsl(var(--color-warning-light) / <alpha-value>)',
315
+ warning: 'hsl(var(--color-warning-main) / <alpha-value>)',
316
+ 'info-light': 'hsl(var(--color-info-light) / <alpha-value>)',
317
+ info: 'hsl(var(--color-info-main) / <alpha-value>)',
318
+ 'success-light': 'hsl(var(--color-success-light) / <alpha-value>)',
319
+ success: 'hsl(var(--color-success-main) / <alpha-value>)',
446
320
  },
447
321
  },
448
322
  border: {
449
- subtlest: 'hsl(var(--color-neutral-500) / <alpha-value>)',
450
- subtle: 'hsl(var(--color-neutral-700) / <alpha-value>)',
451
- bolder: 'hsl(var(--color-neutral-900) / <alpha-value>)',
452
- brand: 'hsl(var(--color-brand-500) / <alpha-value>)',
453
- disabled: 'hsl(var(--color-neutral-400) / <alpha-value>)',
454
- focused: 'hsl(var(--color-blue-900) / <alpha-value>)',
455
- 'inversed-subtlest': 'hsl(var(--color-neutral-400) / <alpha-value>)',
456
- 'inversed-subtle': 'hsl(var(--color-neutral-200) / <alpha-value>)',
457
- 'inversed-bolder': 'hsl(var(--color-neutral-000) / <alpha-value>)',
458
323
  transparent: 'transparent',
459
- accent: {
460
- blue: 'hsl(var(--color-blue-500) / <alpha-value>)',
461
- mustard: 'hsl(var(--color-mustard-500) / <alpha-value>)',
462
- green: 'hsl(var(--color-green-500) / <alpha-value>)',
463
- lime: 'hsl(var(--color-lime-500) / <alpha-value>)',
464
- fuchsia: 'hsl(var(--color-fuchsia-500) / <alpha-value>)',
465
- marine: 'hsl(var(--color-marine-500) / <alpha-value>)',
466
- violet: 'hsl(var(--color-violet-500) / <alpha-value>)',
467
- gray: 'hsl(var(--color-gray-500) / <alpha-value>)',
468
- ice: 'hsl(var(--color-ice-500) / <alpha-value>)',
469
- },
324
+ subtle: 'hsl(var(--color-neutral-100) / <alpha-value>)',
325
+ default: 'hsl(var(--color-neutral-300) / <alpha-value>)',
326
+ bolder: 'hsl(var(--color-neutral-500) / <alpha-value>)',
327
+ 'brand-subtle': 'hsl(var(--color-brand-100) / <alpha-value>)',
328
+ brand: 'hsl(var(--color-brand-300) / <alpha-value>)',
329
+ 'brand-bolder': 'hsl(var(--color-brand-500) / <alpha-value>)',
330
+ 'blue-subtle': 'hsl(var(--color-blue-100) / <alpha-value>)',
331
+ blue: 'hsl(var(--color-blue-300) / <alpha-value>)',
332
+ 'blue-bolder': 'hsl(var(--color-blue-500) / <alpha-value>)',
333
+ 'yellow-subtle': 'hsl(var(--color-yellow-100) / <alpha-value>)',
334
+ yellow: 'hsl(var(--color-yellow-300) / <alpha-value>)',
335
+ 'yellow-bolder': 'hsl(var(--color-yellow-500) / <alpha-value>)',
470
336
  utility: {
471
- danger: 'hsl(var(--color-fuchsia-900) / <alpha-value>)',
472
- success: 'hsl(var(--color-lime-500) / <alpha-value>)',
473
- discovery: 'hsl(var(--color-violet-500) / <alpha-value>)',
474
- informative: 'hsl(var(--color-marine-500) / <alpha-value>)',
475
- warning: 'hsl(var(--color-mustard-500) / <alpha-value>)',
337
+ warning: 'hsl(var(--color-warning-main) / <alpha-value>)',
338
+ error: 'hsl(var(--color-error-main) / <alpha-value>)',
339
+ success: 'hsl(var(--color-success-main) / <alpha-value>)',
340
+ info: 'hsl(var(--color-info-main) / <alpha-value>)',
476
341
  },
477
342
  },
478
343
  },
@@ -496,13 +361,13 @@ module.exports = {
496
361
  lg: '4px',
497
362
  },
498
363
  boxShadow: {
499
- xs: '0px 1px 2px 0px rgba(16, 24, 40, 0.04), 0px 1px 2px 0px rgba(16, 24, 40, 0.04)',
500
- sm: '0px 2px 6px 0px rgba(16, 24, 40, 0.06)',
501
- md: '0px 6px 15px -2px rgba(16, 24, 40, 0.08), 0px 6px 15px -2px rgba(16, 24, 40, 0.08)',
502
- lg: '0px 8px 24px -3px rgba(16, 24, 40, 0.05), 0px 8px 24px -3px rgba(16, 24, 40, 0.10)',
503
- xl: '0px 20px 40px -8px rgba(16, 24, 40, 0.05), 0px 20px 40px -8px rgba(16, 24, 40, 0.10)',
364
+ xs: '0px 2px 4px 0px rgba(25, 25, 25, 0.08), 0px 0px 2px 0px rgba(25, 25, 25, 0.08)',
365
+ sm: '0px 4px 8px 0px rgba(25, 25, 25, 0.10), 0px 0px 4px 0px rgba(0, 0, 0, 0.08)',
366
+ md: '0px 8px 16px 0px rgba(25, 25, 25, 0.10), 0px 0px 6px 0px rgba(25, 25, 25, 0.08)',
367
+ lg: '0px 10px 20px 0px rgba(0, 0, 0, 0.19), 0px 0px 8px 0px rgba(25, 25, 25, 0.08)',
368
+ xl: '0px 12px 24px 0px rgba(25, 25, 25, 0.10), 0px 0px 10px 0px rgba(25, 25, 25, 0.08)',
504
369
  '2xl':
505
- '0px 25px 60px -15px rgba(16, 24, 40, 0.12), 0px 25px 60px -15px rgba(16, 24, 40, 0.20)',
370
+ '0px 16px 32px 0px rgba(25, 25, 25, 0.10), 0px 0px 12px 0px rgba(25, 25, 25, 0.08)',
506
371
  },
507
372
  extend: {
508
373
  padding: {