@clayui/css 3.60.1 → 3.62.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 (56) hide show
  1. package/lib/css/atlas.css +1589 -321
  2. package/lib/css/atlas.css.map +1 -1
  3. package/lib/css/base.css +1108 -205
  4. package/lib/css/base.css.map +1 -1
  5. package/lib/css/cadmin.css +1331 -319
  6. package/lib/css/cadmin.css.map +1 -1
  7. package/lib/images/icons/icons.svg +1 -1
  8. package/package.json +2 -2
  9. package/src/scss/_license-text.scss +1 -1
  10. package/src/scss/atlas/variables/_globals.scss +10 -30
  11. package/src/scss/atlas/variables/_sidebar.scss +27 -17
  12. package/src/scss/cadmin/components/_forms.scss +10 -0
  13. package/src/scss/cadmin/components/_input-groups.scss +9 -0
  14. package/src/scss/cadmin/components/_side-navigation.scss +3 -0
  15. package/src/scss/cadmin/components/_sidebar.scss +10 -10
  16. package/src/scss/cadmin/components/_type.scss +5 -4
  17. package/src/scss/cadmin/variables/_forms.scss +31 -19
  18. package/src/scss/cadmin/variables/_globals.scss +10 -30
  19. package/src/scss/cadmin/variables/_loaders.scss +1 -0
  20. package/src/scss/cadmin/variables/_sidebar.scss +140 -54
  21. package/src/scss/cadmin/variables/_type.scss +14 -0
  22. package/src/scss/components/_forms.scss +10 -0
  23. package/src/scss/components/_input-groups.scss +9 -0
  24. package/src/scss/components/_side-navigation.scss +2 -0
  25. package/src/scss/components/_sidebar.scss +10 -10
  26. package/src/scss/components/_type.scss +5 -4
  27. package/src/scss/functions/_global-functions.scss +137 -41
  28. package/src/scss/mixins/_alerts.scss +26 -0
  29. package/src/scss/mixins/_badges.scss +9 -7
  30. package/src/scss/mixins/_border-radius.scss +78 -57
  31. package/src/scss/mixins/_box-shadow.scss +9 -7
  32. package/src/scss/mixins/_breakpoints.scss +44 -4
  33. package/src/scss/mixins/_buttons.scss +21 -22
  34. package/src/scss/mixins/_cards.scss +12 -2
  35. package/src/scss/mixins/_close.scss +9 -7
  36. package/src/scss/mixins/_dropdown-menu.scss +9 -7
  37. package/src/scss/mixins/_forms.scss +29 -1
  38. package/src/scss/mixins/_gradients.scss +18 -10
  39. package/src/scss/mixins/_grid.scss +9 -7
  40. package/src/scss/mixins/_input-groups.scss +0 -6
  41. package/src/scss/mixins/_labels.scss +15 -8
  42. package/src/scss/mixins/_links.scss +9 -7
  43. package/src/scss/mixins/_list-group.scss +117 -21
  44. package/src/scss/mixins/_menubar.scss +117 -22
  45. package/src/scss/mixins/_navbar.scss +95 -132
  46. package/src/scss/mixins/_panels.scss +280 -269
  47. package/src/scss/mixins/_scale-component.scss +10 -2
  48. package/src/scss/mixins/_sidebar.scss +311 -185
  49. package/src/scss/mixins/_stickers.scss +143 -134
  50. package/src/scss/mixins/_tbar.scss +15 -36
  51. package/src/scss/mixins/_timelines.scss +20 -4
  52. package/src/scss/variables/_forms.scss +31 -19
  53. package/src/scss/variables/_globals.scss +7 -21
  54. package/src/scss/variables/_loaders.scss +1 -0
  55. package/src/scss/variables/_sidebar.scss +123 -44
  56. package/src/scss/variables/_type.scss +14 -0
@@ -3,17 +3,24 @@
3
3
  if(
4
4
  variable-exists(border-radius),
5
5
  $border-radius,
6
- $cadmin-border-radius
6
+ if
7
+ (
8
+ variable-exists(cadmin-border-radius),
9
+ $cadmin-border-radius,
10
+ 0.25rem
11
+ )
7
12
  ),
8
13
  $fallback-border-radius: false
