@clayui/css 3.127.0 → 3.130.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 (49) hide show
  1. package/lib/css/atlas.css +254 -72
  2. package/lib/css/atlas.css.map +1 -1
  3. package/lib/css/base.css +205 -94
  4. package/lib/css/base.css.map +1 -1
  5. package/lib/css/cadmin.css +238 -74
  6. package/lib/css/cadmin.css.map +1 -1
  7. package/lib/images/icons/icons.svg +1 -1
  8. package/lib/images/icons/send.svg +9 -0
  9. package/lib/images/icons/speed.svg +10 -0
  10. package/lib/images/icons/voice.svg +9 -0
  11. package/package.json +2 -2
  12. package/src/images/icons/send.svg +9 -0
  13. package/src/images/icons/speed.svg +10 -0
  14. package/src/images/icons/voice.svg +9 -0
  15. package/src/scss/_license-text.scss +1 -1
  16. package/src/scss/atlas/variables/_forms.scss +1 -0
  17. package/src/scss/atlas/variables/_globals.scss +2 -0
  18. package/src/scss/cadmin/components/_dropdowns.scss +10 -0
  19. package/src/scss/cadmin/components/_forms.scss +16 -14
  20. package/src/scss/cadmin/components/_grid.scss +3 -1
  21. package/src/scss/cadmin/components/_input-groups.scss +12 -1
  22. package/src/scss/cadmin/components/_type.scss +5 -1
  23. package/src/scss/cadmin/components/_utilities-functional-important.scss +11 -0
  24. package/src/scss/cadmin/variables/_custom-forms.scss +1 -1
  25. package/src/scss/cadmin/variables/_dropdowns.scss +3 -0
  26. package/src/scss/cadmin/variables/_forms.scss +15 -0
  27. package/src/scss/cadmin/variables/_globals.scss +2 -0
  28. package/src/scss/cadmin/variables/_utilities.scss +16 -0
  29. package/src/scss/components/_dropdowns.scss +10 -0
  30. package/src/scss/components/_forms.scss +16 -14
  31. package/src/scss/components/_grid.scss +3 -1
  32. package/src/scss/components/_input-groups.scss +12 -1
  33. package/src/scss/components/_type.scss +5 -1
  34. package/src/scss/components/_utilities-functional-important.scss +8 -0
  35. package/src/scss/functions/_lx-icons-generated.scss +6 -0
  36. package/src/scss/mixins/_alerts.scss +104 -48
  37. package/src/scss/mixins/_badges.scss +75 -33
  38. package/src/scss/mixins/_buttons.scss +503 -225
  39. package/src/scss/mixins/_cards.scss +619 -277
  40. package/src/scss/mixins/_close.scss +42 -24
  41. package/src/scss/mixins/_custom-forms.scss +864 -581
  42. package/src/scss/mixins/_dropdown-menu.scss +466 -223
  43. package/src/scss/mixins/_forms.scss +0 -13
  44. package/src/scss/mixins/_links.scss +564 -282
  45. package/src/scss/variables/_custom-forms.scss +1 -1
  46. package/src/scss/variables/_dropdowns.scss +3 -0
  47. package/src/scss/variables/_forms.scss +10 -0
  48. package/src/scss/variables/_globals.scss +2 -0
  49. package/src/scss/variables/_utilities.scss +16 -0
@@ -104,702 +104,960 @@
104
104
  $enabled: setter(map-get($map, enabled), true);
105
105
 
