@clayui/css 3.61.0 → 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 (41) hide show
  1. package/lib/css/atlas.css +29 -21
  2. package/lib/css/atlas.css.map +1 -1
  3. package/lib/css/base.css +29 -21
  4. package/lib/css/base.css.map +1 -1
  5. package/lib/css/cadmin.css +63 -54
  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/cadmin/components/_forms.scss +10 -0
  11. package/src/scss/cadmin/components/_input-groups.scss +9 -0
  12. package/src/scss/cadmin/components/_type.scss +5 -4
  13. package/src/scss/cadmin/variables/_forms.scss +31 -19
  14. package/src/scss/cadmin/variables/_type.scss +14 -0
  15. package/src/scss/components/_forms.scss +10 -0
  16. package/src/scss/components/_input-groups.scss +9 -0
  17. package/src/scss/components/_type.scss +5 -4
  18. package/src/scss/functions/_global-functions.scss +115 -50
  19. package/src/scss/mixins/_badges.scss +9 -7
  20. package/src/scss/mixins/_border-radius.scss +78 -57
  21. package/src/scss/mixins/_box-shadow.scss +9 -7
  22. package/src/scss/mixins/_breakpoints.scss +44 -4
  23. package/src/scss/mixins/_buttons.scss +21 -22
  24. package/src/scss/mixins/_cards.scss +12 -2
  25. package/src/scss/mixins/_close.scss +9 -7
  26. package/src/scss/mixins/_dropdown-menu.scss +9 -7
  27. package/src/scss/mixins/_forms.scss +29 -1
  28. package/src/scss/mixins/_gradients.scss +18 -10
  29. package/src/scss/mixins/_grid.scss +9 -7
  30. package/src/scss/mixins/_input-groups.scss +0 -6
  31. package/src/scss/mixins/_labels.scss +15 -8
  32. package/src/scss/mixins/_links.scss +9 -7
  33. package/src/scss/mixins/_list-group.scss +117 -21
  34. package/src/scss/mixins/_menubar.scss +117 -22
  35. package/src/scss/mixins/_navbar.scss +95 -132
  36. package/src/scss/mixins/_panels.scss +7 -6
  37. package/src/scss/mixins/_scale-component.scss +10 -2
  38. package/src/scss/mixins/_tbar.scss +15 -36
  39. package/src/scss/mixins/_timelines.scss +20 -4
  40. package/src/scss/variables/_forms.scss +31 -19
  41. package/src/scss/variables/_type.scss +14 -0
@@ -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)),
@@ -68,7 +68,12 @@
68
68
  if(
69
69
  variable-exists(list-group-bg),
70
70
  $list-group-bg,
71
- $cadmin-list-group-bg
71
+ if
72
+ (
73
+ variable-exists(cadmin-list-group-bg),
74
+ $cadmin-list-group-bg,
75
+ null
76
+ )
72
77
  )
73
78
  );
74
79
  $border-bottom-color: setter(
@@ -76,7 +81,14 @@
76
81
  if(
77
82
  variable-exists(list-group-notification-item-border-bottom-color),
78
83
  $list-group-notification-item-border-bottom-color,
79
- $cadmin-list-group-notification-item-border-bottom-color
84
+ if
85
+ (
86
+ variable-exists(
87
+ cadmin-list-group-notification-item-border-bottom-color
88
+ ),
89
+ $cadmin-list-group-notification-item-border-bottom-color,
90
+ null
91
+ )
80
92
  )
81
93
  );
82
94
  $border-left-color: setter(
@@ -84,7 +96,14 @@
84
96
  if(
85
97
  variable-exists(list-group-notification-item-border-left-color),
86
98
  $list-group-notification-item-border-left-color,
87
- $cadmin-list-group-notification-item-border-left-color
99
+ if
100
+ (
101
+ variable-exists(
102
+ cadmin-list-group-notification-item-border-left-color
103
+ ),
104
+ $cadmin-list-group-notification-item-border-left-color,
105
+ null
106
+ )
88
107
  )
89
108
  );
90
109
  $border-right-color: setter(
@@ -92,7 +111,14 @@
92
111
  if(
93
112
  variable-exists(list-group-notification-item-border-right-color),
94
113
  $list-group-notification-item-border-right-color,
95
- $cadmin-list-group-notification-item-border-right-color
114
+ if
115
+ (
116
+ variable-exists(
117
+ cadmin-list-group-notification-item-border-right-color
118
+ ),
119
+ $cadmin-list-group-notification-item-border-right-color,
120
+ null
121
+ )
96
122
  )
97
123
  );
98
124
  $border-top-color: setter(
@@ -100,7 +126,14 @@
100
126
  if(
101
127
  variable-exists(list-group-notification-item-border-top-color),
102
128
  $list-group-notification-item-border-top-color,
103
- $cadmin-list-group-notification-item-border-top-color
129
+ if
130
+ (
131
+ variable-exists(
132
+ cadmin-list-group-notification-item-border-top-color
133
+ ),
134
+ $cadmin-list-group-notification-item-border-top-color,
135
+ null
136
+ )
104
137
  )
105
138
  );
106
139
 
