@clayui/css 3.124.0 → 3.126.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.
package/lib/css/base.css CHANGED
@@ -1,6 +1,6 @@
1
1
  @charset "UTF-8";
2
2
  /**
3
- * Clay 3.124.0
3
+ * Clay 3.126.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>
@@ -5461,6 +5461,56 @@ input[type=button].btn-block {
5461
5461
  background-color: #343a40;
5462
5462
  color: #fff;
5463
5463
  }
5464
+ .sticker-outline-0 {
5465
+ background-color: #f8f9fa;
5466
+ border: 1px solid #343a40;
5467
+ color: #343a40;
5468
+ }
5469
+ .sticker-outline-1 {
5470
+ background-color: #f2e5ff;
5471
+ border: 1px solid #6f42c1;
5472
+ color: #6f42c1;
5473
+ }
5474
+ .sticker-outline-2 {
5475
+ background-color: #fff8e5;
5476
+ border: 1px solid #b38900;
5477
+ color: #b38900;
5478
+ }
5479
+ .sticker-outline-3 {
5480
+ background-color: #f1fce9;
5481
+ border: 1px solid #28a745;
5482
+ color: #28a745;
5483
+ }
5484
+ .sticker-outline-4 {
5485
+ background-color: #ffe5e5;
5486
+ border: 1px solid #dc3545;
5487
+ color: #dc3545;
5488
+ }
5489
+ .sticker-outline-5 {
5490
+ background-color: #fff0e5;
5491
+ border: 1px solid #fd7e14;
5492
+ color: #fd7e14;
5493
+ }
5494
+ .sticker-outline-6 {
5495
+ background-color: #eafbf8;
5496
+ border: 1px solid #20c997;
5497
+ color: #20c997;
5498
+ }
5499
+ .sticker-outline-7 {
5500
+ background-color: #e5f6ff;
5501
+ border: 1px solid #17a2b8;
5502
+ color: #17a2b8;
5503
+ }
5504
+ .sticker-outline-8 {
5505
+ background-color: #ffe5f4;
5506
+ border: 1px solid #e83e8c;
5507
+ color: #800048;
5508
+ }
5509
+ .sticker-outline-9 {
5510
+ background-color: #fff;
5511
+ border: 1px solid #828e9a;
5512
+ color: #828e9a;
5513
+ }
5464
5514
  .sticker-circle {
5465
5515
  border-radius: 5000px;
5466
5516
  }
@@ -12539,6 +12589,9 @@ label.custom-control-label {
12539
12589
  margin-bottom: 10px;
12540
12590
  position: relative;
12541
12591
  }
12592
+ .multi-step-item:last-child .multi-step-divider {
12593
+ display: none;
12594
+ }
12542
12595
  .multi-step-item.active .multi-step-icon {
12543
12596
  background-color: #007bff;
12544
12597
  background-position: center;
@@ -12594,9 +12647,10 @@ label.custom-control-label {
12594
12647
  cursor: not-allowed;
12595
12648
  opacity: 1;
12596
12649
  }
12597
- .multi-step-item.disabled .multi-step-icon:focus {
12650
+ .multi-step-item.disabled .multi-step-icon.focus, .multi-step-item.disabled .multi-step-icon:focus-visible {
12598
12651
  box-shadow: none;
12599
12652
  }
12653
+
12600
12654
  .multi-step-item.disabled .multi-step-indicator-label {
12601
12655
  color: #ced4da;
12602
12656
  }
@@ -12667,6 +12721,7 @@ label.custom-control-label {
12667
12721
  padding-left: 0;
12668
12722
  padding-right: 0;
12669
12723
  padding-top: 0;
12724
+ position: relative;
12670
12725
  transition: box-shadow 0.15s ease-in-out;
12671
12726
  width: 2rem;
12672
12727
  }
@@ -12684,13 +12739,14 @@ label.custom-control-label {
12684
12739
  color: rgba(0, 0, 0, 0.7);
12685
12740
  text-decoration: none;
12686
12741
  }
12687
- .multi-step-icon:focus {
12742
+ .multi-step-icon.focus, .multi-step-icon:focus-visible {
12688
12743
  background-color: #e9ecef;
12689
12744
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
12690
12745
  color: rgba(0, 0, 0, 0.7);
12691
12746
  outline: 0;
12692
12747
  text-decoration: none;
12693
12748
  }
12749
+
12694
12750
  .multi-step-icon[data-multi-step-icon]::before {
12695
12751
  content: '\FEFF' attr(data-multi-step-icon);
12696
12752
  height: 2rem;
@@ -12720,6 +12776,28 @@ label.custom-control-label {
12720
12776
  width: 150px;
12721
12777
  }
12722
12778
 
12779
+ .multi-step-nav-center {
12780
+ padding: 0;
12781
+ text-align: center;
12782
+ }
12783
+ .multi-step-nav-center .multi-step-item {
12784
+ flex-grow: 1;
12785
+ width: 75px;
12786
+ }
12787
+ .multi-step-nav-center .multi-step-divider {
12788
+ left: 50%;
12789
+ margin-left: 1rem;
12790
+ width: calc(100% - 2rem);
12791
+ }
12792
+ .multi-step-nav-center .multi-step-indicator {
12793
+ left: 50%;
12794
+ transform: translateX(-50%);
12795
+ }
12796
+ .multi-step-nav-center .multi-step-title {
12797
+ margin-left: 12.5%;
12798
+ max-width: 75%;
12799
+ }
12800
+
12723
12801
  @media (max-width: 767.98px) {
12724
12802
  .multi-step-nav-collapse-sm {
12725
12803
  flex-wrap: nowrap;
@@ -12737,6 +12815,23 @@ label.custom-control-label {
12737
12815
  max-width: none;
12738
12816
  transform: none;
12739
12817
  }
12818
+ .multi-step-nav-collapse-sm.multi-step-nav-center .multi-step-item {
12819
+ flex-grow: 0;
12820
+ width: auto;
12821
+ }
12822
+ .multi-step-nav-collapse-sm.multi-step-nav-center .multi-step-item-expand {
12823
+ flex-grow: 1;
12824
+ width: 75px;
12825
+ }
12826
+ .multi-step-nav-collapse-sm.multi-step-nav-center .multi-step-divider {
12827
+ left: auto;
12828
+ margin-left: 2rem;
12829
+ width: auto;
12830
+ }
12831
+ .multi-step-nav-collapse-sm.multi-step-nav-center .multi-step-indicator {
12832
+ left: auto;
12833
+ transform: none;
12834
+ }
12740
12835
  .multi-step-nav-collapse-sm .active.multi-step-item {
12741
12836
  position: static;
12742
12837
  }
@@ -13260,7 +13355,6 @@ label.custom-control-label {
13260
13355
  color: rgba(0, 0, 0, 0.3);
13261
13356
  box-shadow: none;
13262
13357
  font-weight: 400;
13263
- letter-spacing: 0.016rem;
13264
13358
  }
13265
13359
  .menubar-primary .nav-link:disabled::before, .menubar-primary .nav-link.disabled::before {
13266
13360
  content: none;
@@ -21584,7 +21678,7 @@ td.table-focus {
21584
21678
  margin-right: 0.5rem;
21585
21679
  }
21586
21680
  .toggle-switch-sm .simple-toggle-switch .toggle-switch-label, .simple-toggle-switch.toggle-switch-sm .toggle-switch-label {
21587
- max-width: calc(100% - 38px);
21681
+ max-width: calc(100% - 34px);
21588
21682
  }
21589
21683
  .toggle-switch-sm .toggle-switch-check {
21590
21684
  height: 16px;
@@ -21603,10 +21697,9 @@ td.table-focus {
21603
21697
  }
21604
21698
  .toggle-switch-sm .toggle-switch-check ~ .toggle-switch-bar .toggle-switch-handle {
21605
21699
  min-width: 30px;
21606
- max-width: 30px;
21607
21700
  }
21608
21701
  .toggle-switch-sm .toggle-switch-check ~ .toggle-switch-bar .toggle-switch-handle::after {
21609
- margin-left: 38px;
21702
+ margin-left: 34px;
21610
21703
  }
21611
21704
  .toggle-switch-sm .toggle-switch-check ~ .toggle-switch-bar .toggle-switch-icon {
21612
21705
  font-size: 0.6875rem;