@clayui/css 3.115.1 → 3.116.0

package/CHANGELOG.md

@@ -3,6 +3,28 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [3.116.0](https://github.com/liferay/clay/compare/v3.115.2...v3.116.0) (2024-06-10)
+
+
+### Bug Fixes
+
+* **@clayui/css:** LPD-27401 Refactor. Change display property to allow long words break into multiple lines ([3e0ed1d](https://github.com/liferay/clay/commit/3e0ed1df192e0c4b05950fcb958cbf7b8673f8f4))
+
+
+
+
+
+## [3.115.2](https://github.com/liferay/clay/compare/v3.115.1...v3.115.2) (2024-05-24)
+
+
+### Bug Fixes
+
+* **@clayui/css:** LPD-26719 Cadmin checkboxes should have darker borders for accessibility ([ac48a01](https://github.com/liferay/clay/commit/ac48a01b711363986cc8ed95347bf2f9e9ce3b0e))
+
+
+
+
+
 ## [3.115.1](https://github.com/liferay/clay/compare/v3.115.0...v3.115.1) (2024-05-21)
 
 

package/lib/css/atlas.css

@@ -1,6 +1,6 @@
 @charset "UTF-8";
 /**
- * Clay 3.115.1
+ * Clay 3.116.0
  *
  * SPDX-FileCopyrightText: © 2020 Liferay, Inc. <https://liferay.com>
  * SPDX-FileCopyrightText: © 2020 Contributors to the project Clay <https://github.com/liferay/clay/graphs/contributors>
@@ -21257,7 +21257,7 @@ td.table-focus {
 .table-title a[href] {
   color: #272833;
   border-radius: 1px;
-  display: inline-flex;
+  display: inline-block;
   max-width: 100%;
   transition: box-shadow 0.15s ease-in-out;
 }
@@ -21287,7 +21287,7 @@ td.table-focus {
 .table-link {
   color: #272833;
   border-radius: 1px;
-  display: inline-flex;
+  display: inline-block;
   max-width: 100%;
   transition: box-shadow 0.15s ease-in-out;
 }
@@ -21580,7 +21580,7 @@ td.table-focus {
 .table-list-title a[href] {
   color: #272833;
   border-radius: 1px;
-  display: inline-flex;
+  display: inline-block;
   max-width: 100%;
   transition: box-shadow 0.15s ease-in-out;
 }
@@ -21610,7 +21610,7 @@ td.table-focus {
 .table-list-link {
   color: #272833;
   border-radius: 1px;
-  display: inline-flex;
+  display: inline-block;
   max-width: 100%;
   transition: box-shadow 0.15s ease-in-out;
 }
@@ -23452,6 +23452,7 @@ td.table-focus {
   background-color: transparent;
 }
 .treeview .component-icon {
+  color: #6b6c7e;
   display: inline-block;
   font-size: 16px;
   height: auto;
@@ -23616,9 +23617,6 @@ td.table-focus {
 .treeview-light .component-expander {
   color: #6b6c7e;
 }
-.treeview-light .component-expander:hover {
-  color: #0b5fff;
-}
 .treeview-light .component-expander:disabled, .treeview-light .component-expander.disabled {
   color: #6b6c7e;
   opacity: 0.5;
@@ -23630,21 +23628,34 @@ td.table-focus {
   color: #6b6c7e;
 }
 .treeview-light .treeview-link:hover, .treeview-light .treeview-link.hover {
-  background-color: #f7f8f9;
-  color: #272833;
+  box-shadow: inset 0 0 0 1px #88889a;
+}
+.treeview-light .treeview-link.focus, .treeview-light .treeview-link:focus-visible, .c-prefers-focus .treeview-light .treeview-link:focus {
+  box-shadow: inset 0 0 0 0.125rem #528eff, inset 0 0 0 0.25rem #fff;
 }
 .treeview-light .treeview-link:active {
-  background-color: #f1f2f5;
-  color: #272833;
+  background-color: #f0f5ff;
+  box-shadow: inset 0 0 0 1px #0b5fff;
+  color: #393a4a;
+}
+.treeview-light .treeview-link:active:focus-visible, .c-prefers-focus .treeview-light .treeview-link:active:focus {
+  box-shadow: inset 0 0 0 0.125rem #528eff, inset 0 0 0 0.25rem #fff;
 }
 .treeview-light .treeview-link.active {
-  background-color: #f1f2f5;
-  color: #272833;
+  background-color: #f0f5ff;
+  box-shadow: inset 0 0 0 1px #0b5fff;
+  color: #393a4a;
+}
+.treeview-light .treeview-link.active:focus-visible, .c-prefers-focus .treeview-light .treeview-link.active:focus {
+  box-shadow: inset 0 0 0 0.125rem #528eff, inset 0 0 0 0.25rem #fff;
 }
 .treeview-light .treeview-link:disabled, .treeview-light .treeview-link.disabled {
   background-color: transparent;
   color: rgba(107, 108, 126, 0.5);
 }
+.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 {
+  box-shadow: inset 0 0 0 0.125rem #528eff, inset 0 0 0 0.25rem #fff;
+}
 .treeview-light .treeview-link.treeview-no-hover:hover, .treeview-light .treeview-link.treeview-no-hover.hover {
   background-color: transparent;
   color: #6b6c7e;
@@ -23652,9 +23663,6 @@ td.table-focus {
 .treeview-dark .component-expander {
   color: #a7a9bc;
 }
-.treeview-dark .component-expander:hover {
-  color: #80acff;
-}
 .treeview-dark .component-expander:disabled, .treeview-dark .component-expander.disabled {
   color: #a7a9bc;
   opacity: 0.5;
@@ -23663,16 +23671,34 @@ td.table-focus {
   color: #a7a9bc;
 }
 .treeview-dark .treeview-link:hover, .treeview-dark .treeview-link.hover {
-  background-color: rgba(255, 255, 255, 0.04);
+  box-shadow: inset 0 0 0 1px #88889a;
+}
+.treeview-dark .treeview-link.focus, .treeview-dark .treeview-link:focus-visible, .c-prefers-focus .treeview-dark .treeview-link:focus {
+  box-shadow: inset 0 0 0 0.125rem #528eff, inset 0 0 0 0.25rem #fff;
+}
+.treeview-dark .treeview-link:active {
+  background-color: #393a4a;
+  box-shadow: inset 0 0 0 1px #0b5fff;
+  color: #f0f5ff;
+}
+.treeview-dark .treeview-link:active:focus-visible, .c-prefers-focus .treeview-dark .treeview-link:active:focus {
+  box-shadow: inset 0 0 0 0.125rem #528eff, inset 0 0 0 0.25rem #fff;
 }
 .treeview-dark .treeview-link.active {
-  background-color: rgba(255, 255, 255, 0.06);
-  color: #fff;
+  background-color: #393a4a;
+  box-shadow: inset 0 0 0 1px #0b5fff;
+  color: #f0f5ff;
+}
+.treeview-dark .treeview-link.active:focus-visible, .c-prefers-focus .treeview-dark .treeview-link.active:focus {
+  box-shadow: inset 0 0 0 0.125rem #528eff, inset 0 0 0 0.25rem #fff;
 }
 .treeview-dark .treeview-link:disabled, .treeview-dark .treeview-link.disabled {
   background-color: transparent;
   color: rgba(167, 169, 188, 0.5);
 }
+.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 {
+  box-shadow: inset 0 0 0 0.125rem #528eff, inset 0 0 0 0.25rem #fff;
+}
 .treeview-dark .treeview-link.treeview-no-hover:hover, .treeview-dark .treeview-link.treeview-no-hover.hover {
   background-color: transparent;
   color: #a7a9bc;