@clayui/css 3.42.0 → 3.44.2

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 (42) hide show
  1. package/lib/css/atlas.css +405 -172
  2. package/lib/css/atlas.css.map +1 -1
  3. package/lib/css/base.css +382 -151
  4. package/lib/css/base.css.map +1 -1
  5. package/lib/css/bootstrap.css.map +1 -1
  6. package/lib/css/cadmin.css +234 -116
  7. package/lib/css/cadmin.css.map +1 -1
  8. package/lib/images/icons/date-time.svg +12 -0
  9. package/lib/images/icons/icons.svg +1 -1
  10. package/package.json +2 -2
  11. package/src/images/icons/date-time.svg +12 -0
  12. package/src/scss/atlas/variables/_buttons.scss +2 -31
  13. package/src/scss/atlas/variables/_navs.scss +20 -15
  14. package/src/scss/cadmin/components/_dropdowns.scss +4 -0
  15. package/src/scss/cadmin/components/_input-groups.scss +12 -312
  16. package/src/scss/cadmin/components/_navs.scss +35 -113
  17. package/src/scss/cadmin/components/_utilities-functional-important.scss +4 -3
  18. package/src/scss/cadmin/variables/_alerts.scss +3 -2
  19. package/src/scss/cadmin/variables/_dropdowns.scss +31 -2
  20. package/src/scss/cadmin/variables/_forms.scss +366 -5
  21. package/src/scss/cadmin/variables/_navs.scss +271 -53
  22. package/src/scss/components/_buttons.scss +87 -49
  23. package/src/scss/components/_cards.scss +16 -116
  24. package/src/scss/components/_dropdowns.scss +4 -0
  25. package/src/scss/components/_input-groups.scss +12 -308
  26. package/src/scss/components/_navs.scss +45 -128
  27. package/src/scss/functions/_lx-icons-generated.scss +2 -0
  28. package/src/scss/mixins/_buttons.scss +27 -64
  29. package/src/scss/mixins/_cards.scss +751 -557
  30. package/src/scss/mixins/_custom-forms.scss +404 -383
  31. package/src/scss/mixins/_dropdown-menu.scss +427 -355
  32. package/src/scss/mixins/_forms.scss +67 -10
  33. package/src/scss/mixins/_input-groups.scss +405 -11
  34. package/src/scss/mixins/_labels.scss +320 -296
  35. package/src/scss/mixins/_nav.scss +202 -131
  36. package/src/scss/mixins/_navbar.scss +32 -0
  37. package/src/scss/variables/_alerts.scss +1 -0
  38. package/src/scss/variables/_buttons.scss +26 -3
  39. package/src/scss/variables/_cards.scss +273 -1
  40. package/src/scss/variables/_dropdowns.scss +31 -2
  41. package/src/scss/variables/_forms.scss +405 -22
  42. package/src/scss/variables/_navs.scss +266 -33
@@ -207,12 +207,284 @@ $card-rounded-circle-inner-border-radius: calc(
207
207
  #{$rounded-circle-border-radius} - #{$card-border-width}
208
208
  ) !default;
209
209
 
210
+ // .form-check-card
211
+
212
+ $form-check-card-checked-box-shadow: $input-btn-focus-box-shadow !default;
213
+
214
+ $form-check-card: () !default;
215
+ $form-check-card: map-deep-merge(
216
+ (
217
+ margin-bottom: $card-margin-bottom,
218
+ margin-top: 0,
219
+ padding-left: 0,
220
+ hover: (
221
+ card: (
222
+ box-shadow: $form-check-card-checked-box-shadow,
223
+ ),
224
+ ),
225
+ active: (
226
+ card: (
227
+ box-shadow: $form-check-card-checked-box-shadow,
228
+ ),
229
+ ),
230
+ checked: (
231
+ card: (
232
+ box-shadow: $form-check-card-checked-box-shadow,
233
+ ),
234
+ ),
235
+ card: (
236
+ margin-bottom: 0,
237
+ ),
238
+ form-check-input: (
239
+ margin-left: 0,
240
+ margin-top: 0,
241
+ opacity: 0,
242
+ position: absolute,
243
+ z-index: 1,
244
+ ),
245
+ form-check-label: (
246
+ color: $body-color,
247
+ display: inline,
248
+ font-weight: $font-weight-normal,
249
+ padding-left: 0,
250
+ position: static,
251
+ ),
252
+ custom-control: (
253
+ display: inline,
254
+ margin-right: 0,
255
+ position: static,
256
+ label: (
257
+ font-weight: $font-weight-normal,
258
+ padding-left: 0,
259
+ ),
260
+ custom-control-label: (
261
+ opacity: 0,
262
+ position: absolute,
263
+ z-index: 1,
264
+ before: (
265
+ top: 0,
266
+ ),
267
+ after: (
268
+ top: 0,
269
+ ),
270
+ ),
271
+ custom-control-input: (
272
+ z-index: 2,
273
+ checked: (
274
+ card: (
275
+ box-shadow: $form-check-card-checked-box-shadow,
276
+ ),
277
+ ),
278
+ ),
279
+ ),
280
+ ),
281
+ $form-check-card
282
+ );
283
+
284
+ // .form-check-bottom-left .card-horizontal > .card-body,
285
+ // .form-check-middle-left .card-horizontal > .card-body,
286
+ // .form-check-top-left .card-horizontal > .card-body
287
+
210
288
  $checkbox-left-card-padding: 40px !default;