@@ -109,7 +142,14 @@
109
142
  if(
110
143
  variable-exists(list-group-notification-item-border-bottom-width),
111
144
  $list-group-notification-item-border-bottom-width,
112
- $cadmin-list-group-notification-item-border-bottom-width
145
+ if
146
+ (
147
+ variable-exists(
148
+ cadmin-list-group-notification-item-border-bottom-width
149
+ ),
150
+ $cadmin-list-group-notification-item-border-bottom-width,
151
+ null
152
+ )
113
153
  )
114
154
  );
115
155
  $border-left-width: setter(
@@ -117,7 +157,14 @@
117
157
  if(
118
158
  variable-exists(list-group-notification-item-border-left-width),
119
159
  $list-group-notification-item-border-left-width,
120
- $cadmin-list-group-notification-item-border-left-width
160
+ if
161
+ (
162
+ variable-exists(
163
+ cadmin-list-group-notification-item-border-left-width
164
+ ),
165
+ $cadmin-list-group-notification-item-border-left-width,
166
+ null
167
+ )
121
168
  )
122
169
  );
123
170
  $border-right-width: setter(
@@ -125,7 +172,14 @@
125
172
  if(
126
173
  variable-exists(list-group-notification-item-border-right-width),
127
174
  $list-group-notification-item-border-right-width,
128
- $cadmin-list-group-notification-item-border-right-width
175
+ if
176
+ (
177
+ variable-exists(
178
+ cadmin-list-group-notification-item-border-right-width
179
+ ),
180
+ $cadmin-list-group-notification-item-border-right-width,
181
+ null
182
+ )
129
183
  )
130
184
  );
131
185
  $border-top-width: setter(
@@ -133,7 +187,14 @@
133
187
  if(
134
188
  variable-exists(list-group-notification-item-border-top-width),
135
189
  $list-group-notification-item-border-top-width,
136
- $cadmin-list-group-notification-item-border-top-width
190
+ if
191
+ (
192
+ variable-exists(
193
+ cadmin-list-group-notification-item-border-top-width
194
+ ),
195
+ $cadmin-list-group-notification-item-border-top-width,
196
+ null
197
+ )
137
198
  )
138
199
  );
139
200
 
@@ -149,7 +210,12 @@
149
210
  if(
150
211
  variable-exists(list-group-active-bg),
151
212
  $list-group-active-bg,
152
- $cadmin-list-group-active-bg
213
+ if
214
+ (
215
+ variable-exists(cadmin-list-group-active-bg),
216
+ $cadmin-list-group-active-bg,
217
+ null
218
+ )
153
219
  )
154
220
  );
155
221
  $active-border-bottom-color: setter(
@@ -159,7 +225,14 @@
159
225
  list-group-notification-item-active-border-bottom-color
160
226
  ),
161
227
  $list-group-notification-item-active-border-bottom-color,
162
- $cadmin-list-group-notification-item-active-border-bottom-color
228
+ if
229
+ (
230
+ variable-exists(
231
+ cadmin-list-group-notification-item-active-border-bottom-color
232
+ ),
233
+ $cadmin-list-group-notification-item-active-border-bottom-color,
234
+ null
235
+ )
163
236
  )
164
237
  );
165
238
  $active-border-left-color: setter(
@@ -169,7 +242,14 @@
169
242
  list-group-notification-item-active-border-left-color
170
243
  ),
171
244
  $list-group-notification-item-active-border-left-color,
172
- $cadmin-list-group-notification-item-active-border-left-color
245
+ if
246
+ (
247
+ variable-exists(
248
+ cadmin-list-group-notification-item-active-border-left-color
249
+ ),
250
+ $cadmin-list-group-notification-item-active-border-left-color,
251
+ null
252
+ )
173
253
  )
174
254
  );
175
255
  $active-border-right-color: setter(
@@ -179,7 +259,14 @@
179
259
  list-group-notification-item-active-border-right-color
180
260
  ),
181
261
  $list-group-notification-item-active-border-right-color,
182
- $cadmin-list-group-notification-item-active-border-right-color
262
+ if
263
+ (
264
+ variable-exists(
265
+ cadmin-list-group-notification-item-active-border-right-color
266
+ ),
267
+ $cadmin-list-group-notification-item-active-border-right-color,
268
+ null
269
+ )
183
270
  )
184
271
  );
185
272
  $active-border-top-color: setter(
@@ -189,7 +276,14 @@
189
276
  list-group-notification-item-active-border-top-color
190
277
  ),
191
278
  $list-group-notification-item-active-border-top-color,
192
- $cadmin-list-group-notification-item-active-border-top-color
279
+ if
280
+ (
281
+ variable-exists(
282
+ cadmin-list-group-notification-item-active-border-top-color
283
+ ),
284
+ $cadmin-list-group-notification-item-active-border-top-color,
285
+ null
286
+ )
193
287
  )
194
288
  );
195
289
 
@@ -208,13 +302,15 @@
208
302
  background-color: $bg;
209
303
 
210
304
  @if (
211
- setter(
212
- if(
213
- variable-exists(enable-rounded),
214
- $enable-rounded,
215
- $cadmin-enable-rounded
216
- ),
217
- true
305
+ if(
306
+ variable-exists(enable-rounded),
307
+ $enable-rounded,
308
+ if
309
+ (
310
+ variable-exists(cadmin-enable-rounded),
311
+ $cadmin-enable-rounded,
312
+ true
313
+ )
218
314
  )
219
315
  ) {
220
316
  border-bottom-left-radius: $border-bottom-left-radius;