@clayui/css 3.41.0 → 3.44.1

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 (78) hide show
  1. package/lib/css/atlas.css +1117 -1163
  2. package/lib/css/atlas.css.map +1 -1
  3. package/lib/css/base.css +1020 -1068
  4. package/lib/css/base.css.map +1 -1
  5. package/lib/css/bootstrap.css.map +1 -1
  6. package/lib/css/cadmin.css +875 -931
  7. package/lib/css/cadmin.css.map +1 -1
  8. package/lib/images/icons/date-time.svg +12 -0
  9. package/lib/images/icons/filter.svg +1 -1
  10. package/lib/images/icons/icons.svg +1 -1
  11. package/package.json +2 -2
  12. package/src/images/icons/date-time.svg +12 -0
  13. package/src/images/icons/filter.svg +1 -1
  14. package/src/scss/_mixins.scss +2 -0
  15. package/src/scss/atlas/variables/_application-bar.scss +32 -12
  16. package/src/scss/atlas/variables/_buttons.scss +2 -31
  17. package/src/scss/atlas/variables/_management-bar.scss +53 -21
  18. package/src/scss/atlas/variables/_navigation-bar.scss +104 -18
  19. package/src/scss/atlas/variables/_navs.scss +20 -15
  20. package/src/scss/atlas/variables/_pagination.scss +2 -0
  21. package/src/scss/atlas/variables/_sidebar.scss +1 -1
  22. package/src/scss/cadmin/components/_dropdowns.scss +4 -0
  23. package/src/scss/cadmin/components/_input-groups.scss +12 -312
  24. package/src/scss/cadmin/components/_navs.scss +35 -113
  25. package/src/scss/cadmin/components/_pagination.scss +20 -236
  26. package/src/scss/cadmin/components/_popovers.scss +31 -252
  27. package/src/scss/cadmin/components/_tooltip.scss +29 -167
  28. package/src/scss/cadmin/components/_utilities-functional-important.scss +4 -3
  29. package/src/scss/cadmin/variables/_alerts.scss +3 -2
  30. package/src/scss/cadmin/variables/_dropdowns.scss +31 -2
  31. package/src/scss/cadmin/variables/_forms.scss +366 -5
  32. package/src/scss/cadmin/variables/_management-bar.scss +70 -30
  33. package/src/scss/cadmin/variables/_navigation-bar.scss +118 -22
  34. package/src/scss/cadmin/variables/_navs.scss +270 -53
  35. package/src/scss/cadmin/variables/_pagination.scss +274 -68
  36. package/src/scss/cadmin/variables/_popovers.scss +410 -0
  37. package/src/scss/cadmin/variables/_sidebar.scss +17 -5
  38. package/src/scss/cadmin/variables/_tooltip.scss +299 -0
  39. package/src/scss/components/_button-groups.scss +6 -6
  40. package/src/scss/components/_buttons.scss +87 -49
  41. package/src/scss/components/_cards.scss +16 -116
  42. package/src/scss/components/_dropdowns.scss +4 -0
  43. package/src/scss/components/_input-groups.scss +12 -308
  44. package/src/scss/components/_multi-step-nav.scss +12 -8
  45. package/src/scss/components/_navs.scss +45 -128
  46. package/src/scss/components/_pagination.scss +18 -234
  47. package/src/scss/components/_popovers.scss +30 -237
  48. package/src/scss/components/_toggle-switch.scss +2 -2
  49. package/src/scss/components/_tooltip.scss +29 -164
  50. package/src/scss/functions/_lx-icons-generated.scss +3 -1
  51. package/src/scss/mixins/_buttons.scss +674 -472
  52. package/src/scss/mixins/_cards.scss +751 -557
  53. package/src/scss/mixins/_close.scss +0 -1
  54. package/src/scss/mixins/_custom-forms.scss +442 -409
  55. package/src/scss/mixins/_dropdown-menu.scss +483 -406
  56. package/src/scss/mixins/_forms.scss +332 -256
  57. package/src/scss/mixins/_input-groups.scss +405 -11
  58. package/src/scss/mixins/_labels.scss +320 -296
  59. package/src/scss/mixins/_links.scss +522 -476
  60. package/src/scss/mixins/_nav.scss +202 -131
  61. package/src/scss/mixins/_navbar.scss +791 -140
  62. package/src/scss/mixins/_pagination.scss +422 -0
  63. package/src/scss/mixins/_popovers.scss +90 -0
  64. package/src/scss/mixins/_toggle-switch.scss +64 -0
  65. package/src/scss/mixins/_tooltip.scss +70 -0
  66. package/src/scss/variables/_alerts.scss +1 -0
  67. package/src/scss/variables/_application-bar.scss +18 -6
  68. package/src/scss/variables/_buttons.scss +26 -3
  69. package/src/scss/variables/_cards.scss +273 -1
  70. package/src/scss/variables/_dropdowns.scss +31 -2
  71. package/src/scss/variables/_forms.scss +405 -22
  72. package/src/scss/variables/_management-bar.scss +45 -12
  73. package/src/scss/variables/_navigation-bar.scss +95 -14
  74. package/src/scss/variables/_navs.scss +266 -33
  75. package/src/scss/variables/_pagination.scss +261 -61
  76. package/src/scss/variables/_popovers.scss +392 -0
  77. package/src/scss/variables/_sidebar.scss +17 -5
  78. package/src/scss/variables/_tooltip.scss +299 -0