289
+
290
+ // .form-check-bottom-right .card-horizontal > .card-body,
291
+ // .form-check-middle-right .card-horizontal > .card-body,
292
+ // .form-check-top-right .card-horizontal > .card-body
293
+
211
294
  $checkbox-right-card-padding: $checkbox-left-card-padding !default;
212
295
 
296
+ // Form Check Positions
297
+
213
298
  $checkbox-position: 1rem !default;
214
299
 
215
- $form-check-card-checked-box-shadow: $input-btn-focus-box-shadow !default;
300
+ // .form-check-bottom-left
301
+
302
+ $form-check-bottom-left: () !default;
303
+ $form-check-bottom-left: map-deep-merge(
304
+ (
305
+ form-check-input: (
306
+ bottom: $checkbox-position,
307
+ left: $checkbox-position,
308
+ opacity: 1,
309
+ top: auto,
310
+ transform: none,
311
+ ),
312
+ custom-control: (
313
+ custom-control-input: (
314
+ bottom: $checkbox-position,
315
+ left: $checkbox-position,
316
+ top: auto,
317
+ transform: none,
318
+ ),
319
+ custom-control-label: (
320
+ bottom: $checkbox-position,
321
+ left: $checkbox-position,
322
+ opacity: 1,
323
+ top: auto,
324
+ transform: none,
325
+ ),
326
+ ),
327
+ ),
328
+ $form-check-bottom-left
329
+ );
330
+
331
+ // .form-check-bottom-right
332
+
333
+ $form-check-bottom-right: () !default;
334
+ $form-check-bottom-right: map-deep-merge(
335
+ (
336
+ form-check-input: (
337
+ bottom: $checkbox-position,
338
+ left: auto,
339
+ opacity: 1,
340
+ right: $checkbox-position,
341
+ top: auto,
342
+ transform: none,
343
+ ),
344
+ custom-control: (
345
+ custom-control-input: (
346
+ bottom: $checkbox-position,
347
+ left: auto,
348
+ right: $checkbox-position,
349
+ top: auto,
350
+ transform: none,
351
+ ),
352
+ custom-control-label: (
353
+ bottom: $checkbox-position,
354
+ left: auto,
355
+ opacity: 1,
356
+ right: $checkbox-position,
357
+ top: auto,
358
+ transform: none,
359
+ ),
360
+ ),
361
+ ),
362
+ $form-check-bottom-right
363
+ );
364
+
365
+ // .form-check-middle-left
366
+
367
+ $form-check-middle-left: () !default;
368
+ $form-check-middle-left: map-deep-merge(
369
+ (
370
+ form-check-input: (
371
+ left: $checkbox-position,
372
+ margin-top: 0,
373
+ opacity: 1,
374
+ top: 50%,
375
+ transform: translateY(-50%),
376
+ ),
377
+ custom-control: (
378
+ custom-control-input: (
379
+ left: $checkbox-position,
380
+ margin-top: 0,
381
+ top: 50%,
382
+ transform: translateY(-50%),
383
+ ),
384
+ custom-control-label: (
385
+ left: $checkbox-position,
386
+ margin-top: 0,
387
+ opacity: 1,
388
+ top: 50%,
389
+ transform: translateY(-50%),
390
+ ),
391
+ ),
392
+ ),
393
+ $form-check-middle-left
394
+ );
395
+
396
+ // .form-check-middle-right
397
+
398
+ $form-check-middle-right: () !default;
399
+ $form-check-middle-right: map-deep-merge(
400
+ (
401
+ form-check-input: (
402
+ left: auto,
403
+ margin-top: 0,
404
+ opacity: 1,
405
+ right: $checkbox-position,
406
+ top: 50%,
407
+ transform: translateY(-50%),
408
+ ),
409
+ custom-control: (
410
+ custom-control-input: (
411
+ left: auto,
412
+ margin-top: 0,
413
+ right: $checkbox-position,
414
+ top: 50%,
415
+ transform: translateY(-50%),
416
+ ),
417
+ custom-control-label: (
418
+ left: auto,
419
+ margin-top: 0,
420
+ opacity: 1,
421
+ right: $checkbox-position,
422
+ top: 50%,
423
+ transform: translateY(-50%),
424
+ ),
425
+ ),
426
+ ),
427
+ $form-check-middle-right
428
+ );
429
+
430
+ // .form-check-top-right
431
+
432
+ $form-check-top-right: () !default;
433
+ $form-check-top-right: map-deep-merge(
434
+ (
435
+ form-check-input: (
436
+ left: auto,
437
+ opacity: 1,
438
+ right: $checkbox-position,
439
+ top: $checkbox-position,
440
+ transform: none,
441
+ ),
442
+ custom-control: (
443
+ custom-control-input: (
444
+ left: auto,
445
+ right: $checkbox-position,
446
+ top: $checkbox-position,
447
+ transform: none,
448
+ ),
449
+ custom-control-label: (
450
+ left: auto,
451
+ opacity: 1,
452
+ right: $checkbox-position,
453
+ top: $checkbox-position,
454
+ transform: none,
455
+ ),
456
+ ),
457
+ ),
458
+ $form-check-top-right
459
+ );
460
+
461
+ // .form-check-top-left
462
+
463
+ $form-check-top-left: () !default;
464
+ $form-check-top-left: map-deep-merge(
465
+ (
466
+ form-check-input: (
467
+ left: $checkbox-position,
468
+ opacity: 1,
469
+ top: $checkbox-position,
470
+ transform: none,
471
+ ),
472
+ custom-control: (
473
+ custom-control-input: (
474
+ left: $checkbox-position,
475
+ top: $checkbox-position,
476
+ transform: none,
477
+ ),
478
+ custom-control-label: (
479
+ left: $checkbox-position,
480
+ opacity: 1,
481
+ top: $checkbox-position,
482
+ transform: none,
483
+ ),
484
+ ),
485
+ ),
486
+ $form-check-top-left
487
+ );
216
488
 
