@clayui/css 3.53.0 → 3.56.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 (55) hide show
  1. package/lib/css/atlas.css +184 -181
  2. package/lib/css/atlas.css.map +1 -1
  3. package/lib/css/base.css +101 -128
  4. package/lib/css/base.css.map +1 -1
  5. package/lib/css/bootstrap.css.map +1 -1
  6. package/lib/css/cadmin.css +47 -65
  7. package/lib/css/cadmin.css.map +1 -1
  8. package/lib/images/icons/diagonal-line.svg +9 -0
  9. package/lib/images/icons/icons.svg +1 -1
  10. package/package.json +2 -2
  11. package/src/images/icons/diagonal-line.svg +9 -0
  12. package/src/scss/_license-text.scss +1 -1
  13. package/src/scss/atlas/variables/_buttons.scss +1 -1
  14. package/src/scss/atlas/variables/_dropdowns.scss +1 -1
  15. package/src/scss/atlas/variables/_globals.scss +5 -5
  16. package/src/scss/atlas/variables/_navigation-bar.scss +1 -1
  17. package/src/scss/atlas/variables/_navs.scss +1 -1
  18. package/src/scss/atlas/variables/_panels.scss +2 -2
  19. package/src/scss/atlas/variables/_range.scss +24 -6
  20. package/src/scss/atlas/variables/_sheets.scss +2 -1
  21. package/src/scss/atlas/variables/_sidebar.scss +3 -2
  22. package/src/scss/atlas/variables/_type.scss +0 -2
  23. package/src/scss/cadmin/components/_breadcrumbs.scss +12 -62
  24. package/src/scss/cadmin/variables/_breadcrumbs.scss +94 -16
  25. package/src/scss/cadmin/variables/_range.scss +110 -51
  26. package/src/scss/components/_breadcrumbs.scss +12 -71
  27. package/src/scss/components/_tables.scss +2 -2
  28. package/src/scss/functions/_color-functions.scss +66 -26
  29. package/src/scss/functions/_global-functions.scss +10 -3
  30. package/src/scss/functions/_lx-icons-generated.scss +2 -0
  31. package/src/scss/mixins/_buttons.scss +4 -0
  32. package/src/scss/mixins/_forms.scss +1020 -378
  33. package/src/scss/variables/_alerts.scss +8 -0
  34. package/src/scss/variables/_breadcrumbs.scss +90 -15
  35. package/src/scss/variables/_buttons.scss +116 -67
  36. package/src/scss/variables/_cards.scss +1 -1
  37. package/src/scss/variables/_date-picker.scss +1 -1
  38. package/src/scss/variables/_dropdowns.scss +4 -4
  39. package/src/scss/variables/_forms.scss +1 -1
  40. package/src/scss/variables/_globals.scss +2 -2
  41. package/src/scss/variables/_links.scss +1 -1
  42. package/src/scss/variables/_list-group.scss +2 -2
  43. package/src/scss/variables/_multi-step-nav.scss +1 -1
  44. package/src/scss/variables/_navbar.scss +2 -2
  45. package/src/scss/variables/_navs.scss +1 -1
  46. package/src/scss/variables/_pagination.scss +1 -1
  47. package/src/scss/variables/_panels.scss +5 -4
  48. package/src/scss/variables/_range.scss +114 -50
  49. package/src/scss/variables/_sheets.scss +1 -1
  50. package/src/scss/variables/_sidebar.scss +2 -0
  51. package/src/scss/variables/_tables.scss +9 -4
  52. package/src/scss/variables/_tbar.scss +14 -13
  53. package/src/scss/variables/_time.scss +1 -1
  54. package/src/scss/variables/_type.scss +2 -2
  55. package/src/scss/variables/_utilities.scss +1 -1
package/lib/css/cadmin.css CHANGED
@@ -1,6 +1,6 @@
1
1
  @charset "UTF-8";
2
2
  /**
3
- * Clay 3.37.0
3
+ * Clay 3.56.0
4
4
  *
5
5
  * SPDX-FileCopyrightText: © 2020 Liferay, Inc. <https://liferay.com>
6
6
  * SPDX-FileCopyrightText: © 2020 Contributors to the project Clay <https://github.com/liferay/clay/graphs/contributors>
@@ -16,7 +16,7 @@
16
16
  * SPDX-License-Identifier: LicenseRef-MIT-Bootstrap
17
17
  */
