@clayui/css 3.39.0 → 3.42.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.
Files changed (109) hide show
  1. package/lib/css/atlas.css +1127 -1387
  2. package/lib/css/atlas.css.map +1 -1
  3. package/lib/css/base.css +908 -1138
  4. package/lib/css/base.css.map +1 -1
  5. package/lib/css/bootstrap.css.map +1 -1
  6. package/lib/css/cadmin.css +1021 -1148
  7. package/lib/css/cadmin.css.map +1 -1
  8. package/lib/images/icons/filter.svg +1 -1
  9. package/lib/images/icons/icons.svg +1 -1
  10. package/package.json +2 -2
  11. package/src/images/icons/filter.svg +1 -1
  12. package/src/scss/_mixins.scss +2 -0
  13. package/src/scss/atlas/variables/_alerts.scss +10 -0
  14. package/src/scss/atlas/variables/_application-bar.scss +32 -12
  15. package/src/scss/atlas/variables/_breadcrumbs.scss +4 -2
  16. package/src/scss/atlas/variables/_cards.scss +2 -2
  17. package/src/scss/atlas/variables/_dropdowns.scss +179 -12
  18. package/src/scss/atlas/variables/_forms.scss +33 -1
  19. package/src/scss/atlas/variables/_globals.scss +13 -0
  20. package/src/scss/atlas/variables/_labels.scss +88 -56
  21. package/src/scss/atlas/variables/_management-bar.scss +53 -21
  22. package/src/scss/atlas/variables/_navigation-bar.scss +104 -18
  23. package/src/scss/atlas/variables/_navs.scss +20 -8
  24. package/src/scss/atlas/variables/_pagination.scss +4 -2
  25. package/src/scss/atlas/variables/_sheets.scss +4 -2
  26. package/src/scss/atlas/variables/_sidebar.scss +1 -1
  27. package/src/scss/atlas/variables/_tables.scss +58 -28
  28. package/src/scss/cadmin/components/_alerts.scss +1 -17
  29. package/src/scss/cadmin/components/_cards.scss +12 -14
  30. package/src/scss/cadmin/components/_dropdowns.scss +66 -196
  31. package/src/scss/cadmin/components/_form-validation.scss +10 -237
  32. package/src/scss/cadmin/components/_icons.scss +1 -6
  33. package/src/scss/cadmin/components/_input-groups.scss +17 -14
  34. package/src/scss/cadmin/components/_pagination.scss +20 -236
  35. package/src/scss/cadmin/components/_popovers.scss +31 -252
  36. package/src/scss/cadmin/components/_reboot.scss +1 -8
  37. package/src/scss/cadmin/components/_toggle-switch.scss +20 -358
  38. package/src/scss/cadmin/components/_tooltip.scss +29 -167
  39. package/src/scss/cadmin/components/_type.scss +9 -1
  40. package/src/scss/cadmin/variables/_alerts.scss +35 -11
  41. package/src/scss/cadmin/variables/_breadcrumbs.scss +10 -6
  42. package/src/scss/cadmin/variables/_cards.scss +91 -23
  43. package/src/scss/cadmin/variables/_dropdowns.scss +440 -71
  44. package/src/scss/cadmin/variables/_forms.scss +353 -2
  45. package/src/scss/cadmin/variables/_globals.scss +14 -0
  46. package/src/scss/cadmin/variables/_icons.scss +15 -2
  47. package/src/scss/cadmin/variables/_labels.scss +104 -72
  48. package/src/scss/cadmin/variables/_links.scss +9 -7
  49. package/src/scss/cadmin/variables/_management-bar.scss +70 -30
  50. package/src/scss/cadmin/variables/_navigation-bar.scss +118 -22
  51. package/src/scss/cadmin/variables/_pagination.scss +274 -68
  52. package/src/scss/cadmin/variables/_popovers.scss +410 -0
  53. package/src/scss/cadmin/variables/_sidebar.scss +17 -5
  54. package/src/scss/cadmin/variables/_toggle-switch.scss +404 -1
  55. package/src/scss/cadmin/variables/_tooltip.scss +299 -0
  56. package/src/scss/cadmin/variables/_type.scss +3 -0
  57. package/src/scss/components/_alerts.scss +5 -17
  58. package/src/scss/components/_button-groups.scss +6 -6
  59. package/src/scss/components/_cards.scss +5 -5
  60. package/src/scss/components/_dropdowns.scss +52 -200
  61. package/src/scss/components/_form-validation.scss +8 -237
  62. package/src/scss/components/_forms.scss +61 -4
  63. package/src/scss/components/_icons.scss +4 -9
  64. package/src/scss/components/_input-groups.scss +17 -14
  65. package/src/scss/components/_multi-step-nav.scss +12 -8
  66. package/src/scss/components/_pagination.scss +18 -234
  67. package/src/scss/components/_popovers.scss +30 -237
  68. package/src/scss/components/_reboot.scss +3 -39
  69. package/src/scss/components/_toggle-switch.scss +36 -351
  70. package/src/scss/components/_tooltip.scss +29 -164
  71. package/src/scss/components/_type.scss +9 -1
  72. package/src/scss/functions/_global-functions.scss +18 -0
  73. package/src/scss/functions/_lx-icons-generated.scss +1 -1
  74. package/src/scss/mixins/_alerts.scss +25 -0
  75. package/src/scss/mixins/_buttons.scss +827 -384
  76. package/src/scss/mixins/_cards.scss +610 -114
  77. package/src/scss/mixins/_close.scss +0 -1
  78. package/src/scss/mixins/_custom-forms.scss +46 -34
  79. package/src/scss/mixins/_dropdown-menu.scss +139 -53
  80. package/src/scss/mixins/_forms.scss +686 -252
  81. package/src/scss/mixins/_globals.scss +244 -234
  82. package/src/scss/mixins/_labels.scss +1 -1
  83. package/src/scss/mixins/_links.scss +795 -329
  84. package/src/scss/mixins/_navbar.scss +759 -140
  85. package/src/scss/mixins/_pagination.scss +422 -0
  86. package/src/scss/mixins/_popovers.scss +90 -0
  87. package/src/scss/mixins/_toggle-switch.scss +1140 -14
  88. package/src/scss/mixins/_tooltip.scss +70 -0
  89. package/src/scss/variables/_alerts.scss +34 -10
  90. package/src/scss/variables/_application-bar.scss +18 -6
  91. package/src/scss/variables/_breadcrumbs.scss +8 -4
  92. package/src/scss/variables/_cards.scss +40 -2
  93. package/src/scss/variables/_dropdowns.scss +570 -62
  94. package/src/scss/variables/_forms.scss +303 -1
  95. package/src/scss/variables/_globals.scss +53 -0
  96. package/src/scss/variables/_icons.scss +60 -9
  97. package/src/scss/variables/_labels.scss +120 -88
  98. package/src/scss/variables/_links.scss +15 -13
  99. package/src/scss/variables/_management-bar.scss +45 -12
  100. package/src/scss/variables/_navigation-bar.scss +95 -14
  101. package/src/scss/variables/_navs.scss +33 -13
  102. package/src/scss/variables/_pagination.scss +267 -65
  103. package/src/scss/variables/_popovers.scss +392 -0
  104. package/src/scss/variables/_sheets.scss +4 -2
  105. package/src/scss/variables/_sidebar.scss +17 -5
  106. package/src/scss/variables/_tables.scss +24 -8
  107. package/src/scss/variables/_toggle-switch.scss +404 -5
  108. package/src/scss/variables/_tooltip.scss +299 -0
  109. package/src/scss/variables/_type.scss +3 -0