9
14
  ) {
10
- $enable: setter(
11
- if(
12
- variable-exists(enable-rounded),
13
- $enable-rounded,
14
- $cadmin-enable-rounded
15
- ),
16
- true
15
+ $enable: if(
16
+ variable-exists(enable-rounded),
17
+ $enable-rounded,
18
+ if
19
+ (
20
+ variable-exists(cadmin-enable-rounded),
21
+ $cadmin-enable-rounded,
22
+ true
23
+ )
17
24
  );
18
25
 
19
26
  @if ($enable) {
@@ -24,13 +31,15 @@
24
31
  }
25
32
 
26
33
  @mixin border-top-radius($radius) {
27
- $enable: setter(
28
- if(
29
- variable-exists(enable-rounded),
30
- $enable-rounded,
31
- $cadmin-enable-rounded
32
- ),
33
- true
34
+ $enable: if(
35
+ variable-exists(enable-rounded),
36
+ $enable-rounded,
37
+ if
38
+ (
39
+ variable-exists(cadmin-enable-rounded),
40
+ $cadmin-enable-rounded,
41
+ true
42
+ )
34
43
  );
35
44
 
36
45
  @if ($enable) {
@@ -40,13 +49,15 @@
40
49
  }
41
50
 
42
51
  @mixin border-right-radius($radius) {
43
- $enable: setter(
44
- if(
45
- variable-exists(enable-rounded),
46
- $enable-rounded,
47
- $cadmin-enable-rounded
48
- ),
49
- true
52
+ $enable: if(
53
+ variable-exists(enable-rounded),
54
+ $enable-rounded,
55
+ if
56
+ (
57
+ variable-exists(cadmin-enable-rounded),
58
+ $cadmin-enable-rounded,
59
+ true
60
+ )
50
61
  );
51
62
 
52
63
  @if ($enable) {
@@ -56,13 +67,15 @@
56
67
  }
57
68
 
58
69
  @mixin border-bottom-radius($radius) {
59
- $enable: setter(
60
- if(
61
- variable-exists(enable-rounded),
62
- $enable-rounded,
63
- $cadmin-enable-rounded
64
- ),
65
- true
70
+ $enable: if(
71
+ variable-exists(enable-rounded),
72
+ $enable-rounded,
73
+ if
74
+ (
75
+ variable-exists(cadmin-enable-rounded),
76
+ $cadmin-enable-rounded,
77
+ true
78
+ )
66
79
  );
67
80
 
68
81
  @if ($enable) {
@@ -72,13 +85,15 @@
72
85
  }
73
86
 
74
87
  @mixin border-left-radius($radius) {
75
- $enable: setter(
76
- if(
77
- variable-exists(enable-rounded),
78
- $enable-rounded,
79
- $cadmin-enable-rounded
80
- ),
81
- true
88
+ $enable: if(
89
+ variable-exists(enable-rounded),
90
+ $enable-rounded,
91
+ if
92
+ (
93
+ variable-exists(cadmin-enable-rounded),
94
+ $cadmin-enable-rounded,
95
+ true
96
+ )
82
97
  );
83
98
 
84
99
  @if ($enable) {
@@ -88,13 +103,15 @@
88
103
  }
89
104
 
90
105
  @mixin border-top-left-radius($radius) {
91
- $enable: setter(
92
- if(
93
- variable-exists(enable-rounded),
94
- $enable-rounded,
95
- $cadmin-enable-rounded
96
- ),
97
- true
106
+ $enable: if(
107
+ variable-exists(enable-rounded),
108
+ $enable-rounded,
109
+ if
110
+ (
111
+ variable-exists(cadmin-enable-rounded),
112
+ $cadmin-enable-rounded,
113
+ true
114
+ )
98
115
  );
99
116
 
100
117
  @if ($enable) {
@@ -118,13 +135,15 @@
118
135
  }
119
136
 
120
137
  @mixin border-bottom-right-radius($radius) {
121
- $enable: setter(
122
- if(
123
- variable-exists(enable-rounded),
124
- $enable-rounded,
125
- $cadmin-enable-rounded
126
- ),
127
- true
138
+ $enable: if(
139
+ variable-exists(enable-rounded),
140
+ $enable-rounded,
141
+ if
142
+ (
143
+ variable-exists(cadmin-enable-rounded),
144
+ $cadmin-enable-rounded,
145
+ true
146
+ )
128
147
  );
129
148
 
130
149
  @if ($enable) {
@@ -133,13 +152,15 @@
133
152
  }
134
153
 
135
154
  @mixin border-bottom-left-radius($radius) {
136
- $enable: setter(
137
- if(
138
- variable-exists(enable-rounded),
139
- $enable-rounded,
140
- $cadmin-enable-rounded
141
- ),
142
- true
155
+ $enable: if(
156
+ variable-exists(enable-rounded),
157
+ $enable-rounded,
158
+ if
159
+ (
160
+ variable-exists(cadmin-enable-rounded),
161
+ $cadmin-enable-rounded,
162
+ true
163
+ )
143
164
  );
144
165
 
145
166
  @if ($enable) {
@@ -6,13 +6,15 @@
6
6
  /// @param {Arglist} $shadow
7
7
 
8
8
  @mixin box-shadow($shadow...) {
9
- $enable: setter(
10
- if(
11
- variable-exists(enable-shadows),
12
- $enable-shadows,
13
- $cadmin-enable-shadows
14
- ),
15
- true
9
+ $enable: if(
10
+ variable-exists(enable-shadows),
11
+ $enable-shadows,
12
+ if
13
+ (
14
+ variable-exists(cadmin-enable-shadows),
15
+ $cadmin-enable-shadows,
16
+ true
17
+ )
16
18
  );
17
19
 
18
20
  @if ($enable) {
@@ -12,7 +12,17 @@
12
12
  if(
13
13
  variable-exists(grid-breakpoints),
14
14
  $grid-breakpoints,
15
- $cadmin-grid-breakpoints
15
+ if(
16
+ variable-exists(cadmin-grid-breakpoints),
17
+ $cadmin-grid-breakpoints,
18
+ (
19
+ xs: 0,
20
+ sm: 576px,
21
+ md: 768px,
22
+ lg: 992px,
23
+ xl: 1280px,
24
+ )
25
+ )
16
26
  )
17
27
  );
18
28
 
@@ -37,7 +47,17 @@
37
47
  if(
38
48
  variable-exists(grid-breakpoints),
39
49
  $grid-breakpoints,
40
- $cadmin-grid-breakpoints
50
+ if(
51
+ variable-exists(cadmin-grid-breakpoints),
52
+ $cadmin-grid-breakpoints,
53
+ (
54
+ xs: 0,
55
+ sm: 576px,
56
+ md: 768px,
57
+ lg: 992px,
58
+ xl: 1280px,
59
+ )
60
+ )
41
61
  )
42
62
  );
43
63
 
@@ -63,7 +83,17 @@
63
83
  if(
64
84
  variable-exists(grid-breakpoints),
65
85
  $grid-breakpoints,
66
- $cadmin-grid-breakpoints
86
+ if(
87
+ variable-exists(cadmin-grid-breakpoints),
88
+ $cadmin-grid-breakpoints,
89
+ (
90
+ xs: 0,
91
+ sm: 576px,
92
+ md: 768px,
93
+ lg: 992px,
94
+ xl: 1280px,
95
+ )
96
+ )
67
97
  )
68
98
  );
69
99
 
@@ -95,7 +125,17 @@
95
125
  if(
96
126
  variable-exists(grid-breakpoints),
97
127
  $grid-breakpoints,
98
- $cadmin-grid-breakpoints
128
+ if(
129
+ variable-exists(cadmin-grid-breakpoints),
130
+ $cadmin-grid-breakpoints,
131
+ (
132
+ xs: 0,
133
+ sm: 576px,
134
+ md: 768px,
135
+ lg: 992px,
136
+ xl: 1280px,
137
+ )
138
+ )
99
139
  )
100
140
  );
101
141
 
@@ -553,13 +553,16 @@
553
553
  $mobile-c-inner: map-merge(
554
554
  (
555
555
  enabled:
556
- setter(
557
- if(
558
- variable-exists(enable-c-inner),
559
- $enable-c-inner,
560
- $cadmin-enable-c-inner
561
- ),
562
- true
556
+ if(
557
+ variable-exists(enable-c-inner),
558
+ $enable-c-inner,
559
+ $cadmin-enable-c-inner
560
+ if
561
+ (
562
+ variable-exists(cadmin-enable-c-inner),
563
+ $cadmin-enable-c-inner,
564
+ true
565
+ )
563
566
  ),
564
567
  margin-bottom: math-sign(map-get($mobile, padding-bottom)),
565
568
  margin-left: math-sign(map-get($mobile, padding-left)),
@@ -569,28 +572,24 @@
569
572
  $mobile-c-inner
570
573
  );
571
574
 
572
- $unset: setter(
573
- if(
574
- variable-exists(clay-unset-placeholder),
575
- $clay-unset-placeholder,
576
- $cadmin-clay-unset-placeholder
577
- ),
575
+ $loading-animation: setter(
576
+ map-get($map, loading-animation),
578
577
  clay-unset-placeholder
579
578
  );
580
579
 
581
- $loading-animation: setter(map-get($map, loading-animation), $unset);
582
-
583
580
  $c-inner: setter(map-get($map, c-inner), ());
584
581
  $c-inner: map-merge(
585
582
  (
586
583
  enabled:
587
- setter(
588
- if(
589
- variable-exists(enable-c-inner),
590
- $enable-c-inner,
591
- $cadmin-enable-c-inner
592
- ),
593
- true
584
+ if(
585
+ variable-exists(enable-c-inner),
586
+ $enable-c-inner,
587
+ if
588
+ (
589
+ variable-exists(cadmin-enable-c-inner),
590
+ $cadmin-enable-c-inner,
591
+ true
592
+ )
594
593
  ),
595
594
  margin-bottom: math-sign(map-get($map, padding-bottom)),
596
595
  margin-left: math-sign(map-get($map, padding-left)),
@@ -1059,7 +1059,12 @@
1059
1059
  if(
1060
1060
  variable-exists(card-border-color),
1061
1061
  $card-border-color,
1062
- $cadmin-card-border-color
1062
+ if
1063
+ (
1064
+ variable-exists(cadmin-card-border-color),
1065
+ $cadmin-card-border-color,
1066
+ null
1067
+ )
1063
1068
  )
1064
1069
  ),
1065
1070
  border-style:
@@ -1144,7 +1149,12 @@
1144
1149
  if(
1145
1150
  variable-exists(link-cursor),
1146
1151
  $link-cursor,
1147
- $cadmin-link-cursor
1152
+ if
1153
+ (
1154
+ variable-exists(cadmin-link-cursor),
1155
+ $cadmin-link-cursor,
1156
+ null
1157
+ )
1148
1158
  )
1149
1159
  ),
1150
1160
  )
@@ -330,13 +330,15 @@
330
330
  $c-inner: map-merge(
331
331
  (
332
332
  enabled:
333
- setter(
334
- if(
335
- variable-exists(enable-c-inner),
336
- $enable-c-inner,
337
- $cadmin-enable-c-inner
338
- ),
339
- true
333
+ if(
334
+ variable-exists(enable-c-inner),
335
+ $enable-c-inner,
336
+ if
337
+ (
338
+ variable-exists(cadmin-enable-c-inner),
339
+ $cadmin-enable-c-inner,
340
+ true
341
+ )
340
342
  ),
341
343
  margin-bottom: math-sign(map-get($map, padding-bottom)),
342
344
  margin-left: math-sign(map-get($map, padding-left)),
@@ -459,13 +459,15 @@
459
459
  $c-inner: map-merge(
460
460
  (
461
461
  enabled:
462
- setter(
463
- if(
464
- variable-exists(enable-c-inner),
465
- $enable-c-inner,
466
- $cadmin-enable-c-inner
467
- ),
468
- true
462
+ if(
463
+ variable-exists(enable-c-inner),
464
+ $enable-c-inner,
465
+ if
466
+ (
467
+ variable-exists(cadmin-enable-c-inner),
468
+ $cadmin-enable-c-inner,
469
+ true
470
+ )
469
471
  ),
470
472
  flex-grow: 1,
471
473
  margin-bottom: math-sign(map-get($map, padding-bottom)),
@@ -248,6 +248,15 @@
248
248
  /// // .form-control.disabled ~ .input-group-inset-item
249
249
  /// ),
250
250
  /// ),
251
+ /// inline-item: (
252
+ /// // .form-control .inline-item
253
+ /// ),
254
+ /// label: (
255
+ /// // .form-control .label
256
+ /// ),
257
+ /// form-control-inset: (
258
+ /// // .form-control .form-control-inset
259
+ /// ),
251
260
  /// )
252
261
  /// -=-=-=-=-=- Deprecated -=-=-=-=-=-
253
262
  /// placeholder-color: {Color | String | Null}, // deprecated after 3.7.0
@@ -602,6 +611,20 @@
602
611
  }
603
612
  }
604
613
 
614
+ .inline-item {
615
+ @include clay-css(map-get($map, inline-item));
616
+ }
617
+
618
+ .label {
619
+ @include clay-css(map-get($map, label));
620
+ }
621
+
622
+ .form-control-inset {
623
+ @include clay-form-control-variant(
624
+ map-get($map, form-control-inset)
625
+ );
626
+ }
627
+
605
628
  @include clay-generate-media-breakpoints($map);
606
629
  }
607
630
  }
@@ -708,7 +731,12 @@
708
731
  if(
709
732
  variable-exists(input-color),
710
733
  $input-color,
711
- $cadmin-input-color
734
+ if
735
+ (
736
+ variable-exists(cadmin-input-color),
737
+ $cadmin-input-color,
738
+ null
739
+ )
712
740
  )
713
741
  ),
714
742
  )
@@ -8,22 +8,30 @@
8
8
 
9
9
  @mixin gradient-bg($color) {
10
10
  @if (
11
- setter(
12
- if(
13
- variable-exists(enable-gradients),
14
- $enable-gradients,
15
- $cadmin-enable-gradients
16
- ),
17
- false
11
+ if(
12
+ variable-exists(enable-gradients),
13
+ $enable-gradients,
14
+ if
15
+ (
16
+ variable-exists(cadmin-enable-gradients),
17
+ $cadmin-enable-gradients,
18
+ false
19
+ )
18
20
  )
19
21
  ) {
20
22
  background: $color
21
23
  linear-gradient(
22
24
  180deg,
23
25
  clay-mix(
24
- setter(
25
- if(variable-exists(body-bg), $body-bg, $cadmin-body-bg),
26
- #fff
26
+ if(
27
+ variable-exists(body-bg),
28
+ $body-bg,
29
+ if
30
+ (
31
+ variable-exists(cadmin-body-bg),
32
+ $cadmin-body-bg,
33
+ #fff
34
+ )
27
35
  ),
28
36
  $color,
29
37
  15%
@@ -117,13 +117,15 @@
117
117
  $custom-grid-props: map-merge(
118
118
  (
119
119
  enabled:
120
- setter(
121
- if(
122
- variable-exists(enable-grid-classes),
123
- $enable-grid-classes,
124
- $cadmin-enable-grid-classes
125
- ),
126
- true
120
+ if(
121
+ variable-exists(enable-grid-classes),
122
+ $enable-grid-classes,
123
+ if
124
+ (
125
+ variable-exists(cadmin-enable-grid-classes),
126
+ $cadmin-enable-grid-classes,
127
+ true
128
+ )
127
129
  ),
128
130
  ),
129
131
  $map
@@ -332,12 +332,6 @@
332
332
  @include clay-form-control-variant(
333
333
  map-deep-get($map, form-control)
334
334
  );
335
-
336
- .label {
337
- @include clay-label-variant(
338
- map-deep-get($map, form-control, label)
339
- );
340
- }
341
335
  }
342
336
 
343
337
  > .form-file {
@@ -40,7 +40,12 @@
40
40
  if(
41
41
  variable-exists(label-border-width),
42
42
  $label-border-width,
43
- $cadmin-label-border-width
43
+ if
44
+ (
45
+ variable-exists(cadmin-label-border-width),
46
+ $cadmin-label-border-width,
47
+ null
48
+ )
44
49
  )
45
50
  ),
46
51
  padding-bottom:
@@ -157,13 +162,15 @@
157
162
  $c-inner,
158
163
  (
159
164
  enabled:
160
- setter(
161
- if(
162
- variable-exists(enable-c-inner),
163
- $enable-c-inner,
164
- $cadmin-enable-c-inner
165
- ),
166
- true
165
+ if(
166
+ variable-exists(enable-c-inner),
167
+ $enable-c-inner,
168
+ if
169
+ (
170
+ variable-exists(cadmin-enable-c-inner),
171
+ $cadmin-enable-c-inner,
172
+ true
173
+ )
167
174
  ),
168
175
  margin-bottom:
169
176
  setter(
@@ -532,13 +532,15 @@
532
532
  $c-inner: map-merge(
533
533
  (
534
534
  enabled:
535
- setter(
536
- if(
537
- variable-exists(enable-c-inner),
538
- $enable-c-inner,
539
- $cadmin-enable-c-inner
540
- ),
541
- true
535
+ if(
536
+ variable-exists(enable-c-inner),
537
+ $enable-c-inner,
538
+ if
539
+ (
540
+ variable-exists(cadmin-enable-c-inner),
541
+ $cadmin-enable-c-inner,
542
+ true
543
+ )
542
544
  ),
543
545
  margin-bottom: math-sign(map-get($map, padding-bottom)),
544
546
  margin-left: math-sign(map-get($map, padding-left)),