106
106
  @if ($enabled) {
107
- @include clay-css($map);
108
-
109
- ~ .custom-control-label::before {
110
- @include clay-css(
111
- map-deep-get($map, custom-control-label, before)
112
- );
107
+ @if (length($map) != 0) {
108
+ @include clay-css($map);
113
109
  }
114
110
 
115
- ~ .custom-control-label::after {
116
- @include clay-css(
117
- map-deep-get($map, custom-control-label, after)
118
- );
119
- }
111
+ $_custom-control-label: map-get($map, custom-control-label);
120
112
 
121
- ~ .card {
122
- @include clay-card-variant(map-deep-get($map, card));
123
- }
113
+ @if ($_custom-control-label) {
114
+ ~ .custom-control-label {
115
+ @include clay-css($_custom-control-label);
124
116
 
125
- &:hover {
126
- ~ .custom-control-label::before {
127
- @include clay-css(
128
- map-deep-get($map, hover, custom-control-label, before)
129
- );
130
- }
117
+ $_before: map-get($_custom-control-label, before);
131
118
 
132
- ~ .custom-control-label::after {
133
- @include clay-css(
134
- map-deep-get($map, hover, custom-control-label, after)
135
- );
119
+ @if ($_before) {
120
+ &::before {
121
+ @include clay-css($_before);
122
+ }
123
+ }
124
+
125
+ $_after: map-get($_custom-control-label, after);
126
+
127
+ @if ($_after) {
128
+ &::after {
129
+ @include clay-css($_after);
130
+ }
131
+ }
136
132
  }
133
+ }
134
+
135
+ $_card: map-get($map, card);
137
136
 
137
+ @if ($_card) {
138
138
  ~ .card {
139
- @include clay-card-variant(map-deep-get($map, hover, card));
139
+ @include clay-card-variant($_card);
140
140
  }
141
141
  }
142
142
 
143
- @at-root {
144
- #{$focus-visible-selector},
145
- #{if($c-prefers-focus-selector,$c-prefers-focus-selector,clay-insert-before('.cadmin', '.c-prefers-focus ', '&:focus'))} {
146
- ~ .custom-control-label::before {
147
- @include clay-css(
148
- map-deep-get(
149
- $map,
150
- focus,
151
- custom-control-label,
152
- before
153
- )
154
- );
143
+ $_hover: map-get($map, hover);
144
+
145
+ @if ($_hover) {
146
+ &:hover {
147
+ @include clay-css($_hover);
148
+
149
+ $_custom-control-label: map-get(
150
+ $_hover,
151
+ custom-control-label
152
+ );
153
+
154
+ @if ($_custom-control-label) {
155
+ ~ .custom-control-label {
156
+ @include clay-css($_custom-control-label);
157
+
158
+ $_before: map-get($_custom-control-label, before);
159
+
160
+ @if ($_before) {
161
+ &::before {
162
+ @include clay-css($_before);
163
+ }
164
+ }
165
+
166
+ $_after: map-get($_custom-control-label, after);
167
+
168
+ @if ($_after) {
169
+ &::after {
170
+ @include clay-css($_after);
171
+ }
172
+ }
173
+ }
155
174
  }
156
175
 
157
- ~ .custom-control-label::after {
158
- @include clay-css(
159
- map-deep-get(
160
- $map,
161
- focus,
162
- custom-control-label,
163
- after
164
- )
165
- );
176
+ $_card: map-get($_hover, card);
177
+
178
+ @if ($_card) {
179
+ ~ .card {
180
+ @include clay-card-variant($_card);
181
+ }
166
182
  }
183
+ }
184
+ }
185
+
186
+ $_focus: map-get($map, focus);
167
187
 
168
- ~ .card {
169
- @include clay-card-variant(
170
- map-deep-get($map, focus, card)
188
+ @if ($_focus) {
189
+ @at-root {
190
+ #{$focus-visible-selector},
191
+ #{if($c-prefers-focus-selector,$c-prefers-focus-selector,clay-insert-before('.cadmin', '.c-prefers-focus ', '&:focus'))} {
192
+ $_custom-control-label: map-get(
193
+ $_focus,
194
+ custom-control-label
171
195
  );
196
+
197
+ @if ($_custom-control-label) {
198
+ ~ .custom-control-label {
199
+ @include clay-css($_custom-control-label);
200
+
201
+ $_before: map-get(
202
+ $_custom-control-label,
203
+ before
204
+ );
205
+
206
+ @if ($_before) {
207
+ &::before {
208
+ @include clay-css($_before);
209
+ }
210
+ }
211
+
212
+ $_after: map-get($_custom-control-label, after);
213
+
214
+ @if ($_after) {
215
+ &::after {
216
+ @include clay-css($_after);
217
+ }
218
+ }
219
+ }
220
+ }
221
+
222
+ $_card: map-get($_focus, card);
223
+
224
+ @if ($_card) {
225
+ ~ .card {
226
+ @include clay-card-variant($_card);
227
+ }
228
+ }
172
229
  }
173
230
  }
174
231
  }
175
232
 
176
- &:active {
177
- ~ .custom-control-label::before {
178
- @include clay-css(
179
- map-deep-get($map, active, custom-control-label, before)
180
- );
181
- }
233
+ $_active: map-get($map, active);
182
234
 
183
- ~ .custom-control-label::after {
184
- @include clay-css(
185
- map-deep-get($map, active, custom-control-label, after)
235
+ @if ($_active) {
236
+ &:active {
237
+ $_custom-control-label: map-get(
238
+ $_active,
239
+ custom-control-label
186
240
  );
187
- }
188
241
 
189
- ~ .card {
190
- @include clay-card-variant(
191
- map-deep-get($map, active, card)
192
- );
242
+ @if ($_custom-control-label) {
243
+ ~ .custom-control-label {
244
+ $_before: map-get($_custom-control-label, before);
245
+
246
+ @if ($_before) {
247
+ &::before {
248
+ @include clay-css($_before);
249
+ }
250
+ }
251
+
252
+ $_after: map-get($_custom-control-label, after);
253
+
254
+ @if ($_after) {
255
+ &::after {
256
+ @include clay-css($_after);
257
+ }
258
+ }
259
+ }
260
+ }
261
+
262
+ $_card: map-get($_active, card);
263
+
264
+ @if ($_card) {
265
+ ~ .card {
266
+ @include clay-card-variant($_card);
267
+ }
268
+ }
193
269
  }
194
270
  }
195
271
 
196
272
  // Use [disabled] and :disabled to work around https://github.com/twbs/bootstrap/issues/28247
197
273
 
198
- &[disabled],
199
- &:disabled {
200
- @include clay-css(map-deep-get($map, disabled));
274
+ $_disabled: map-get($map, disabled);
201
275
 
202
- ~ .custom-control-label {
203
- @include clay-css(
204
- map-deep-get($map, disabled, custom-control-label)
205
- );
206
- }
276
+ @if ($_disabled) {
277
+ &[disabled],
278
+ &:disabled {
279
+ @include clay-css($_disabled);
207
280
 
208
- ~ .custom-control-label::before {
209
- @include clay-css(
210
- map-deep-get(
211
- $map,
212
- disabled,
213
- custom-control-label,
214
- before
215
- )
281
+ $_custom-control-label: map-get(
282
+ $_disabled,
283
+ custom-control-label
216
284
  );
217
- }
218
285
 
219
- ~ .custom-control-label::after {
220
- @include clay-css(
221
- map-deep-get(
222
- $map,
223
- disabled,
224
- custom-control-label,
225
- after
226
- )
227
- );
228
- }
286
+ @if ($_custom-control-label) {
287
+ ~ .custom-control-label {
288
+ @include clay-css($_custom-control-label);
229
289
 
230
- ~ .card {
231
- @include clay-card-variant(
232
- map-deep-get($map, disabled, card)
233
- );
234
- }
235
- }
290
+ $_before: map-get($_custom-control-label, before);
236
291
 
237
- &:checked {
238
- ~ .custom-control-label::before {
239
- @include clay-css(
240
- map-deep-get(
241
- $map,
242
- checked,
243
- custom-control-label,
244
- before
245
- )
246
- );
247
- }
292
+ @if ($_before) {
293
+ &::before {
294
+ @include clay-css($_before);
295
+ }
296
+ }
248
297
 
249
- ~ .custom-control-label::after {
250
- @include clay-css(
251
- map-deep-get($map, checked, custom-control-label, after)
252
- );
253
- }
298
+ $_after: map-get($_custom-control-label, after);
254
299
 
255
- ~ .card {
256
- @include clay-card-variant(
257
- map-deep-get($map, checked, card)
258
- );
300
+ @if ($_after) {
301
+ &::after {
302
+ @include clay-css($_after);
303
+ }
304
+ }
305
+ }
306
+ }
307
+
308
+ $_card: map-get($_disabled, card);
309
+
310
+ @if ($_card) {
311
+ ~ .card {
312
+ @include clay-card-variant($_card);
313
+ }
314
+ }
259
315
  }
260
316
  }
261
317
 
262
- &[readonly] {
263
- @include clay-css(map-deep-get($map, readonly));
318
+ $_readonly: map-get($map, readonly);
264
319
 
265
- ~ .custom-control-label {
266
- @include clay-css(
267
- map-deep-get($map, readonly, custom-control-label)
268
- );
269
- }
320
+ @if ($_readonly) {
321
+ &[readonly] {
322
+ @include clay-css($_readonly);
270
323
 
271
- ~ .custom-control-label::before {
272
- @include clay-css(
273
- map-deep-get(
274
- $map,
275
- readonly,
276
- custom-control-label,
277
- before
278
- )
324
+ $_custom-control-label: map-get(
325
+ $_readonly,
326
+ custom-control-label
279
327
  );
280
- }
281
328
 
282
- ~ .custom-control-label::after {
283
- @include clay-css(
284
- map-deep-get(
285
- $map,
286
- readonly,
287
- custom-control-label,
288
- after
289
- )
290
- );
291
- }
329
+ @if ($_custom-control-label) {
330
+ ~ .custom-control-label {
331
+ @include clay-css($_custom-control-label);
292
332
 
293
- ~ .card {
294
- @include clay-card-variant(
295
- map-deep-get($map, readonly, card)
296
- );
333
+ $_before: map-get($_custom-control-label, before);
334
+
335
+ @if ($_before) {
336
+ &::before {
337
+ @include clay-css($_before);
338
+ }
339
+ }
340
+
341
+ $_after: map-get($_custom-control-label, after);
342
+
343
+ @if ($_after) {
344
+ &::after {
345
+ @include clay-css($_after);
346
+ }
347
+ }
348
+ }
349
+ }
350
+
351
+ $_card: map-get($_readonly, card);
352
+
353
+ @if ($_card) {
354
+ ~ .card {
355
+ @include clay-card-variant($_card);
356
+ }
357
+ }
297
358
  }
298
359
  }
299
360
 
300
- &[readonly][disabled] {
301
- @include clay-css(map-deep-get($map, readonly, disabled));
361
+ $_readonly-disabled: if(
362
+ $_readonly,
363
+ map-get($_readonly, disabled),
364
+ null
365
+ );
302
366
 
303
- ~ .custom-control-label {
304
- @include clay-css(
305
- map-deep-get(
306
- $map,
307
- readonly,
308
- disabled,
309
- custom-control-label
310
- )
311
- );
312
- }
367
+ @if ($_readonly-disabled) {
368
+ &[readonly][disabled] {
369
+ @include clay-css($_readonly-disabled);
313
370
 
314
- ~ .custom-control-label::before {
315
- @include clay-css(
316
- map-deep-get(
317
- $map,
318
- readonly,
319
- disabled,
320
- custom-control-label,
321
- before
322
- )
371
+ $_custom-control-label: map-get(
372
+ $_readonly-disabled,
373
+ custom-control-label
323
374
  );
324
- }
325
375
 
326
- ~ .custom-control-label::after {
327
- @include clay-css(
328
- map-deep-get(
329
- $map,
330
- readonly,
331
- disabled,
332
- custom-control-label,
333
- after
334
- )
335
- );
336
- }
376
+ @if ($_custom-control-label) {
377
+ ~ .custom-control-label {
378
+ @include clay-css($_custom-control-label);
337
379
 
338
- ~ .card {
339
- @include clay-card-variant(
340
- map-deep-get($map, readonly, disabled, card)
341
- );
380
+ $_before: map-get($_custom-control-label, before);
381
+
382
+ @if ($_before) {
383
+ &::before {
384
+ @include clay-css($_before);
385
+ }
386
+ }
387
+
388
+ $_after: map-get($_custom-control-label, after);
389
+
390
+ @if ($_after) {
391
+ &::after {
392
+ @include clay-css($_after);
393
+ }
394
+ }
395
+ }
396
+ }
397
+
398
+ $_card: map-get($_readonly-disabled, card);
399
+
400
+ @if ($_card) {
401
+ ~ .card {
402
+ @include clay-card-variant($_card);
403
+ }
404
+ }
342
405
  }
343
406
  }
344
407
 
345
- &:checked {
346
- ~ .custom-control-label::before {
347
- @include clay-css(
348
- map-deep-get(
349
- $map,
350
- checked,
351
- custom-control-label,
352
- before
353
- )
354
- );
355
- }
408
+ $_checked: map-get($map, checked);
356
409
 
357
- ~ .custom-control-label::after {
358
- @include clay-css(
359
- map-deep-get($map, checked, custom-control-label, after)
410
+ @if ($_checked) {
411
+ &:checked {
412
+ $_custom-control-label: map-get(
413
+ $_checked,
414
+ custom-control-label
360
415
  );
361
- }
362
416
 
363
- ~ .card {
364
- @include clay-card-variant(
365
- map-deep-get($map, checked, card)
366
- );
417
+ @if ($_custom-control-label) {
418
+ ~ .custom-control-label {
419
+ @include clay-css($_custom-control-label);
420
+
421
+ $_before: map-get($_custom-control-label, before);
422
+
423
+ @if ($_before) {
424
+ &::before {
425
+ @include clay-css($_before);
426
+ }
427
+ }
428
+
429
+ $_after: map-get($_custom-control-label, after);
430
+
431
+ @if ($_after) {
432
+ &::after {
433
+ @include clay-css($_after);
434
+ }
435
+ }
436
+ }
437
+ }
438
+
439
+ $_card: map-get($_checked, card);
440
+
441
+ @if ($_card) {
442
+ ~ .card {
443
+ @include clay-card-variant($_card);
444
+ }
445
+ }
367
446
  }
368
447
  }
369
448
 
370
- &:checked:hover {
371
- ~ .custom-control-label::before {
372
- @include clay-css(
373
- map-deep-get(
374
- $map,
375
- checked,
376
- hover,
377
- custom-control-label,
378
- before
379
- )
380
- );
381
- }
449
+ $_checked-hover: if($_checked, map-get($_checked, hover), null);
382
450
 
383
- ~ .custom-control-label::after {
384
- @include clay-css(
385
- map-deep-get(
386
- $map,
387
- checked,
388
- hover,
389
- custom-control-label,
390
- after
391
- )
451
+ @if ($_checked-hover) {
452
+ &:checked:hover {
453
+ $_custom-control-label: map-get(
454
+ $_checked-hover,
455
+ custom-control-label
392
456
  );
393
- }
394
457
 
395
- ~ .card {
396
- @include clay-card-variant(
397
- map-deep-get($map, checked, hover, card)
398
- );
458
+ @if ($_custom-control-label) {
459
+ ~ .custom-control-label {
460
+ @include clay-css($_custom-control-label);
461
+
462
+ $_before: map-get($_custom-control-label, before);
463
+
464
+ @if ($_before) {
465
+ &::before {
466
+ @include clay-css($_before);
467
+ }
468
+ }
469
+
470
+ $_after: map-get($_custom-control-label, after);
471
+
472
+ @if ($_after) {
473
+ &::after {
474
+ @include clay-css($_after);
475
+ }
476
+ }
477
+ }
478
+ }
479
+
480
+ $_card: map-get($_checked-hover, card);
481
+
482
+ @if ($_card) {
483
+ ~ .card {
484
+ @include clay-card-variant($_card);
485
+ }
486
+ }
399
487
  }
400
488
  }
401
489
 
402
- @at-root {
403
- &:checked {
404
- #{$focus-visible-selector},
405
- #{if($c-prefers-focus-selector,$c-prefers-focus-selector,clay-insert-before('.cadmin', '.c-prefers-focus ', '&:focus'))} {
406
- ~ .custom-control-label::before {
407
- @include clay-css(
408
- map-deep-get(
409
- $map,
410
- checked,
411
- focus,
412
- custom-control-label,
413
- before
414
- )
490
+ $_checked-focus: if($_checked, map-get($_checked, focus), null);
491
+
492
+ @if ($_checked-focus) {
493
+ @at-root {
494
+ &:checked {
495
+ #{$focus-visible-selector},
496
+ #{if($c-prefers-focus-selector,$c-prefers-focus-selector,clay-insert-before('.cadmin', '.c-prefers-focus ', '&:focus'))} {
497
+ $_custom-control-label: map-get(
498
+ $_checked-focus,
499
+ custom-control-label
415
500
  );
501
+
502
+ @if ($_custom-control-label) {
503
+ ~ .custom-control-label {
504
+ @include clay-css($_custom-control-label);
505
+
506
+ $_before: map-get(
507
+ $_custom-control-label,
508
+ before
509
+ );
510
+
511
+ @if ($_before) {
512
+ &::before {
513
+ @include clay-css($_before);
514
+ }
515
+ }
516
+
517
+ $_after: map-get(
518
+ $_custom-control-label,
519
+ after
520
+ );
521
+
522
+ @if ($_after) {
523
+ }
524
+ &::after {
525
+ @include clay-css($_after);
526
+ }
527
+ }
528
+ }
529
+
530
+ $_card: map-get($_checked-focus, card);
531
+
532
+ @if ($_card) {
533
+ ~ .card {
534
+ @include clay-card-variant($_card);
535
+ }
536
+ }
416
537
  }
538
+ }
539
+ }
540
+ }
417
541
 
418
- ~ .custom-control-label::after {
419
- @include clay-css(
420
- map-deep-get(
421
- $map,
422
- checked,
423
- focus,
424
- custom-control-label,
425
- after
426
- )
427
- );
542
+ $_checked-active: if($_checked, map-get($_checked, active), null);
543
+
544
+ @if ($_checked-active) {
545
+ &:checked:active {
546
+ $_custom-control-label: map-get(
547
+ $_checked-active,
548
+ custom-control-label
549
+ );
550
+
551
+ @if ($_custom-control-label) {
552
+ ~ .custom-control-label {
553
+ @include clay-css($_custom-control-label);
554
+
555
+ $_before: map-get($_custom-control-label, before);
556
+
557
+ @if ($_before) {
558
+ &::before {
559
+ @include clay-css($_before);
560
+ }
561
+ }
562
+
563
+ $_after: map-get($_custom-control-label, after);
564
+
565
+ @if ($_after) {
566
+ &::after {
567
+ @include clay-css($_after);
568
+ }
569
+ }
428
570
  }
571
+ }
429
572
 
573
+ $_card: map-get($_checked-active, card);
574
+
575
+ @if ($_card) {
430
576
  ~ .card {
431
577
  @include clay-card-variant(
432
- map-deep-get($map, checked, focus, card)
578
+ map-deep-get($map, checked, active, card)
433
579
  );
434
580
  }
435
581
  }
436
582
  }
437
583
  }
438
584
 
439
- &:checked:active {
440
- ~ .custom-control-label::before {
441
- @include clay-css(
442
- map-deep-get(
443
- $map,
444
- checked,
445
- active,
446
- custom-control-label,
447
- before
448
- )
449
- );
450
- }
585
+ $_checked-disabled: if(
586
+ $_checked,
587
+ map-get($_checked, disabled),
588
+ null
589
+ );
451
590
 
452
- ~ .custom-control-label::after {
453
- @include clay-css(
454
- map-deep-get(
455
- $map,
456
- checked,
457
- active,
458
- custom-control-label,
459
- after
460
- )
461
- );
462
- }
591
+ @if ($_checked-disabled) {
592
+ &:checked[disabled],
593
+ &:checked:disabled {
594
+ @include clay-css($_checked-disabled);
463
595
 
464
- ~ .card {
465
- @include clay-card-variant(
466
- map-deep-get($map, checked, active, card)
596
+ $_custom-control-label: map-get(
597
+ $_checked-disabled,
598
+ custom-control-label
467
599
  );
468
- }
469
- }
470
600
 
471
- &:checked[disabled],
472
- &:checked:disabled {
473
- ~ .custom-control-label::before {
474
- @include clay-css(
475
- map-deep-get(
476
- $map,
477
- checked,
478
- disabled,
479
- custom-control-label,
480
- before
481
- )
482
- );
483
- }
601
+ @if ($_custom-control-label) {
602
+ ~ .custom-control-label {
603
+ @include clay-css($_custom-control-label);
484
604
 
485
- ~ .custom-control-label::after {
486
- @include clay-css(
487
- map-deep-get(
488
- $map,
489
- checked,
490
- disabled,
491
- custom-control-label,
492
- after
493
- )
494
- );
495
- }
605
+ $_before: map-get($_custom-control-label, before);
496
606
 
497
- ~ .card {
498
- @include clay-card-variant(
499
- map-deep-get($map, checked, disabled, card)
500
- );
607
+ @if ($_before) {
608
+ &::before {
609
+ @include clay-css($_before);
610
+ }
611
+ }
612
+
613
+ $_after: map-get($_custom-control-label, after);
614
+
615
+ @if ($_after) {
616
+ &::after {
617
+ @include clay-css($_after);
618
+ }
619
+ }
620
+ }
621
+ }
622
+
623
+ $_card: map-get($_checked-disabled, card);
624
+
625
+ @if ($_card) {
626
+ ~ .card {
627
+ @include clay-card-variant($_card);
628
+ }
629
+ }
501
630
  }
502
631
  }
503
632
 
504
- &:checked[readonly] {
505
- ~ .custom-control-label::before {
506
- @include clay-css(
507
- map-deep-get(
508
- $map,
509
- checked,
510
- readonly,
511
- custom-control-label,
512
- before
513
- )
514
- );
515
- }
633
+ $_checked-readonly: if(
634
+ $_checked,
635
+ map-get($_checked, readonly),
636
+ null
637
+ );
516
638
 
517
- ~ .custom-control-label::after {
518
- @include clay-css(
519
- map-deep-get(
520
- $map,
521
- checked,
522
- readonly,
523
- custom-control-label,
524
- after
525
- )
526
- );
527
- }
639
+ @if ($_checked-readonly) {
640
+ &:checked[readonly] {
641
+ @include clay-css($_checked-readonly);
528
642
 
529
- ~ .card {
530
- @include clay-card-variant(
531
- map-deep-get($map, checked, readonly, card)
643
+ $_custom-control-label: map-get(
644
+ $_checked-readonly,
645
+ custom-control-label
532
646
  );
647
+
648
+ @if ($_custom-control-label) {
649
+ ~ .custom-control-label {
650
+ @include clay-css($_custom-control-label);
651
+
652
+ $_before: map-get($_custom-control-label, before);
653
+
654
+ @if ($_before) {
655
+ &::before {
656
+ @include clay-css($_before);
657
+ }
658
+ }
659
+
660
+ $_after: map-get($_custom-control-label, after);
661
+
662
+ @if ($_after) {
663
+ &::after {
664
+ @include clay-css($_after);
665
+ }
666
+ }
667
+ }
668
+ }
669
+
670
+ $_card: map-get($_checked-readonly, card);
671
+
672
+ @if ($_card) {
673
+ ~ .card {
674
+ @include clay-card-variant($_card);
675
+ }
676
+ }
533
677
  }
534
678
  }
535
679
 
536
- &:checked[readonly][disabled] {
537
- ~ .custom-control-label::before {
538
- @include clay-css(
539
- map-deep-get(
540
- $map,
541
- checked,
542
- readonly,
543
- disabled,
544
- custom-control-label,
545
- before
546
- )
547
- );
548
- }
680
+ $_checked-readonly-disabled: if(
681
+ $_checked-readonly,
682
+ map-get($_checked-readonly, disabled),
683
+ null
684
+ );
549
685
 
550
- ~ .custom-control-label::after {
551
- @include clay-css(
552
- map-deep-get(
553
- $map,
554
- checked,
555
- readonly,
556
- disabled,
557
- custom-control-label,
558
- after
559
- )
560
- );
561
- }
686
+ @if ($_checked-readonly-disabled) {
687
+ &:checked[readonly][disabled] {
688
+ @include clay-css($_checked-readonly-disabled);
562
689
 
563
- ~ .card {
564
- @include clay-card-variant(
565
- map-deep-get($map, checked, readonly, disabled, card)
690
+ $_custom-control-label: map-get(
691
+ $_checked-readonly-disabled,
692
+ custom-control-label
566
693
  );
694
+
695
+ @if ($_custom-control-label) {
696
+ ~ .custom-control-label {
697
+ @include clay-css($_custom-control-label);
698
+
699
+ $_before: map-get($_custom-control-label, before);
700
+
701
+ @if ($_before) {
702
+ &::before {
703
+ @include clay-css($_before);
704
+ }
705
+ }
706
+
707
+ $_after: map-get($_custom-control-label, after);
708
+
709
+ @if ($_after) {
710
+ &::after {
711
+ @include clay-css($_after);
712
+ }
713
+ }
714
+ }
715
+ }
716
+
717
+ $_card: map-get($_checked-readonly-disabled, card);
718
+
719
+ @if ($_card) {
720
+ ~ .card {
721
+ @include clay-card-variant($_card);
722
+ }
723
+ }
567
724
  }
568
725
  }
569
726
 
570
- &:indeterminate {
571
- ~ .custom-control-label::before {
572
- @include clay-css(
573
- map-deep-get(
574
- $map,
575
- indeterminate,
576
- custom-control-label,
577
- before
578
- )
579
- );
580
- }
727
+ $_indeterminate: map-get($map, indeterminate);
581
728
 
582
- ~ .custom-control-label::after {
583
- @include clay-css(
584
- map-deep-get(
585
- $map,
586
- indeterminate,
587
- custom-control-label,
588
- after
589
- )
590
- );
591
- }
729
+ @if ($_indeterminate) {
730
+ &:indeterminate {
731
+ @include clay-css($_indeterminate);
592
732
 
593
- ~ .card {
594
- @include clay-card-variant(
595
- map-deep-get($map, indeterminate, card)
733
+ $_custom-control-label: map-get(
734
+ $_indeterminate,
735
+ custom-control-label
596
736
  );
737
+
738
+ @if ($_custom-control-label) {
739
+ ~ .custom-control-label {
740
+ @include clay-css($_custom-control-label);
741
+
742
+ $_before: map-get($_custom-control-label, before);
743
+
744
+ @if ($_before) {
745
+ &::before {
746
+ @include clay-css($_before);
747
+ }
748
+ }
749
+
750
+ $_after: map-get($_custom-control-label, after);
751
+
752
+ @if ($_after) {
753
+ &::after {
754
+ @include clay-css($_after);
755
+ }
756
+ }
757
+ }
758
+ }
759
+
760
+ $_card: map-get($_indeterminate, card);
761
+
762
+ @if ($_card) {
763
+ ~ .card {
764
+ @include clay-card-variant($_card);
765
+ }
766
+ }
597
767
  }
598
768
  }
599
769
 
600
- &:indeterminate:hover {
601
- ~ .custom-control-label::before {
602
- @include clay-css(
603
- map-deep-get(
604
- $map,
605
- indeterminate,
606
- hover,
607
- custom-control-label,
608
- before
609
- )
610
- );
611
- }
770
+ $_indeterminate-hover: if(
771
+ $_indeterminate,
772
+ map-get($_indeterminate, hover),
773
+ null
774
+ );
612
775
 
613
- ~ .custom-control-label::after {
614
- @include clay-css(
615
- map-deep-get(
616
- $map,
617
- indeterminate,
618
- hover,
619
- custom-control-label,
620
- after
621
- )
622
- );
623
- }
776
+ @if ($_indeterminate-hover) {
777
+ &:indeterminate:hover {
778
+ @include clay-css($_indeterminate-hover);
624
779
 
625
- ~ .card {
626
- @include clay-card-variant(
627
- map-deep-get($map, indeterminate, hover, card)
780
+ $_custom-control-label: map-get(
781
+ $_indeterminate-hover,
782
+ custom-control-label
628
783
  );
629
- }
630
- }
631
784
 
632
- @at-root {
633
- &:indeterminate {
634
- #{$focus-visible-selector},
635
- #{if($c-prefers-focus-selector,$c-prefers-focus-selector,clay-insert-before('.cadmin', '.c-prefers-focus ', '&:focus'))} {
636
- ~ .custom-control-label::before {
637
- @include clay-css(
638
- map-deep-get(
639
- $map,
640
- indeterminate,
641
- focus,
642
- custom-control-label,
643
- before
644
- )
645
- );
646
- }
785
+ @if ($_custom-control-label) {
786
+ ~ .custom-control-label {
787
+ @include clay-css($_custom-control-label);
647
788
 
648
- ~ .custom-control-label::after {
649
- @include clay-css(
650
- map-deep-get(
651
- $map,
652
- indeterminate,
653
- focus,
654
- custom-control-label,
655
- after
656
- )
657
- );
789
+ $_before: map-get($_custom-control-label, before);
790
+
791
+ @if ($_before) {
792
+ &::before {
793
+ @include clay-css($_before);
794
+ }
795
+ }
796
+
797
+ $_after: map-get($_custom-control-label, after);
798
+
799
+ @if ($_after) {
800
+ &::after {
801
+ @include clay-css($_after);
802
+ }
803
+ }
658
804
  }
805
+ }
659
806
 
807
+ $_card: map-get($_indeterminate-hover, card);
808
+
809
+ @if ($_card) {
660
810
  ~ .card {
661
- @include clay-card-variant(
662
- map-deep-get($map, indeterminate, focus, card)
663
- );
811
+ @include clay-card-variant($_card);
664
812
  }
665
813
  }
666
814
  }
667
815
  }
668
816
 
669
- &:indeterminate:active {
670
- ~ .custom-control-label::before {
671
- @include clay-css(
672
- map-deep-get(
673
- $map,
674
- indeterminate,
675
- active,
676
- custom-control-label,
677
- before
678
- )
679
- );
680
- }
817
+ $_indeterminate-focus: if(
818
+ $_indeterminate,
819
+ map-get($_indeterminate, focus),
820
+ null
821
+ );
822
+
823
+ @if ($_indeterminate-focus) {
824
+ @at-root {
825
+ &:indeterminate {
826
+ #{$focus-visible-selector},
827
+ #{if($c-prefers-focus-selector,$c-prefers-focus-selector,clay-insert-before('.cadmin', '.c-prefers-focus ', '&:focus'))} {
828
+ @include clay-css($_indeterminate-focus);
829
+
830
+ $_custom-control-label: map-get(
831
+ $_indeterminate-focus,
832
+ custom-control-label
833
+ );
681
834
 
682
- ~ .custom-control-label::after {
683
- @include clay-css(
684
- map-deep-get(
685
- $map,
686
- indeterminate,
687
- active,
688
- custom-control-label,
689
- after
690
- )
691
- );
835
+ @if ($_custom-control-label) {
836
+ ~ .custom-control-label {
837
+ @include clay-css($_custom-control-label);
838
+
839
+ $_before: map-get(
840
+ $_custom-control-label,
841
+ before
842
+ );
843
+
844
+ @if ($_before) {
845
+ &::before {
846
+ @include clay-css($_before);
847
+ }
848
+ }
849
+
850
+ $_after: map-get(
851
+ $_custom-control-label,
852
+ after
853
+ );
854
+
855
+ @if ($_after) {
856
+ &::after {
857
+ @include clay-css($_after);
858
+ }
859
+ }
860
+ }
861
+ }
862
+
863
+ $_card: map-get($_indeterminate-focus, card);
864
+
865
+ @if ($_card) {
866
+ ~ .card {
867
+ @include clay-card-variant($_card);
868
+ }
869
+ }
870
+ }
871
+ }
692
872
  }
873
+ }
693
874
 
694
- ~ .card {
695
- @include clay-card-variant(
696
- map-deep-get($map, indeterminate, active, card)
875
+ $_indeterminate-active: if(
876
+ $_indeterminate,
877
+ map-get($_indeterminate, active),
878
+ null
879
+ );
880
+
881
+ @if ($_indeterminate-active) {
882
+ &:indeterminate:active {
883
+ @include clay-css($_indeterminate-active);
884
+
885
+ $_custom-control-label: map-get(
886
+ $_indeterminate-active,
887
+ custom-control-label
697
888
  );
889
+
890
+ @if ($_custom-control-label) {
891
+ ~ .custom-control-label {
892
+ @include clay-css($_custom-control-label);
893
+
894
+ $_before: map-get($_custom-control-label, before);
895
+
896
+ @if ($_before) {
897
+ &::before {
898
+ @include clay-css($_before);
899
+ }
900
+ }
901
+
902
+ $_after: map-get($_custom-control-label, after);
903
+
904
+ @if ($_after) {
905
+ &::after {
906
+ @include clay-css($_after);
907
+ }
908
+ }
909
+ }
910
+ }
911
+
912
+ $_card: map-get($_indeterminate-active, card);
913
+
914
+ @if ($_card) {
915
+ ~ .card {
916
+ @include clay-card-variant($_card);
917
+ }
918
+ }
698
919
  }
699
920
  }
700
921
 
701
- &:indeterminate[disabled],
702
- &:indeterminate:disabled {
703
- ~ .custom-control-label::before {
704
- @include clay-css(
705
- map-deep-get(
706
- $map,
707
- indeterminate,
708
- disabled,
709
- custom-control-label,
710
- before
711
- )
712
- );
713
- }
922
+ $_indeterminate-disabled: if(
923
+ $_indeterminate,
924
+ map-get($_indeterminate, disabled),
925
+ null
926
+ );
714
927
 
715
- ~ .custom-control-label::after {
716
- @include clay-css(
717
- map-deep-get(
718
- $map,
719
- indeterminate,
720
- disabled,
721
- custom-control-label,
722
- after
723
- )
724
- );
725
- }
928
+ @if ($_indeterminate-disabled) {
929
+ &:indeterminate[disabled],
930
+ &:indeterminate:disabled {
931
+ @include clay-css($_indeterminate-disabled);
726
932
 
727
- ~ .card {
728
- @include clay-card-variant(
729
- map-deep-get($map, indeterminate, disabled, card)
933
+ $_custom-control-label: map-get(
934
+ $_indeterminate-disabled,
935
+ custom-control-label
730
936
  );
937
+
938
+ @if ($_custom-control-label) {
939
+ ~ .custom-control-label {
940
+ @include clay-css($_custom-control-label);
941
+
942
+ $_before: map-get($_custom-control-label, before);
943
+
944
+ @if ($_before) {
945
+ &::before {
946
+ @include clay-css($_before);
947
+ }
948
+ }
949
+
950
+ $_after: map-get($_custom-control-label, after);
951
+
952
+ @if ($_after) {
953
+ &::after {
954
+ @include clay-css($_after);
955
+ }
956
+ }
957
+ }
958
+ }
959
+
960
+ $_card: map-get($_indeterminate-disabled, card);
961
+
962
+ @if ($_card) {
963
+ ~ .card {
964
+ @include clay-card-variant($_card);
965
+ }
966
+ }
731
967
  }
732
968
  }
733
969
 
734
- &:indeterminate[readonly] {
735
- ~ .custom-control-label::before {
736
- @include clay-css(
737
- map-deep-get(
738
- $map,
739
- indeterminate,
740
- readonly,
741
- custom-control-label,
742
- before
743
- )
744
- );
745
- }
970
+ $_indeterminate-readonly: if(
971
+ $_indeterminate,
972
+ map-get($_indeterminate, readonly),
973
+ null
974
+ );
746
975
 
747
- ~ .custom-control-label::after {
748
- @include clay-css(
749
- map-deep-get(
750
- $map,
751
- indeterminate,
752
- readonly,
753
- custom-control-label,
754
- after
755
- )
756
- );
757
- }
976
+ @if ($_indeterminate-readonly) {
977
+ &:indeterminate[readonly] {
978
+ @include clay-css($_indeterminate-readonly);
758
979
 
759
- ~ .card {
760
- @include clay-card-variant(
761
- map-deep-get($map, indeterminate, readonly, card)
980
+ $_custom-control-label: map-get(
981
+ $_indeterminate-readonly,
982
+ custom-control-label
762
983
  );
984
+
985
+ @if ($_custom-control-label) {
986
+ ~ .custom-control-label {
987
+ @include clay-css($_custom-control-label);
988
+
989
+ $_before: map-get($_custom-control-label, before);
990
+
991
+ @if ($_before) {
992
+ &::before {
993
+ @include clay-css($_before);
994
+ }
995
+ }
996
+
997
+ $_after: map-get($_custom-control-label, after);
998
+
999
+ @if ($_after) {
1000
+ &::after {
1001
+ @include clay-css($_after);
1002
+ }
1003
+ }
1004
+ }
1005
+ }
1006
+
1007
+ $_card: map-get($_indeterminate-readonly, card);
1008
+
1009
+ @if ($_card) {
1010
+ ~ .card {
1011
+ @include clay-card-variant($_card);
1012
+ }
1013
+ }
763
1014
  }
764
1015
  }
765
1016
 
766
- &:indeterminate[readonly][disabled] {
767
- ~ .custom-control-label::before {
768
- @include clay-css(
769
- map-deep-get(
770
- $map,
771
- indeterminate,
772
- readonly,
773
- disabled,
774
- custom-control-label,
775
- before
776
- )
777
- );
778
- }
1017
+ $_indeterminate-readonly-disabled: if(
1018
+ $_indeterminate-readonly,
1019
+ map-get($_indeterminate-readonly, disabled),
1020
+ null
1021
+ );
779
1022
 
780
- ~ .custom-control-label::after {
781
- @include clay-css(
782
- map-deep-get(
783
- $map,
784
- indeterminate,
785
- readonly,
786
- disabled,
787
- custom-control-label,
788
- after
789
- )
790
- );
791
- }
1023
+ @if ($_indeterminate-readonly-disabled) {
1024
+ &:indeterminate[readonly][disabled] {
1025
+ @include clay-css($_indeterminate-readonly-disabled);
792
1026
 
793
- ~ .card {
794
- @include clay-card-variant(
795
- map-deep-get(
796
- $map,
797
- indeterminate,
798
- readonly,
799
- disabled,
800
- card
801
- )
1027
+ $_custom-control-label: map-get(
1028
+ $_indeterminate-readonly-disabled,
1029
+ custom-control-label
802
1030
  );
1031
+
1032
+ @if ($_custom-control-label) {
1033
+ ~ .custom-control-label {
1034
+ @include clay-css($_custom-control-label);
1035
+
1036
+ $_before: map-get($_custom-control-label, before);
1037
+
1038
+ @if ($_before) {
1039
+ &::before {
1040
+ @include clay-css($_before);
1041
+ }
1042
+ }
1043
+
1044
+ $_after: map-get($_custom-control-label, after);
1045
+
1046
+ @if ($_after) {
1047
+ &::after {
1048
+ @include clay-css($_after);
1049
+ }
1050
+ }
1051
+ }
1052
+ }
1053
+
1054
+ $_card: map-get($_indeterminate-readonly-disabled, card);
1055
+
1056
+ @if ($_card) {
1057
+ ~ .card {
1058
+ @include clay-card-variant($_card);
1059
+ }
1060
+ }
803
1061
  }
804
1062
  }
805
1063
  }
@@ -926,46 +1184,71 @@
926
1184
  @if (type-of($map) == 'map') {
927
1185
  $enabled: setter(map-get($map, enabled), true);
928
1186
 
929
- @include clay-css($map);
930
-
931
1187
  @if ($enabled) {
932
- label {
933
- @include clay-css(map-deep-get($map, label));
1188
+ @if (length($map) != 0) {
1189
+ @include clay-css($map);
934
1190
  }
935
1191
 
936
- .custom-control-label {
937
- @include clay-css(map-deep-get($map, custom-control-label));
1192
+ $_label: map-get($map, label);
938
1193
 
939
- &::before {
940
- @include clay-css(
941
- map-deep-get($map, custom-control-label, before)
942
- );
1194
+ @if ($_label) {
1195
+ label {
1196
+ @include clay-css($_label);
943
1197
  }
1198
+ }
944
1199
 
945
- &::after {
946
- @include clay-css(
947
- map-deep-get($map, custom-control-label, after)
948
- );
1200
+ $_custom-control-label: map-get($map, custom-control-label);
1201
+
1202
+ @if ($_custom-control-label) {
1203
+ .custom-control-label {
1204
+ @include clay-css($_custom-control-label);
1205
+
1206
+ $_before: map-get($_custom-control-label, before);
1207
+
1208
+ @if ($_before) {
1209
+ &::before {
1210
+ @include clay-css($_before);
1211
+ }
1212
+ }
1213
+
1214
+ $_after: map-get($_custom-control-label, after);
1215
+
1216
+ @if ($_after) {
1217
+ &::after {
1218
+ @include clay-css($_after);
1219
+ }
1220
+ }
949
1221
  }
950
1222
  }
951
1223
 
952
- .custom-control-label-text {
953
- @include clay-css(
954
- map-deep-get($map, custom-control-label-text)
955
- );
1224
+ $_custom-control-label-text: map-get(
1225
+ $map,
1226
+ custom-control-label-text
1227
+ );
956
1228
 
957
- small,
958
- .small {
959
- @include clay-css(
960
- map-deep-get($map, custom-control-label-text, small)
961
- );
1229
+ @if ($_custom-control-label-text) {
1230
+ .custom-control-label-text {
1231
+ @include clay-css($_custom-control-label-text);
1232
+
1233
+ $_small: map-get($_custom-control-label-text, small);
1234
+
1235
+ @if ($_small) {
1236
+ small,
1237
+ .small {
1238
+ @include clay-css($_small);
1239
+ }
1240
+ }
962
1241
  }
963
1242
  }
964
1243
 
965
- .custom-control-input {
966
- @include clay-custom-control-input-variant(
967
- map-deep-get($map, custom-control-input)
968
- );
1244
+ $_custom-control-input: map-get($map, custom-control-input);
1245
+
1246
+ @if ($_custom-control-input) {
1247
+ .custom-control-input {
1248
+ @include clay-custom-control-input-variant(
1249
+ $_custom-control-input
1250
+ );
1251
+ }
969
1252
  }
970
1253
  }
971
1254
  }