18
18
  /**
19
- * Clay 3.37.0
19
+ * Clay 3.56.0
20
20
  *
21
21
  * SPDX-FileCopyrightText: © 2020 Liferay, Inc. <https://liferay.com>
22
22
  * SPDX-FileCopyrightText: © 2020 Contributors to the project Clay <https://github.com/liferay/clay/graphs/contributors>
@@ -3902,6 +3902,9 @@ html:not(#__):not(#___) .cadmin .breadcrumb-item .active {
3902
3902
  color: #272833;
3903
3903
  font-weight: 600;
3904
3904
  }
3905
+ html:not(#__):not(#___) .cadmin .breadcrumb-item > span {
3906
+ text-transform: inherit;
3907
+ }
3905
3908
  html:not(#__):not(#___) .cadmin .breadcrumb-item + .breadcrumb-item {
3906
3909
  padding-left: 1em;
3907
3910
  }
@@ -3915,9 +3918,7 @@ html:not(#__):not(#___) .cadmin .breadcrumb-item + .breadcrumb-item::before {
3915
3918
  content: "";
3916
3919
  height: 0.6em;
3917
3920
  left: 0;
3918
- margin-top: calc(
3919
- -0.6em / 2
3920
- );
3921
+ margin-top: calc( -0.6em / 2 );
3921
3922
  padding: 0;
3922
3923
  position: absolute;
3923
3924
  top: 50%;
@@ -3932,16 +3933,20 @@ html:not(#__):not(#___) .cadmin .breadcrumb-item + .breadcrumb-item:hover::befor
3932
3933
  html:not(#__):not(#___) .cadmin .breadcrumb-item .dropdown-toggle {
3933
3934
  text-decoration: none;
3934
3935
  }
3935
- html:not(#__):not(#___) .cadmin .breadcrumb-item .dropdown-toggle:hover, html:not(#__):not(#___) .cadmin .breadcrumb-item .dropdown-toggle:focus {
3936
+ html:not(#__):not(#___) .cadmin .breadcrumb-item .dropdown-toggle:hover {
3937
+ text-decoration: none;
3938
+ }
3939
+ html:not(#__):not(#___) .cadmin .breadcrumb-item .dropdown-toggle:focus, html:not(#__):not(#___) .cadmin .breadcrumb-item .dropdown-toggle.focus {
3936
3940
  text-decoration: none;
3937
3941
  }
3938
3942
  html:not(#__):not(#___) .cadmin .breadcrumb-text-truncate {
3939
3943
  display: inline-block;
3940
3944
  max-width: 286px;
3941
3945
  overflow: hidden;
3946
+ text-decoration: inherit;
3942
3947
  text-overflow: ellipsis;
3943
- white-space: nowrap;
3944
3948
  vertical-align: bottom;
3949
+ white-space: nowrap;
3945
3950
  }
3946
3951
  @media (max-width: 767.98px) {
3947
3952
  html:not(#__):not(#___) .cadmin .breadcrumb-text-truncate {
@@ -7255,11 +7260,16 @@ html:not(#__):not(#___) .cadmin .clay-range-input {
7255
7260
  width: 100%;
7256
7261
  }
7257
7262
  html:not(#__):not(#___) .cadmin .clay-range-input .tooltip {
7258
- margin-left: 12px;
7263
+ margin-left: 13px;
7259
7264
  transition: opacity 0.15s linear;
7260
7265
  visibility: hidden;
7261
7266
  white-space: nowrap;
7262
7267
  }
7268
+ @media (prefers-reduced-motion: reduce) {
7269
+ html:not(#__):not(#___) .cadmin .clay-range-input .tooltip {
7270
+ transition: none;
7271
+ }
7272
+ }
7263
7273
  html:not(#__):not(#___) .cadmin .clay-range-input .tooltip-inner {
7264
7274
  padding: 8px 12px;
7265
7275
  }
@@ -7274,7 +7284,7 @@ html:not(#__):not(#___) .cadmin .clay-range-input .clay-tooltip-bottom {
7274
7284
  transform: translateX(-50%);
7275
7285
  }
7276
7286
  html:not(#__):not(#___) .cadmin .clay-range-input .clay-tooltip-bottom .tooltip-arrow {
7277
- margin-left: -3px;
7287
+ margin-left: -4px;
7278
7288
  }
7279
7289
  html:not(#__):not(#___) .cadmin .clay-range-input .clay-tooltip-top {
7280
7290
  bottom: 100%;
@@ -7283,25 +7293,25 @@ html:not(#__):not(#___) .cadmin .clay-range-input .clay-tooltip-top {
7283
7293
  transform: translateX(-50%);
7284
7294
  }
7285
7295
  html:not(#__):not(#___) .cadmin .clay-range-input .clay-tooltip-top .tooltip-arrow {
7286
- margin-left: -3px;
7296
+ margin-left: -4px;
7287
7297
  }
7288
7298
  html:not(#__):not(#___) .cadmin .clay-range-input .clay-range-track {
7289
7299
  background-color: #f1f2f5;
7290
7300
  border-radius: 100px;
7291
7301
  height: 4px;
7292
- margin-top: -2px;
7293
7302
  position: absolute;
7294
7303
  top: 50%;
7295
7304
  width: 100%;
7305
+ margin-top: calc(4px * -0.5);
7296
7306
  }
7297
7307
  html:not(#__):not(#___) .cadmin .clay-range-input .clay-range-progress {
7298
7308
  background-color: #0b5fff;
7299
7309
  border-radius: 100px 0 0 100px;
7300
- height: 4px;
7301
- margin-top: -2px;
7302
7310
  position: absolute;
7303
7311
  top: 50%;
7304
7312
  width: 50%;
7313
+ height: 4px;
7314
+ margin-top: calc(4px * -0.5);
7305
7315
  }
7306
7316
  html:not(#__):not(#___) .cadmin .clay-range-input .clay-range-thumb {
7307
7317
  background-color: #fff;
@@ -7309,41 +7319,46 @@ html:not(#__):not(#___) .cadmin .clay-range-input .clay-range-thumb {
7309
7319
  border-width: 0;
7310
7320
  box-shadow: 0 1px 5px -1px rgba(0, 0, 0, 0.3);
7311
7321
  height: 24px;
7312
- margin-top: -12px;
7322
+ width: 24px;
7313
7323
  position: absolute;
7314
- right: -12px;
7315
7324
  top: 50%;
7316
7325
  visibility: hidden;
7317
- width: 24px;
7326
+ margin-top: calc(24px * -0.5);
7327
+ right: calc(24px * -0.5);
7318
7328
  }
7319
7329
  html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range {
7320
7330
  -moz-appearance: none;
7321
7331
  -webkit-appearance: none;
7322
7332
  appearance: none;
7323
7333
  background-color: transparent;
7324
- content: "24px";
7325
7334
  height: 40px;
7326
- margin: 0;
7327
- padding: 0;
7328
7335
  position: relative;
7329
7336
  z-index: 1;
7337
+ content: "24px";
7338
+ }
7339
+ html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range::-ms-expand {
7340
+ display: none;
7330
7341
  }
7331
7342
  html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range::-moz-focus-outer {
7332
7343
  border-width: 0;
7333
7344
  }
7334
7345
  html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range::-moz-range-thumb {
7335
7346
  -moz-appearance: none;
7347
+ -webkit-appearance: none;
7336
7348
  appearance: none;
7337
7349
  background-color: #fff;
7338
7350
  border-radius: 100px;
7339
7351
  border-width: 0;
7340
7352
  box-shadow: 0 1px 5px -1px rgba(0, 0, 0, 0.3);
7341
7353
  height: 24px;
7342
- margin-top: -12px;
7354
+ margin-top: calc(24px * -0.5);
7343
7355
  position: relative;
7344
7356
  top: 50%;
7345
7357
  width: 24px;
7346
7358
  }
7359
+ html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range::-moz-range-thumb::-ms-expand {
7360
+ display: none;
7361
+ }
7347
7362
  html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range::-moz-range-track {
7348
7363
  -moz-appearance: none;
7349
7364
  appearance: none;
@@ -7356,13 +7371,12 @@ html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range::-ms-fill-
7356
7371
  background-color: transparent;
7357
7372
  }
7358
7373
  html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range::-ms-thumb {
7374
+ -moz-appearance: none;
7375
+ -webkit-appearance: none;
7359
7376
  appearance: none;
7360
- background-color: #fff;
7361
- border-radius: 100px;
7362
- border-width: 0;
7363
- box-shadow: 0 1px 5px -1px rgba(0, 0, 0, 0.3);
7364
- height: 24px;
7365
- width: 24px;
7377
+ }
7378
+ html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range::-ms-thumb::-ms-expand {
7379
+ display: none;
7366
7380
  }
7367
7381
  html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range::-ms-tooltip {
7368
7382
  display: none;
@@ -7381,6 +7395,7 @@ html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range::-webkit-s
7381
7395
  height: 100%;
7382
7396
  }
7383
7397
  html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range::-webkit-slider-thumb {
7398
+ -moz-appearance: none;
7384
7399
  -webkit-appearance: none;
7385
7400
  appearance: none;
7386
7401
  background-color: #fff;
@@ -7388,49 +7403,28 @@ html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range::-webkit-s
7388
7403
  border-width: 0;
7389
7404
  box-shadow: 0 1px 5px -1px rgba(0, 0, 0, 0.3);
7390
7405
  height: 24px;
7391
- margin-top: -12px;
7406
+ margin-top: calc(24px * -0.5);
7392
7407
  position: relative;
7393
7408
  top: 50%;
7394
7409
  width: 24px;
7395
7410
  }
7411
+ html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range::-webkit-slider-thumb::-ms-expand {
7412
+ display: none;
7413
+ }
7396
7414
  html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:hover {
7397
7415
  cursor: pointer;
7398
7416
  }
7399
- html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:hover ~ .clay-range-progress .clay-range-thumb {
7400
- background-color: #f0f5ff;
7401
- }
7402
7417
  html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:hover ~ .clay-range-progress .tooltip {
7403
7418
  visibility: visible;
7404
7419
  opacity: 1;
7405
7420
  }
7406
- html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:hover::-moz-range-thumb {
7407
- background-color: #f0f5ff;
7408
- }
7409
- html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:hover::-ms-thumb {
7410
- background-color: #f0f5ff;
7411
- }
7412
- html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:hover::-webkit-slider-thumb {
7413
- background-color: #f0f5ff;
7414
- }
7415
7421
  html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:focus, html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range.focus {
7416
7422
  outline: 0;
7417
7423
  }
7418
- html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:focus ~ .clay-range-progress .clay-range-thumb, html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range.focus ~ .clay-range-progress .clay-range-thumb {
7419
- box-shadow: inset 0 0 0 2px #80acff, inset 0 0 0 4px #fff;
7420
- }
7421
7424
  html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:focus ~ .clay-range-progress .tooltip, html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range.focus ~ .clay-range-progress .tooltip {
7422
7425
  visibility: visible;
7423
7426
  opacity: 1;
7424
7427
  }
7425
- html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:focus::-moz-range-thumb, html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range.focus::-moz-range-thumb {
7426
- box-shadow: inset 0 0 0 2px #80acff, inset 0 0 0 4px #fff;
7427
- }
7428
- html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:focus::-ms-thumb, html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range.focus::-ms-thumb {
7429
- box-shadow: inset 0 0 0 2px #80acff, inset 0 0 0 4px #fff;
7430
- }
7431
- html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:focus::-webkit-slider-thumb, html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range.focus::-webkit-slider-thumb {
7432
- box-shadow: inset 0 0 0 2px #80acff, inset 0 0 0 4px #fff;
7433
- }
7434
7428
  html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:disabled {
7435
7429
  color: #a7a9bc;
7436
7430
  cursor: not-allowed;
@@ -7441,26 +7435,14 @@ html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:disabled ~
7441
7435
  html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:disabled ~ .clay-range-progress {
7442
7436
  background-color: #b3cdff;
7443
7437
  }
7444
- html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:disabled ~ .clay-range-progress .clay-range-thumb {
7445
- background-color: #f7f8f9;
7446
- }
7447
- html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:disabled::-moz-range-thumb {
7448
- background-color: #f7f8f9;
7449
- }
7450
- html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:disabled::-ms-thumb {
7451
- background-color: #f7f8f9;
7452
- }
7453
- html:not(#__):not(#___) .cadmin .clay-range-input .form-control-range:disabled::-webkit-slider-thumb {
7454
- background-color: #f7f8f9;
7455
- }
7456
7438
  html:not(#__):not(#___) .cadmin .clay-range-input[data-label-min], html:not(#__):not(#___) .cadmin .clay-range-input[data-label-max] {
7457
7439
  margin-bottom: 16px;
7458
7440
  }
7459
7441
  html:not(#__):not(#___) .cadmin .clay-range-input[data-label-min]::before {
7460
- content: attr(data-label-min);
7442
+ content: '\FEFF' attr(data-label-min);
7461
7443
  }
7462
7444
  html:not(#__):not(#___) .cadmin .clay-range-input[data-label-max]::after {
7463
- content: attr(data-label-max);
7445
+ content: '\FEFF' attr(data-label-max);
7464
7446
  right: 0;
7465
7447
  }
7466
7448
  html:not(#__):not(#___) .cadmin .clay-range-input::after, html:not(#__):not(#___) .cadmin .clay-range-input::before {