@clayui/css 3.115.0 → 3.115.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.
package/lib/css/base.css CHANGED
@@ -1,6 +1,6 @@
1
1
  @charset "UTF-8";
2
2
  /**
3
- * Clay 3.115.0
3
+ * Clay 3.115.2
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>
@@ -4683,14 +4683,17 @@ input[type=button].btn-block {
4683
4683
  }
4684
4684
 
4685
4685
  .c-empty-state-animation {
4686
- display: block;
4686
+ align-items: center;
4687
+ display: flex;
4688
+ flex-direction: column;
4689
+ flex-shrink: 0;
4687
4690
  margin: 5rem auto 1.5rem;
4688
4691
  max-width: 340px;
4689
4692
  text-align: center;
4690
4693
  }
4691
4694
 
4692
4695
  .c-empty-state-image {
4693
- margin: 0 auto 2rem;
4696
+ margin-bottom: -0.5rem;
4694
4697
  max-width: 250px;
4695
4698
  width: 100%;
4696
4699
  overflow-wrap: break-word;
@@ -21804,6 +21807,7 @@ td.table-focus {
21804
21807
  background-color: transparent;
21805
21808
  }
21806
21809
  .treeview .component-icon {
21810
+ color: #6c757d;
21807
21811
  display: inline-block;
21808
21812
  font-size: 16px;
21809
21813
  height: auto;
@@ -21968,9 +21972,6 @@ td.table-focus {
21968
21972
  .treeview-light .component-expander {
21969
21973
  color: #6c757d;
21970
21974
  }
21971
- .treeview-light .component-expander:hover {
21972
- color: #007bff;
21973
- }
21974
21975
  .treeview-light .component-expander:disabled, .treeview-light .component-expander.disabled {
21975
21976
  color: #6c757d;
21976
21977
  opacity: 0.5;
@@ -21982,21 +21983,34 @@ td.table-focus {
21982
21983
  color: #6c757d;
21983
21984
  }
21984
21985
  .treeview-light .treeview-link:hover, .treeview-light .treeview-link.hover {
21985
- background-color: #f8f9fa;
21986
- color: #212529;
21986
+ box-shadow: inset 0 0 0 1px #889199;
21987
+ }
21988
+ .treeview-light .treeview-link.focus, .treeview-light .treeview-link:focus-visible, .c-prefers-focus .treeview-light .treeview-link:focus {
21989
+ box-shadow: inset 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
21987
21990
  }
21988
21991
  .treeview-light .treeview-link:active {
21989
- background-color: #e9ecef;
21990
- color: #212529;
21992
+ background-color: #e5f2ff;
21993
+ box-shadow: inset 0 0 0 1px #007bff;
21994
+ color: #828e9a;
21995
+ }
21996
+ .treeview-light .treeview-link:active:focus-visible, .c-prefers-focus .treeview-light .treeview-link:active:focus {
21997
+ box-shadow: inset 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
21991
21998
  }
21992
21999
  .treeview-light .treeview-link.active {
21993
- background-color: #e9ecef;
21994
- color: #212529;
22000
+ background-color: #e5f2ff;
22001
+ box-shadow: inset 0 0 0 1px #007bff;
22002
+ color: #828e9a;
22003
+ }
22004
+ .treeview-light .treeview-link.active:focus-visible, .c-prefers-focus .treeview-light .treeview-link.active:focus {
22005
+ box-shadow: inset 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
21995
22006
  }
21996
22007
  .treeview-light .treeview-link:disabled, .treeview-light .treeview-link.disabled {
21997
22008
  background-color: transparent;
21998
22009
  color: rgba(108, 117, 125, 0.5);
21999
22010
  }
22011
+ .treeview-light .treeview-link[aria-expanded=true]:focus-visible, .c-prefers-focus .treeview-light .treeview-link[aria-expanded=true]:focus, .treeview-light .treeview-link.show:focus-visible, .c-prefers-focus .treeview-light .treeview-link.show:focus {
22012
+ box-shadow: inset 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
22013
+ }
22000
22014
  .treeview-light .treeview-link.treeview-no-hover:hover, .treeview-light .treeview-link.treeview-no-hover.hover {
22001
22015
  background-color: transparent;
22002
22016
  color: #6c757d;
@@ -22004,9 +22018,6 @@ td.table-focus {
22004
22018
  .treeview-dark .component-expander {
22005
22019
  color: #a9afb5;
22006
22020
  }
22007
- .treeview-dark .component-expander:hover {
22008
- color: #75b8ff;
22009
- }
22010
22021
  .treeview-dark .component-expander:disabled, .treeview-dark .component-expander.disabled {
22011
22022
  color: #a9afb5;
22012
22023
  opacity: 0.5;
@@ -22015,16 +22026,34 @@ td.table-focus {
22015
22026
  color: #a9afb5;
22016
22027
  }
22017
22028
  .treeview-dark .treeview-link:hover, .treeview-dark .treeview-link.hover {
22018
- background-color: rgba(255, 255, 255, 0.04);
22029
+ box-shadow: inset 0 0 0 1px #889199;
22030
+ }
22031
+ .treeview-dark .treeview-link.focus, .treeview-dark .treeview-link:focus-visible, .c-prefers-focus .treeview-dark .treeview-link:focus {
22032
+ box-shadow: inset 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
22033
+ }
22034
+ .treeview-dark .treeview-link:active {
22035
+ background-color: #828e9a;
22036
+ box-shadow: inset 0 0 0 1px #007bff;
22037
+ color: #e5f2ff;
22038
+ }
22039
+ .treeview-dark .treeview-link:active:focus-visible, .c-prefers-focus .treeview-dark .treeview-link:active:focus {
22040
+ box-shadow: inset 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
22019
22041
  }
22020
22042
  .treeview-dark .treeview-link.active {
22021
- background-color: rgba(255, 255, 255, 0.06);
22022
- color: #fff;
22043
+ background-color: #828e9a;
22044
+ box-shadow: inset 0 0 0 1px #007bff;
22045
+ color: #e5f2ff;
22046
+ }
22047
+ .treeview-dark .treeview-link.active:focus-visible, .c-prefers-focus .treeview-dark .treeview-link.active:focus {
22048
+ box-shadow: inset 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
22023
22049
  }
22024
22050
  .treeview-dark .treeview-link:disabled, .treeview-dark .treeview-link.disabled {
22025
22051
  background-color: transparent;
22026
22052
  color: rgba(169, 175, 181, 0.5);
22027
22053
  }
22054
+ .treeview-dark .treeview-link[aria-expanded=true]:focus-visible, .c-prefers-focus .treeview-dark .treeview-link[aria-expanded=true]:focus, .treeview-dark .treeview-link.show:focus-visible, .c-prefers-focus .treeview-dark .treeview-link.show:focus {
22055
+ box-shadow: inset 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
22056
+ }
22028
22057
  .treeview-dark .treeview-link.treeview-no-hover:hover, .treeview-dark .treeview-link.treeview-no-hover.hover {
22029
22058
  background-color: transparent;
22030
22059
  color: #a9afb5;