@@ -232,30 +232,34 @@ $cadmin-alert-dismissible: map-deep-merge(
232
232
 
233
233
  // Alert Fluid
234
234
 
235
+ // @deprecated use the Sass map `$alert-fluid` instead
236
+
235
237
  $cadmin-alert-fluid-border-bottom-width: 1px !default;
238
+
239
+ // @deprecated use the Sass map `$alert-fluid` instead
240
+
236
241
  $cadmin-alert-fluid-border-left-width: 0 !default;
242
+
243
+ // @deprecated use the Sass map `$alert-fluid` instead
244
+
237
245
  $cadmin-alert-fluid-border-right-width: 0 !default;
246
+
247
+ // @deprecated use the Sass map `$alert-fluid` instead
248
+
238
249
  $cadmin-alert-fluid-border-top-width: 0 !default;
239
250
 
251
+ // @deprecated use the Sass map `$alert-fluid` instead
252
+
240
253
  $cadmin-alert-fluid-border-width: $cadmin-alert-fluid-border-top-width
241
254
  $cadmin-alert-fluid-border-right-width
242
255
  $cadmin-alert-fluid-border-bottom-width
243
256
  $cadmin-alert-fluid-border-left-width !default;
244
257
  $cadmin-alert-fluid-margin-bottom: 0 !default;
245
258
 
246
- $cadmin-alert-fluid: () !default;
247
- $cadmin-alert-fluid: map-merge(
248
- (
249
- border-radius: 0,
250
- border-width: $cadmin-alert-fluid-border-width,
251
- margin-bottom: $cadmin-alert-fluid-margin-bottom,
252
- padding: 0,
253
- ),
254
- $cadmin-alert-fluid
255
- );
256
-
257
259
  // .alert-fluid .container-fluid
258
260
 
261
+ // @deprecated use the Sass map `$alert-fluid` instead
262
+
259
263
  $cadmin-alert-fluid-container: () !default;
260
264
  $cadmin-alert-fluid-container: map-merge(
261
265
  (
@@ -269,6 +273,8 @@ $cadmin-alert-fluid-container: map-merge(
269
273
 
270
274
  // .alert-fluid.alert-dismissible .container-fluid
271
275
 
276
+ // @deprecated use the Sass map `$alert-fluid` instead
277
+
272
278
  $cadmin-alert-fluid-dismissible-container: () !default;
273
279
  $cadmin-alert-fluid-dismissible-container: map-merge(
274
280
  (
@@ -287,6 +293,8 @@ $cadmin-alert-fluid-dismissible-container: map-merge(
287
293
 
288
294
  // .alert-fluid .close
289
295
 
296
+ // @deprecated use the Sass map `$alert-fluid` instead
297
+
290
298
  $cadmin-alert-fluid-close: () !default;
291
299
  $cadmin-alert-fluid-close: map-deep-merge(
292
300
  (
@@ -295,6 +303,22 @@ $cadmin-alert-fluid-close: map-deep-merge(
295
303
  $cadmin-alert-fluid-close
296
304
  );
297
305
 
306
+ $cadmin-alert-fluid: () !default;
307
+ $cadmin-alert-fluid: map-merge(
308
+ (
309
+ border-radius: 0,
310
+ border-width: $cadmin-alert-fluid-border-width,
311
+ margin-bottom: $cadmin-alert-fluid-margin-bottom,
312
+ padding: 0,
313
+ alert-dismissible: (
314
+ container-fluid: $cadmin-alert-fluid-dismissible-container,
315
+ ),
316
+ close: $cadmin-alert-fluid-close,
317
+ container-fluid: $cadmin-alert-fluid-container,
318
+ ),
319
+ $cadmin-alert-fluid
320
+ );
321
+
298
322
  // .alert-notifications-absolute
299
323
 
300
324
  $cadmin-alert-notifications-absolute-bottom: null !default;
@@ -39,12 +39,16 @@ $cadmin-breadcrumb-link: map-deep-merge(
39
39
  text-decoration: $cadmin-breadcrumb-link-text-decoration,
40
40
  text-transform: $cadmin-breadcrumb-text-transform,
41
41
  transition: box-shadow 0.15s ease-in-out,
42
- hover-color: $cadmin-breadcrumb-link-hover-color,
43
- hover-text-decoration: $cadmin-breadcrumb-link-hover-text-decoration,
44
- focus-box-shadow: $cadmin-component-focus-box-shadow,
45
- focus-color: $cadmin-breadcrumb-link-hover-color,
46
- focus-outline: 0,
47
- focus-text-decoration: $cadmin-breadcrumb-link-hover-text-decoration,
42
+ hover: (
43
+ color: $cadmin-breadcrumb-link-hover-color,
44
+ text-decoration: $cadmin-breadcrumb-link-hover-text-decoration,
45
+ ),
46
+ focus: (
47
+ box-shadow: $cadmin-component-focus-box-shadow,
48
+ color: $cadmin-breadcrumb-link-hover-color,
49
+ outline: 0,
50
+ text-decoration: $cadmin-breadcrumb-link-hover-text-decoration,
51
+ ),
48
52
  ),
49
53
  $cadmin-breadcrumb-link
50
54
  );
@@ -1,7 +1,7 @@
1
1
  $cadmin-card-bg: $cadmin-white !default;
2
2
  $cadmin-card-border-color: rgba($cadmin-black, 0.125) !default;
3
3
  $cadmin-card-border-style: solid !default;
4
- $cadmin-card-border-width: 0 !default;
4
+ $cadmin-card-border-width: 0px !default;
5
5
 
6
6
  $cadmin-card-border-radius: $cadmin-border-radius !default;
7
7
  $cadmin-card-inner-border-radius: calc(
@@ -126,7 +126,9 @@ $cadmin-card-title-link: () !default;
126
126
  $cadmin-card-title-link: map-deep-merge(
127
127
  (
128
128
  color: map-get($cadmin-card-title, color),
129
- hover-color: map-get($cadmin-card-title, color),
129
+ hover: (
130
+ color: map-get($cadmin-card-title, color),
131
+ ),
130
132
  ),
131
133
  $cadmin-card-title-link
132
134
  );
@@ -149,7 +151,9 @@ $cadmin-card-subtitle-link: () !default;
149
151
  $cadmin-card-subtitle-link: map-deep-merge(
150
152
  (
151
153
  color: map-get($cadmin-card-subtitle, color),
152
- hover-color: $cadmin-gray-600,
154
+ hover: (
155
+ color: $cadmin-gray-600,
156
+ ),
153
157
  ),
154
158
  $cadmin-card-subtitle-link
155
159
  );
@@ -282,8 +286,54 @@ $cadmin-card-interactive-secondary: map-deep-merge(
282
286
  $cadmin-card-type-asset: () !default;
283
287
  $cadmin-card-type-asset: map-deep-merge(
284
288
  (
285
- aspect-ratio-border-color: $cadmin-gray-300,
286
- card-body-padding-top: 12px,
289
+ aspect-ratio: (
290
+ border-color: $cadmin-gray-300,
291
+ border-style: solid,
292
+ border-width: 0 0 1px 0,
293
+ horizontal: 16,
294
+ vertical: 9,
295
+ custom-control: (
296
+ label: (
297
+ bottom: 0,
298
+ cursor: $cadmin-link-cursor,
299
+ left: 0,
300
+ position: absolute,
301
+ right: 0,
302
+ top: 0,
303
+ ),
304
+ ),
305
+ ),
306
+ card-type-asset-icon: (
307
+ width: 22.225%,
308
+ inline-item: (
309
+ bottom: 0,
310
+ left: 0,
311
+ position: absolute,
312
+ right: 0,
313
+ top: 0,
314
+ ),
315
+ lexicon-icon: (
316
+ height: 100%,
317
+ width: 100%,
318
+ ),
319
+ sticker: (
320
+ border-radius: 50%,
321
+ display: block,
322
+ font-size: 2vw,
323
+ padding-bottom: 100%,
324
+ width: 100%,
325
+ ),
326
+ ),
327
+ card-body: (
328
+ padding-top: 12px,
329
+ ),
330
+ card-row: (
331
+ align-items: flex-start,
332
+ ),
333
+ dropdown-action: (
334
+ margin-right: -8px,
335
+ margin-top: -3px,
336
+ ),
287
337
  ),
288
338
  $cadmin-card-type-asset
289
339
  );
@@ -293,7 +343,9 @@ $cadmin-card-type-asset: map-deep-merge(
293
343
  $cadmin-image-card: () !default;
294
344
  $cadmin-image-card: map-deep-merge(
295
345
  (
296
- aspect-ratio-checkered-fg: $cadmin-gray-300,
346
+ aspect-ratio: (
347
+ checkered-foreground-color: $cadmin-gray-300,
348
+ ),
297
349
  ),
298
350
  $cadmin-image-card
299
351
  );
@@ -303,7 +355,9 @@ $cadmin-image-card: map-deep-merge(
303
355
  $cadmin-file-card: () !default;
304
356
  $cadmin-file-card: map-deep-merge(
305
357
  (
306
- asset-icon-color: $cadmin-gray-400,
358
+ card-type-asset-icon: (
359
+ color: $cadmin-gray-400,
360
+ ),
307
361
  ),
308
362
  $cadmin-file-card
309
363
  );
@@ -314,8 +368,8 @@ $cadmin-product-card: () !default;
314
368
  $cadmin-product-card: map-deep-merge(
315
369
  (
316
370
  aspect-ratio: (
317
- bg: $cadmin-white,
318
- bg-image: linear-gradient(0deg, #ebebeb, #ebebeb),
371
+ background-color: $cadmin-white,
372
+ background-image: linear-gradient(0deg, #ebebeb, #ebebeb),
319
373
  ),
320
374
  card-body: (
321
375
  text-align: center,
@@ -339,11 +393,15 @@ $cadmin-product-card: map-deep-merge(
339
393
  $cadmin-user-card: () !default;
340
394
  $cadmin-user-card: map-deep-merge(
341
395
  (
342
- asset-icon-max-width: 80px,
343
- asset-icon-min-width: 48px,
344
- asset-icon-width: 30%,
345
- asset-icon-lexicon-icon-height: auto,
346
- asset-icon-lexicon-icon-width: 50%,
396
+ card-type-asset-icon: (
397
+ max-width: 80px,
398
+ min-width: 48px,
399
+ width: 30%,
400
+ lexicon-icon: (
401
+ height: auto,
402
+ width: 50%,
403
+ ),
404
+ ),
347
405
  ),
348
406
  $cadmin-user-card
349
407
  );
@@ -415,7 +473,9 @@ $cadmin-card-page-item-user: map-deep-merge(
415
473
  $cadmin-card-type-directory: () !default;
416
474
  $cadmin-card-type-directory: map-deep-merge(
417
475
  (
418
- sticker-font-size: 18px,
476
+ sticker: (
477
+ font-size: 18px,
478
+ ),
419
479
  ),
420
480
  $cadmin-card-type-directory
421
481
  );
@@ -424,7 +484,7 @@ $cadmin-card-type-directory: map-deep-merge(
424
484
 
425
485
  $cadmin-card-page-item-directory: () !default;
426
486
  $cadmin-card-page-item-directory: map-deep-merge(
427
- ($cadmin-card-page-item-asset),
487
+ $cadmin-card-page-item-asset,
428
488
  $cadmin-card-page-item-directory
429
489
  );
430
490
 
@@ -443,14 +503,16 @@ $cadmin-card-type-template-after-highlight: map-deep-merge(
443
503
  $cadmin-card-type-template-aspect-ratio: () !default;
444
504
  $cadmin-card-type-template-aspect-ratio: map-deep-merge(
445
505
  (
446
- bg-image: none,
506
+ background-image: none,
447
507
  border-width: 0,
448
508
  color: $cadmin-gray-600,
449
509
  horizontal: 16,
450
510
  text-align: center,
451
511
  vertical: 9,
452
- lexicon-icon-height: auto,
453
- lexicon-icon-width: 28%,
512
+ lexicon-icon: (
513
+ height: auto,
514
+ width: 28%,
515
+ ),
454
516
  ),
455
517
  $cadmin-card-type-template-aspect-ratio
456
518
  );
@@ -487,7 +549,9 @@ $cadmin-card-type-template: map-deep-merge(
487
549
  border-width: 1px,
488
550
  box-shadow: none,
489
551
  color: $cadmin-gray-900,
490
- hover-color: $cadmin-gray-900,
552
+ hover: (
553
+ color: $cadmin-gray-900,
554
+ ),
491
555
  after-highlight: $cadmin-card-type-template-after-highlight,
492
556
  aspect-ratio: $cadmin-card-type-template-aspect-ratio,
493
557
  aspect-ratio-item: $cadmin-card-type-template-aspect-ratio-item,
@@ -532,8 +596,10 @@ $cadmin-template-card-horizontal-card-row: map-deep-merge(
532
596
  margin-left: -4px,
533
597
  margin-right: -4px,
534
598
  width: auto,
535
- autofit-col-padding-left: 4px,
536
- autofit-col-padding-right: 4px,
599
+ autofit-col: (
600
+ padding-left: 4px,
601
+ padding-right: 4px,
602
+ ),
537
603
  ),
538
604
  $cadmin-template-card-horizontal-card-row
539
605
  );
@@ -551,7 +617,9 @@ $cadmin-template-card-horizontal: () !default;
551
617
  $cadmin-template-card-horizontal: map-deep-merge(
552
618
  (
553
619
  color: $cadmin-gray-600,
554
- hover-color: $cadmin-gray-600,
620
+ hover: (
621
+ color: $cadmin-gray-600,
622
+ ),
555
623
  sticker: $cadmin-template-card-horizontal-sticker,
556
624
  card-row: $cadmin-template-card-horizontal-card-row,
557
625
  card-title: $cadmin-template-card-horizontal-card-title,