217
489
  // Card Interactive
218
490
 
@@ -180,7 +180,6 @@ $dropdown-item-base: map-deep-merge(
180
180
  position: relative,
181
181
  text-align: inherit,
182
182
  transition: none,
183
- white-space: normal,
184
183
  width: 100%,
185
184
  word-wrap: break-word,
186
185
  hover: (
@@ -218,6 +217,23 @@ $dropdown-item-base: map-deep-merge(
218
217
  c-kbd-inline: (
219
218
  line-height: $dropdown-font-size * $line-height-base,
220
219
  ),
220
+ '&.autofit-row': (
221
+ padding-left: 1rem,
222
+ padding-right: 1rem,
223
+ autofit-col: (
224
+ padding-left: 0.25rem,
225
+ padding-right: 0.25rem,
226
+ ),
227
+ ),
228
+ autofit-row: (
229
+ margin-left: 0.25rem,
230
+ margin-right: 0.25rem,
231
+ width: auto,
232
+ autofit-col: (
233
+ padding-left: 0.25rem,
234
+ padding-right: 0.25rem,
235
+ ),
236
+ ),
221
237
  ),
222
238
  $dropdown-item-base
223
239
  );
@@ -736,7 +752,18 @@ $dropdown-full-wide-header-spacer-y: 20px !default;
736
752
 
737
753
  $dropdown-wide-width: 500px !default;
738
754
 
739
- // Dropdown Menu Width
755
+ // .dropdown-menu-width-shrink
756
+
757
+ $dropdown-menu-width-shrink: () !default;
758
+ $dropdown-menu-width-shrink: map-deep-merge(
759
+ (
760
+ min-width: 0,
761
+ white-space: nowrap,
762
+ ),
763
+ $dropdown-menu-width-shrink
764
+ );
765
+
766
+ // .dropdown-menu-width-full
740
767
 
741
768
  $dropdown-menu-width-full: () !default;
742
769
  $dropdown-menu-width-full: map-merge(
@@ -750,6 +777,8 @@ $dropdown-menu-width-full: map-merge(
750
777
  $dropdown-menu-width-full
751
778
  );
752
779
 
780
+ // .dropdown-menu-width-sm
781
+
753
782
  $dropdown-menu-width-sm: () !default;
754
783
  $dropdown-menu-width-sm: map-merge(
755
784
  (