package/src/scss/mixins/_custom-forms.scss CHANGED
@@ -100,401 +100,437 @@
100
100
  /// );
101
101
 
102
102
  @mixin clay-custom-control-input-variant($map) {
103
- $enabled: setter(map-get($map, enabled), true);
103
+ @if (type-of($map) == 'map') {
104
+ $enabled: setter(map-get($map, enabled), true);
104
105
 
105
- @if ($enabled) {
106
- @include clay-css(setter($map, ()));
106
+ @if ($enabled) {
107
+ @include clay-css($map);
107
108
 
108
- ~ .custom-control-label::before {
109
- @include clay-css(
110
- setter(map-deep-get($map, custom-control-label, before), ())
111
- );
112
- }
113
-
114
- ~ .custom-control-label::after {
115
- @include clay-css(
116
- setter(map-deep-get($map, custom-control-label, after), ())
117
- );
118
- }
119
-
120
- &:hover ~ .custom-control-label::before {
121
- @include clay-css(
122
- setter(
123
- map-deep-get($map, hover, custom-control-label, before),
124
- ()
125
- )
126
- );
127
- }
128
-
129
- &:hover ~ .custom-control-label::after {
130
- @include clay-css(
131
- setter(
132
- map-deep-get($map, hover, custom-control-label, after),
133
- ()
134
- )
135
- );
136
- }
137
-
138
- &:focus ~ .custom-control-label::before {
139
- @include clay-css(
140
- setter(
141
- map-deep-get($map, focus, custom-control-label, before),
142
- ()
143
- )
144
- );
145
- }
146
-
147
- &:focus ~ .custom-control-label::after {
148
- @include clay-css(
149
- setter(
150
- map-deep-get($map, focus, custom-control-label, after),
151
- ()
152
- )
153
- );
154
- }
155
-
156
- &:active ~ .custom-control-label::before {
157
- @include clay-css(
158
- setter(
159
- map-deep-get($map, active, custom-control-label, before),
160
- ()
161
- )
162
- );
163
- }
164
-
165
- &:active ~ .custom-control-label::after {
166
- @include clay-css(
167
- setter(
168
- map-deep-get($map, active, custom-control-label, after),
169
- ()
170
- )
171
- );
172
- }
173
-
174
- // Use [disabled] and :disabled to work around https://github.com/twbs/bootstrap/issues/28247
175
-
176
- &[disabled],
177
- &:disabled {
178
- @include clay-css(setter(map-deep-get($map, disabled), ()));
179
-
180
- ~ .custom-control-label {
109
+ ~ .custom-control-label::before {
181
110
  @include clay-css(
182
- setter(
183
- map-deep-get($map, disabled, custom-control-label),
184
- ()
185
- )
111
+ map-deep-get($map, custom-control-label, before)
186
112
  );
187
113
  }
188
- }
189
114
 
190
- &[disabled] ~ .custom-control-label::before,
191
- &:disabled ~ .custom-control-label::before {
192
- @include clay-css(
193
- setter(
194
- map-deep-get($map, disabled, custom-control-label, before),
195
- ()
196
- )
197
- );
198
- }
199
-
200
- &[disabled] ~ .custom-control-label::after,
201
- &:disabled ~ .custom-control-label::after {
202
- @include clay-css(
203
- setter(
204
- map-deep-get($map, disabled, custom-control-label, after),
205
- ()
206
- )
207
- );
208
- }
209
-
210
- &:checked ~ .custom-control-label::before {
211
- @include clay-css(
212
- setter(
213
- map-deep-get($map, checked, custom-control-label, before),
214
- ()
215
- )
216
- );
217
- }
218
-
219
- &:checked ~ .custom-control-label::after {
220
- @include clay-css(
221
- setter(
222
- map-deep-get($map, checked, custom-control-label, after),
223
- ()
224
- )
225
- );
226
- }
227
-
228
- &:checked:hover ~ .custom-control-label::before {
229
- @include clay-css(
230
- setter(
231
- map-deep-get(
232
- $map,
233
- checked,
234
- hover,
235
- custom-control-label,
236
- before
237
- ),
238
- ()
239
- )
240
- );
241
- }
242
-
243
- &:checked:hover ~ .custom-control-label::after {
244
- @include clay-css(
245
- setter(
246
- map-deep-get(
247
- $map,
248
- checked,
249
- hover,
250
- custom-control-label,
251
- after
252
- ),
253
- ()
254
- )
255
- );
256
- }
257
-
258
- &:checked:focus ~ .custom-control-label::before {
259
- @include clay-css(
260
- setter(
261
- map-deep-get(
262
- $map,
263
- checked,
264
- focus,
265
- custom-control-label,
266
- before
267
- ),
268
- ()
269
- )
270
- );
271
- }
115
+ ~ .custom-control-label::after {
116
+ @include clay-css(
117
+ map-deep-get($map, custom-control-label, after)
118
+ );
119
+ }
272
120
 
273
- &:checked:focus ~ .custom-control-label::after {
274
- @include clay-css(
275
- setter(
276
- map-deep-get(
277
- $map,
278
- checked,
279
- focus,
280
- custom-control-label,
281
- after
282
- ),
283
- ()
284
- )
285
- );
286
- }
121
+ ~ .card {
122
+ @include clay-card-variant(map-deep-get($map, card));
123
+ }
287
124
 
288
- &:checked:active ~ .custom-control-label::before {
289
- @include clay-css(
290
- setter(
291
- map-deep-get(
292
- $map,
293
- checked,
294
- active,
295
- custom-control-label,
296
- before
297
- ),
298
- ()
299
- )
300
- );
301
- }
125
+ &:hover {
126
+ ~ .custom-control-label::before {
127
+ @include clay-css(
128
+ map-deep-get($map, hover, custom-control-label, before)
129
+ );
130
+ }
131
+
132
+ ~ .custom-control-label::after {
133
+ @include clay-css(
134
+ map-deep-get($map, hover, custom-control-label, after)
135
+ );
136
+ }
137
+
138
+ ~ .card {
139
+ @include clay-card-variant(map-deep-get($map, hover, card));
140
+ }
141
+ }
302
142
 
303
- &:checked:active ~ .custom-control-label::after {
304
- @include clay-css(
305
- setter(
306
- map-deep-get(
307
- $map,
308
- checked,
309
- active,
310
- custom-control-label,
311
- after
312
- ),
313
- ()
314
- )
315
- );
316
- }
143
+ &:focus {
144
+ ~ .custom-control-label::before {
145
+ @include clay-css(
146
+ map-deep-get($map, focus, custom-control-label, before)
147
+ );
148
+ }
149
+
150
+ ~ .custom-control-label::after {
151
+ @include clay-css(
152
+ map-deep-get($map, focus, custom-control-label, after)
153
+ );
154
+ }
155
+
156
+ ~ .card {
157
+ @include clay-card-variant(map-deep-get($map, focus, card));
158
+ }
159
+ }
317
160
 
318
- &:checked[disabled] ~ .custom-control-label::before,
319
- &:checked:disabled ~ .custom-control-label::before {
320
- @include clay-css(
321
- setter(
322
- map-deep-get(
323
- $map,
324
- checked,
325
- disabled,
326
- custom-control-label,
327
- before
328
- ),
329
- ()
330
- )
331
- );
332
- }
161
+ &:active {
162
+ ~ .custom-control-label::before {
163
+ @include clay-css(
164
+ map-deep-get($map, active, custom-control-label, before)
165
+ );
166
+ }
167
+
168
+ ~ .custom-control-label::after {
169
+ @include clay-css(
170
+ map-deep-get($map, active, custom-control-label, after)
171
+ );
172
+ }
173
+
174
+ ~ .card {
175
+ @include clay-card-variant(
176
+ map-deep-get($map, active, card)
177
+ );
178
+ }
179
+ }
333
180
 
334
- &:checked[disabled] ~ .custom-control-label::after,
335
- &:checked:disabled ~ .custom-control-label::after {
336
- @include clay-css(
337
- setter(
338
- map-deep-get(
339
- $map,
340
- checked,
341
- disabled,
342
- custom-control-label,
343
- after
344
- ),
345
- ()
346
- )
347
- );
348
- }
181
+ // Use [disabled] and :disabled to work around https://github.com/twbs/bootstrap/issues/28247
182
+
183
+ &[disabled],
184
+ &:disabled {
185
+ @include clay-css(map-deep-get($map, disabled));
186
+
187
+ ~ .custom-control-label {
188
+ @include clay-css(
189
+ map-deep-get($map, disabled, custom-control-label)
190
+ );
191
+ }
192
+
193
+ ~ .custom-control-label::before {
194
+ @include clay-css(
195
+ map-deep-get(
196
+ $map,
197
+ disabled,
198
+ custom-control-label,
199
+ before
200
+ )
201
+ );
202
+ }
203
+
204
+ ~ .custom-control-label::after {
205
+ @include clay-css(
206
+ map-deep-get(
207
+ $map,
208
+ disabled,
209
+ custom-control-label,
210
+ after
211
+ )
212
+ );
213
+ }
214
+
215
+ ~ .card {
216
+ @include clay-card-variant(
217
+ map-deep-get($map, disabled, card)
218
+ );
219
+ }
220
+ }
349
221
 
350
- &:indeterminate ~ .custom-control-label::before {
351
- @include clay-css(
352
- setter(
353
- map-deep-get(
354
- $map,
355
- indeterminate,
356
- custom-control-label,
357
- before
358
- ),
359
- ()
360
- )
361
- );
362
- }
222
+ &:checked {
223
+ ~ .custom-control-label::before {
224
+ @include clay-css(
225
+ map-deep-get(
226
+ $map,
227
+ checked,
228
+ custom-control-label,
229
+ before
230
+ )
231
+ );
232
+ }
233
+
234
+ ~ .custom-control-label::after {
235
+ @include clay-css(
236
+ map-deep-get($map, checked, custom-control-label, after)
237
+ );
238
+ }
239
+
240
+ ~ .card {
241
+ @include clay-card-variant(
242
+ map-deep-get($map, checked, card)
243
+ );
244
+ }
245
+ }
363
246
 
364
- &:indeterminate ~ .custom-control-label::after {
365
- @include clay-css(
366
- setter(
367
- map-deep-get(
368
- $map,
369
- indeterminate,
370
- custom-control-label,
371
- after
372
- ),
373
- ()
374
- )
375
- );
376
- }
247
+ &:checked:hover {
248
+ ~ .custom-control-label::before {
249
+ @include clay-css(
250
+ map-deep-get(
251
+ $map,
252
+ checked,
253
+ hover,
254
+ custom-control-label,
255
+ before
256
+ )
257
+ );
258
+ }
259
+
260
+ ~ .custom-control-label::after {
261
+ @include clay-css(
262
+ map-deep-get(
263
+ $map,
264
+ checked,
265
+ hover,
266
+ custom-control-label,
267
+ after
268
+ )
269
+ );
270
+ }
271
+
272
+ ~ .card {
273
+ @include clay-card-variant(
274
+ map-deep-get($map, checked, hover, card)
275
+ );
276
+ }
277
+ }
377
278
 
378
- &:indeterminate:hover ~ .custom-control-label::before {
379
- @include clay-css(
380
- setter(
381
- map-deep-get(
382
- $map,
383
- indeterminate,
384
- hover,
385
- custom-control-label,
386
- before
387
- ),
388
- ()
389
- )
390
- );
391
- }
279
+ &:checked:focus {
280
+ ~ .custom-control-label::before {
281
+ @include clay-css(
282
+ map-deep-get(
283
+ $map,
284
+ checked,
285
+ focus,
286
+ custom-control-label,
287
+ before
288
+ )
289
+ );
290
+ }
291
+
292
+ ~ .custom-control-label::after {
293
+ @include clay-css(
294
+ map-deep-get(
295
+ $map,
296
+ checked,
297
+ focus,
298
+ custom-control-label,
299
+ after
300
+ )
301
+ );
302
+ }
303
+
304
+ ~ .card {
305
+ @include clay-card-variant(
306
+ map-deep-get($map, checked, focus, card)
307
+ );
308
+ }
309
+ }
392
310
 
393
- &:indeterminate:hover ~ .custom-control-label::after {
394
- @include clay-css(
395
- setter(
396
- map-deep-get(
397
- $map,
398
- indeterminate,
399
- hover,
400
- custom-control-label,
401
- after
402
- ),
403
- ()
404
- )
405
- );
406
- }
311
+ &:checked:active {
312
+ ~ .custom-control-label::before {
313
+ @include clay-css(
314
+ map-deep-get(
315
+ $map,
316
+ checked,
317
+ active,
318
+ custom-control-label,
319
+ before
320
+ )
321
+ );
322
+ }
323
+
324
+ ~ .custom-control-label::after {
325
+ @include clay-css(
326
+ map-deep-get(
327
+ $map,
328
+ checked,
329
+ active,
330
+ custom-control-label,
331
+ after
332
+ )
333
+ );
334
+ }
335
+
336
+ ~ .card {
337
+ @include clay-card-variant(
338
+ map-deep-get($map, checked, active, card)
339
+ );
340
+ }
341
+ }
407
342
 
408
- &:indeterminate:focus ~ .custom-control-label::before {
409
- @include clay-css(
410
- setter(
411
- map-deep-get(
412
- $map,
413
- indeterminate,
414
- focus,
415
- custom-control-label,
416
- before
417
- ),
418
- ()
419
- )
420
- );
421
- }
343
+ &:checked[disabled],
344
+ &:checked:disabled {
345
+ ~ .custom-control-label::before {
346
+ @include clay-css(
347
+ map-deep-get(
348
+ $map,
349
+ checked,
350
+ disabled,
351
+ custom-control-label,
352
+ before
353
+ )
354
+ );
355
+ }
356
+
357
+ ~ .custom-control-label::after {
358
+ @include clay-css(
359
+ map-deep-get(
360
+ $map,
361
+ checked,
362
+ disabled,
363
+ custom-control-label,
364
+ after
365
+ )
366
+ );
367
+ }
368
+
369
+ ~ .card {
370
+ @include clay-card-variant(
371
+ map-deep-get($map, checked, disabled, card)
372
+ );
373
+ }
374
+ }
422
375
 
423
- &:indeterminate:focus ~ .custom-control-label::after {
424
- @include clay-css(
425
- setter(
426
- map-deep-get(
427
- $map,
428
- indeterminate,
429
- focus,
430
- custom-control-label,
431
- after
432
- ),
433
- ()
434
- )
435
- );
436
- }
376
+ &:indeterminate {
377
+ ~ .custom-control-label::before {
378
+ @include clay-css(
379
+ map-deep-get(
380
+ $map,
381
+ indeterminate,
382
+ custom-control-label,
383
+ before
384
+ )
385
+ );
386
+ }
387
+
388
+ ~ .custom-control-label::after {
389
+ @include clay-css(
390
+ map-deep-get(
391
+ $map,
392
+ indeterminate,
393
+ custom-control-label,
394
+ after
395
+ )
396
+ );
397
+ }
398
+
399
+ ~ .card {
400
+ @include clay-card-variant(
401
+ map-deep-get($map, indeterminate, card)
402
+ );
403
+ }
404
+ }
437
405
 
438
- &:indeterminate:active ~ .custom-control-label::before {
439
- @include clay-css(
440
- setter(
441
- map-deep-get(
442
- $map,
443
- indeterminate,
444
- active,
445
- custom-control-label,
446
- before
447
- ),
448
- ()
449
- )
450
- );
451
- }
406
+ &:indeterminate:hover {
407
+ ~ .custom-control-label::before {
408
+ @include clay-css(
409
+ map-deep-get(
410
+ $map,
411
+ indeterminate,
412
+ hover,
413
+ custom-control-label,
414
+ before
415
+ )
416
+ );
417
+ }
418
+
419
+ ~ .custom-control-label::after {
420
+ @include clay-css(
421
+ map-deep-get(
422
+ $map,
423
+ indeterminate,
424
+ hover,
425
+ custom-control-label,
426
+ after
427
+ )
428
+ );
429
+ }
430
+
431
+ ~ .card {
432
+ @include clay-card-variant(
433
+ map-deep-get($map, indeterminate, hover, card)
434
+ );
435
+ }
436
+ }
452
437
 
453
- &:indeterminate:active ~ .custom-control-label::after {
454
- @include clay-css(
455
- setter(
456
- map-deep-get(
457
- $map,
458
- indeterminate,
459
- active,
460
- custom-control-label,
461
- after
462
- ),
463
- ()
464
- )
465
- );
466
- }
438
+ &:indeterminate:focus {
439
+ ~ .custom-control-label::before {
440
+ @include clay-css(
441
+ map-deep-get(
442
+ $map,
443
+ indeterminate,
444
+ focus,
445
+ custom-control-label,
446
+ before
447
+ )
448
+ );
449
+ }
450
+
451
+ ~ .custom-control-label::after {
452
+ @include clay-css(
453
+ map-deep-get(
454
+ $map,
455
+ indeterminate,
456
+ focus,
457
+ custom-control-label,
458
+ after
459
+ )
460
+ );
461
+ }
462
+
463
+ ~ .card {
464
+ @include clay-card-variant(
465
+ map-deep-get($map, indeterminate, focus, card)
466
+ );
467
+ }
468
+ }
467
469
 
468
- &:indeterminate[disabled] ~ .custom-control-label::before,
469
- &:indeterminate:disabled ~ .custom-control-label::before {
470
- @include clay-css(
471
- setter(
472
- map-deep-get(
473
- $map,
474
- indeterminate,
475
- disabled,
476
- custom-control-label,
477
- before
478
- ),
479
- ()
480
- )
481
- );
482
- }
470
+ &:indeterminate:active {
471
+ ~ .custom-control-label::before {
472
+ @include clay-css(
473
+ map-deep-get(
474
+ $map,
475
+ indeterminate,
476
+ active,
477
+ custom-control-label,
478
+ before
479
+ )
480
+ );
481
+ }
482
+
483
+ ~ .custom-control-label::after {
484
+ @include clay-css(
485
+ map-deep-get(
486
+ $map,
487
+ indeterminate,
488
+ active,
489
+ custom-control-label,
490
+ after
491
+ )
492
+ );
493
+ }
494
+
495
+ ~ .card {
496
+ @include clay-card-variant(
497
+ map-deep-get($map, indeterminate, active, card)
498
+ );
499
+ }
500
+ }
483
501
 
484
- &:indeterminate[disabled] ~ .custom-control-label::after,
485
- &:indeterminate:disabled ~ .custom-control-label::after {
486
- @include clay-css(
487
- setter(
488
- map-deep-get(
489
- $map,
490
- indeterminate,
491
- disabled,
492
- custom-control-label,
493
- after
494
- ),
495
- ()
496
- )
497
- );
502
+ &:indeterminate[disabled],
503
+ &:indeterminate:disabled {
504
+ ~ .custom-control-label::before {
505
+ @include clay-css(
506
+ map-deep-get(
507
+ $map,
508
+ indeterminate,
509
+ disabled,
510
+ custom-control-label,
511
+ before
512
+ )
513
+ );
514
+ }
515
+
516
+ ~ .custom-control-label::after {
517
+ @include clay-css(
518
+ map-deep-get(
519
+ $map,
520
+ indeterminate,
521
+ disabled,
522
+ custom-control-label,
523
+ after
524
+ )
525
+ );
526
+ }
527
+
528
+ ~ .card {
529
+ @include clay-card-variant(
530
+ map-deep-get($map, indeterminate, disabled, card)
531
+ );
532
+ }
533
+ }
498
534
  }
499
535
  }
500
536
  }
@@ -616,53 +652,50 @@
616
652
  /// );
617
653
 
618
654
  @mixin clay-custom-control-variant($map) {
619
- $enabled: setter(map-get($map, enabled), true);
655
+ @if (type-of($map) == 'map') {
656
+ $enabled: setter(map-get($map, enabled), true);
620
657
 
621
- @include clay-css(setter($map, ()));
658
+ @include clay-css($map);
622
659
 
623
- @if ($enabled) {
624
- label {
625
- @include clay-css(setter(map-deep-get($map, label), ()));
626
- }
660
+ @if ($enabled) {
661
+ label {
662
+ @include clay-css(map-deep-get($map, label));
663
+ }
627
664
 
628
- .custom-control-label {
629
- @include clay-css(
630
- setter(map-deep-get($map, custom-control-label), ())
631
- );
665
+ .custom-control-label {
666
+ @include clay-css(map-deep-get($map, custom-control-label));
632
667
 
633
- &::before {
634
- @include clay-css(
635
- setter(map-deep-get($map, custom-control-label, before), ())
636
- );
668
+ &::before {
669
+ @include clay-css(
670
+ map-deep-get($map, custom-control-label, before)
671
+ );
672
+ }
673
+
674
+ &::after {
675
+ @include clay-css(
676
+ map-deep-get($map, custom-control-label, after)
677
+ );
678
+ }
637
679
  }
638
680
 
639
- &::after {
681
+ .custom-control-label-text {
640
682
  @include clay-css(
641
- setter(map-deep-get($map, custom-control-label, after), ())
683
+ map-deep-get($map, custom-control-label-text)
642
684
  );
643
- }
644
- }
645
685
 
646
- .custom-control-label-text {
647
- @include clay-css(
648
- setter(map-deep-get($map, custom-control-label-text), ())
649
- );
686
+ small,
687
+ .small {
688
+ @include clay-css(
689
+ map-deep-get($map, custom-control-label-text, small)
690
+ );
691
+ }
692
+ }
650
693
 
651
- small,
652
- .small {
653
- @include clay-css(
654
- setter(
655
- map-deep-get($map, custom-control-label-text, small),
656
- ()
657
- )
694
+ .custom-control-input {
695
+ @include clay-custom-control-input-variant(
696
+ map-deep-get($map, custom-control-input)
658
697
  );
659
698
  }
660
699
  }
661
-
662
- .custom-control-input {
663
- @include clay-custom-control-input-variant(
664
- setter(map-deep-get($map, custom-control-input), ())
665
- );
666
- }
667
700
  }
668
701
  }