@clayui/css 3.88.0 → 3.90.0

package/lib/css/base.css

@@ -1,6 +1,6 @@
 @charset "UTF-8";
 /**
- * Clay 3.88.0
+ * Clay 3.90.0
  *
  * SPDX-FileCopyrightText: © 2020 Liferay, Inc. <https://liferay.com>
  * SPDX-FileCopyrightText: © 2020 Contributors to the project Clay <https://github.com/liferay/clay/graphs/contributors>
@@ -15,37 +15,6 @@
  *
  * SPDX-License-Identifier: LicenseRef-MIT-Bootstrap
  */
-:root {
-  --blue: #007bff;
-  --indigo: #6610f2;
-  --purple: #6f42c1;
-  --pink: #e83e8c;
-  --red: #dc3545;
-  --orange: #fd7e14;
-  --yellow: #ffc107;
-  --green: #28a745;
-  --teal: #20c997;
-  --cyan: #17a2b8;
-  --white: #fff;
-  --gray: #6c757d;
-  --gray-dark: #343a40;
-  --primary: #007bff;
-  --secondary: #6c757d;
-  --success: #28a745;
-  --info: #17a2b8;
-  --warning: #ffc107;
-  --danger: #dc3545;
-  --light: #f8f9fa;
-  --dark: #343a40;
-  --breakpoint-xs: 0;
-  --breakpoint-sm: 576px;
-  --breakpoint-md: 768px;
-  --breakpoint-lg: 992px;
-  --breakpoint-xl: 1200px;
-  --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
-  --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
-}
-
 /* SPDX-SnippetBegin
  * SPDX-License-Identifier: MIT
  * SPDX-SnippetCopyrightText: © 2016 Nicolas Gallagher and Jonathan Neal <https://github.com/necolas/normalize.css>
@@ -161,16 +130,6 @@ a:hover, a.hover {
   color: #0056b3;
   text-decoration: underline;
 }
-a .inline-item-before {
-  margin-right: 0.25rem;
-}
-a .inline-item-middle {
-  margin-left: 0.25rem;
-  margin-right: 0.25rem;
-}
-a .inline-item-after {
-  margin-left: 0.25rem;
-}
 pre,
 code,
 kbd,
@@ -1233,7 +1192,7 @@ button.collapse-icon .c-inner {
 .btn .btn-section {
   display: block;
   font-size: 0.6875rem;
-  font-weight: 400;
+  font-weight: 500;
   line-height: 1;
 }
 fieldset:disabled a.btn {
@@ -12121,7 +12080,7 @@ label.custom-control-label {
   width: auto;
 }
 .nav-underline .nav-link.active::after {
-  background-color: #007bff;
+  background-color: #47a0ff;
   content: "";
   height: 0.1875rem;
 }
@@ -12140,37 +12099,28 @@ label.custom-control-label {
 .menubar-vertical-expand-md {
   max-width: 15.625rem;
 }
+.menubar-vertical-expand-md .menubar-collapse {
+  display: block;
+}
+.menubar-vertical-expand-md .menubar-collapse.collapsing, .menubar-vertical-expand-md .menubar-collapse.show {
+  display: block;
+}
 @media (max-width: 767.98px) {
   .menubar-vertical-expand-md {
-    align-items: center;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-between;
     margin-bottom: 1.5rem;
     margin-left: -15px;
     margin-right: -15px;
+    max-width: none;
   }
-}
-.menubar-vertical-expand-md .menubar-collapse {
-  display: block;
-}
-@media (max-width: 767.98px) {
   .menubar-vertical-expand-md .menubar-collapse {
     border-color: transparent;
     border-style: solid;
     border-width: 0.0625rem;
     display: none;
-    left: -0.0625rem;
-    position: absolute;
-    right: -0.0625rem;
+    position: relative;
     top: 100%;
     z-index: 499;
   }
-}
-.menubar-vertical-expand-md .menubar-collapse.collapsing, .menubar-vertical-expand-md .menubar-collapse.show {
-  display: block;
-}
-@media (max-width: 767.98px) {
   .menubar-vertical-expand-md .menubar-toggler {
     align-items: center;
     border-color: transparent;
@@ -12183,40 +12133,34 @@ label.custom-control-label {
   }
   .menubar-vertical-expand-md .menubar-toggler .c-inner {
     max-width: none;
-    margin-left: -0.5rem;
-    margin-right: -0.5rem;
   }
   .menubar-vertical-expand-md .menubar-toggler .lexicon-icon {
     margin-top: 0;
   }
-}
-@media (max-width: 767.98px) {
   .menubar-vertical-expand-md .nav-nested {
     margin-bottom: 0.5rem;
     margin-top: 0.5rem;
   }
-}
-@media (max-width: 767.98px) {
   .menubar-vertical-expand-md .nav-nested-margins > li .nav > li {
     margin-left: 0;
   }
-}
-@media (max-width: 767.98px) {
-  .menubar-vertical-expand-md.menubar-transparent {
-    background-color: #f8f9fa;
+  .menubar-vertical-expand-md .nav-link {
+    color: rgba(0, 0, 0, 0.5);
   }
-}
-@media (max-width: 767.98px) {
-  .menubar-vertical-expand-md.menubar-transparent .menubar-collapse {
-    background-color: #fff;
-    border-color: #dee2e6;
-    border-radius: 0.25rem;
-    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175);
+  .menubar-vertical-expand-md .nav-link:hover, .menubar-vertical-expand-md .nav-link.hover {
+    color: rgba(0, 0, 0, 0.7);
   }
-}
-@media (max-width: 767.98px) {
-  .menubar-vertical-expand-md.menubar-transparent .menubar-toggler {
-    text-decoration: none;
+  .menubar-vertical-expand-md .nav-link:active {
+    color: rgba(0, 0, 0, 0.9);
+  }
+  .menubar-vertical-expand-md .nav-link.active {
+    color: rgba(0, 0, 0, 0.9);
+  }
+  .menubar-vertical-expand-md .nav-link:disabled, .menubar-vertical-expand-md .nav-link.disabled {
+    color: rgba(0, 0, 0, 0.3);
+  }
+  .menubar-vertical-expand-md .nav-link[aria-expanded=true], .menubar-vertical-expand-md .nav-link.show {
+    color: rgba(0, 0, 0, 0.9);
   }
 }
 .menubar-vertical-expand-md.menubar-transparent .nav-link {
@@ -12235,6 +12179,17 @@ label.custom-control-label {
   color: rgba(0, 0, 0, 0.3);
 }
 @media (max-width: 767.98px) {
+  .menubar-vertical-expand-md.menubar-transparent {
+    background-color: #f8f9fa;
+  }
+  .menubar-vertical-expand-md.menubar-transparent .menubar-collapse {
+    background-color: #fff;
+    border-color: #dee2e6;
+    border-radius: 0.25rem;
+  }
+  .menubar-vertical-expand-md.menubar-transparent .menubar-toggler {
+    text-decoration: none;
+  }
   .menubar-vertical-expand-md.menubar-transparent .nav-link {
     border-radius: 0;
     color: #212529;
@@ -12288,37 +12243,28 @@ label.custom-control-label {
 .menubar-vertical-expand-lg {
   max-width: 15.625rem;
 }
+.menubar-vertical-expand-lg .menubar-collapse {
+  display: block;
+}
+.menubar-vertical-expand-lg .menubar-collapse.collapsing, .menubar-vertical-expand-lg .menubar-collapse.show {
+  display: block;
+}
 @media (max-width: 991.98px) {
   .menubar-vertical-expand-lg {
-    align-items: center;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-between;
     margin-bottom: 1.5rem;
     margin-left: -15px;
     margin-right: -15px;
+    max-width: none;
   }
-}
-.menubar-vertical-expand-lg .menubar-collapse {
-  display: block;
-}
-@media (max-width: 991.98px) {
   .menubar-vertical-expand-lg .menubar-collapse {
     border-color: transparent;
     border-style: solid;
     border-width: 0.0625rem;
     display: none;
-    left: -0.0625rem;
-    position: absolute;
-    right: -0.0625rem;
+    position: relative;
     top: 100%;
     z-index: 499;
   }
-}
-.menubar-vertical-expand-lg .menubar-collapse.collapsing, .menubar-vertical-expand-lg .menubar-collapse.show {
-  display: block;
-}
-@media (max-width: 991.98px) {
   .menubar-vertical-expand-lg .menubar-toggler {
     align-items: center;
     border-color: transparent;
@@ -12331,46 +12277,34 @@ label.custom-control-label {
   }
   .menubar-vertical-expand-lg .menubar-toggler .c-inner {
     max-width: none;
-    margin-left: -0.5rem;
-    margin-right: -0.5rem;
   }
   .menubar-vertical-expand-lg .menubar-toggler .lexicon-icon {
     margin-top: 0;
   }
-}
-@media (max-width: 991.98px) {
   .menubar-vertical-expand-lg .nav-nested {
     margin-bottom: 0.5rem;
     margin-top: 0.5rem;
   }
-}
-@media (max-width: 991.98px) {
-  .menubar-vertical-expand-lg .nav-nested-margins {
-    margin-bottom: 0.5rem;
-    margin-top: 0.5rem;
-  }
-}
-@media (max-width: 991.98px) {
   .menubar-vertical-expand-lg .nav-nested-margins > li .nav > li {
     margin-left: 0;
   }
-}
-@media (max-width: 991.98px) {
-  .menubar-vertical-expand-lg.menubar-transparent {
-    background-color: #f8f9fa;
+  .menubar-vertical-expand-lg .nav-link {
+    color: rgba(0, 0, 0, 0.5);
   }
-}
-@media (max-width: 991.98px) {
-  .menubar-vertical-expand-lg.menubar-transparent .menubar-collapse {
-    background-color: #fff;
-    border-color: #dee2e6;
-    border-radius: 0.25rem;
-    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175);
+  .menubar-vertical-expand-lg .nav-link:hover, .menubar-vertical-expand-lg .nav-link.hover {
+    color: rgba(0, 0, 0, 0.7);
   }
-}
-@media (max-width: 991.98px) {
-  .menubar-vertical-expand-lg.menubar-transparent .menubar-toggler {
-    text-decoration: none;
+  .menubar-vertical-expand-lg .nav-link:active {
+    color: rgba(0, 0, 0, 0.9);
+  }
+  .menubar-vertical-expand-lg .nav-link.active {
+    color: rgba(0, 0, 0, 0.9);
+  }
+  .menubar-vertical-expand-lg .nav-link:disabled, .menubar-vertical-expand-lg .nav-link.disabled {
+    color: rgba(0, 0, 0, 0.3);
+  }
+  .menubar-vertical-expand-lg .nav-link[aria-expanded=true], .menubar-vertical-expand-lg .nav-link.show {
+    color: rgba(0, 0, 0, 0.9);
   }
 }
 .menubar-vertical-expand-lg.menubar-transparent .nav-link {
@@ -12389,6 +12323,17 @@ label.custom-control-label {
   color: rgba(0, 0, 0, 0.3);
 }
 @media (max-width: 991.98px) {
+  .menubar-vertical-expand-lg.menubar-transparent {
+    background-color: #f8f9fa;
+  }
+  .menubar-vertical-expand-lg.menubar-transparent .menubar-collapse {
+    background-color: #fff;
+    border-color: #dee2e6;
+    border-radius: 0.25rem;
+  }
+  .menubar-vertical-expand-lg.menubar-transparent .menubar-toggler {
+    text-decoration: none;
+  }
   .menubar-vertical-expand-lg.menubar-transparent .nav-link {
     border-radius: 0;
     color: #212529;
@@ -16155,6 +16100,11 @@ label.custom-control-label {
     color: rgba(0, 0, 0, 0.9);
   }
 }
+@media (min-width: 768px) {
+  .navigation-bar-light.navbar-expand-md.navbar-underline .navbar-nav .nav-link.active::after {
+    background-color: #47a0ff;
+  }
+}
 
 .navigation-bar-secondary {
   background-color: #6c757d;