rsuite 5.11.0 → 5.13.1

package/dist/rsuite.css

@@ -231,15 +231,18 @@
   --rs-sidenav-default-selected-text: #1675e0;
   --rs-sidenav-default-hover-bg: #e5e5ea;
   --rs-sidenav-default-hover-text: #575757;
+  --rs-sidenav-default-footer-border: #e5e5ea;
   --rs-sidenav-inverse-bg: #3498ff;
   --rs-sidenav-inverse-text: #fff;
   --rs-sidenav-inverse-selected-bg: #1675e0;
   --rs-sidenav-inverse-hover-bg: #2589f5;
+  --rs-sidenav-inverse-footer-border: #2589f5;
   --rs-sidenav-subtle-bg: #fff;
   --rs-sidenav-subtle-text: #8e8e93;
   --rs-sidenav-subtle-selected-text: #1675e0;
   --rs-sidenav-subtle-hover-bg: #f7f7fa;
   --rs-sidenav-subtle-hover-text: #575757;
+  --rs-sidenav-subtle-footer-border: #e5e5ea;
   --rs-input-bg: #fff;
   --rs-input-focus-border: #3498ff;
   --rs-input-disabled-bg: #f7f7fa;
@@ -550,15 +553,18 @@
   --rs-sidenav-default-selected-text: #34c3ff;
   --rs-sidenav-default-hover-bg: #292d33;
   --rs-sidenav-default-hover-text: #e9ebf0;
+  --rs-sidenav-default-footer-border: #3c3f43;
   --rs-sidenav-inverse-bg: #169de0;
   --rs-sidenav-inverse-text: #fff;
   --rs-sidenav-inverse-selected-bg: #59d0ff;
   --rs-sidenav-inverse-hover-bg: #25b3f5;
+  --rs-sidenav-inverse-footer-border: #25b3f5;
   --rs-sidenav-subtle-bg: transparent;
   --rs-sidenav-subtle-text: #a4a9b3;
   --rs-sidenav-subtle-selected-text: #34c3ff;
   --rs-sidenav-subtle-hover-bg: #292d33;
   --rs-sidenav-subtle-hover-text: #e9ebf0;
+  --rs-sidenav-subtle-footer-border: #3c3f43;
   --rs-input-bg: #1a1d24;
   --rs-input-focus-border: #34c3ff;
   --rs-input-disabled-bg: #292d33;
@@ -875,16 +881,19 @@
   --rs-sidenav-default-selected-text: #ffff00;
   --rs-sidenav-default-hover-bg: transparent;
   --rs-sidenav-default-hover-text: #ffff00;
+  --rs-sidenav-default-footer-border: #e9ebf0;
   --rs-sidenav-inverse-bg: #1a1d24;
   --rs-sidenav-inverse-text: #e9ebf0;
   --rs-sidenav-inverse-selected-bg: transparent;
   --rs-sidenav-inverse-selected-text: #ffff00;
   --rs-sidenav-inverse-hover-bg: transparent;
+  --rs-sidenav-inverse-footer-border: #e9ebf0;
   --rs-sidenav-subtle-bg: #1a1d24;
   --rs-sidenav-subtle-text: #e9ebf0;
   --rs-sidenav-subtle-selected-text: #ffff00;
   --rs-sidenav-subtle-hover-bg: transparent;
   --rs-sidenav-subtle-hover-text: #ffff00;
+  --rs-sidenav-subtle-footer-border: #e9ebf0;
   --rs-input-bg: #1a1d24;
   --rs-input-focus-border: #ffff00;
   --rs-input-disabled-bg: #292d33;
@@ -8982,9 +8991,14 @@ textarea.rs-picker-search-input {
 .rs-theme-high-contrast .rs-nav-item.rs-nav-item-active {
   text-decoration: underline;
 }
-.rs-nav-item > .rs-icon {
+.rs-nav-item-icon {
   margin-right: 6px;
 }
+.rs-nav-item-caret {
+  font-size: 16px;
+  vertical-align: text-bottom;
+  margin-left: 6px;
+}
 .rs-nav-horizontal {
   white-space: nowrap;
 }
@@ -9216,10 +9230,14 @@ textarea.rs-picker-search-input {
       -ms-flex-align: center;
           align-items: center;
 }
-.rs-navbar-item > .rs-icon {
+.rs-navbar-item-icon {
   font-size: 16px;
   margin-right: 5px;
 }
+.rs-navbar-item-caret {
+  font-size: 16px;
+  margin-left: 6px;
+}
 .rs-navbar-brand,
 .rs-navbar-item,
 .rs-navbar-nav > .rs-dropdown-item,
@@ -12495,6 +12513,13 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
   -webkit-transition: width 0.2s ease-in;
   transition: width 0.2s ease-in;
   width: 56px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
 }
 .rs-sidenav-nav {
   list-style: none;
@@ -12554,11 +12579,10 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
   outline-offset: 2px;
 }
 .rs-sidenav-nav > .rs-dropdown .rs-dropdown-item-toggle-icon {
+  font-size: 16px;
   position: absolute;
   right: 20px;
   top: 11px;
-  width: auto;
-  height: 20px;
   -webkit-transform: rotate(90deg);
           transform: rotate(90deg);
 }
@@ -12602,6 +12626,7 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
   padding-right: 40px;
 }
 .rs-sidenav-nav > .rs-dropdown .rs-dropdown-toggle .rs-dropdown-toggle-caret {
+  font-size: 16px;
   right: 20px;
   top: 15px;
 }
@@ -12680,6 +12705,19 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
 .rs-theme-high-contrast .rs-sidenav-item.rs-sidenav-item-focus {
   outline-offset: 2px;
 }
+.rs-sidenav-toggle {
+  height: 50px;
+  border-top: 1px solid;
+  margin-top: auto;
+}
+.rs-sidenav-toggle-button {
+  float: right;
+  width: 56px;
+  height: 100%;
+  border: none;
+  border-radius: 0;
+  color: inherit;
+}
 .rs-sidenav-collapse-in {
   width: 100%;
 }
@@ -12909,12 +12947,14 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
   color: var(--rs-sidenav-default-text);
 }
 .rs-sidenav-default .rs-sidenav-item,
-.rs-sidenav-default .rs-dropdown-toggle {
+.rs-sidenav-default .rs-dropdown-toggle,
+.rs-sidenav-default .rs-sidenav-toggle-button {
   background-color: #f7f7fa;
   background-color: var(--rs-sidenav-default-bg);
 }
 .rs-sidenav-default .rs-sidenav-item:hover,
 .rs-sidenav-default .rs-dropdown .rs-dropdown-toggle:hover,
+.rs-sidenav-default .rs-sidenav-toggle-button:hover,
 .rs-sidenav-default .rs-dropdown.rs-dropdown-open .rs-dropdown-toggle {
   background-color: #e5e5ea;
   background-color: var(--rs-sidenav-default-hover-bg);
@@ -12923,10 +12963,14 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
 }
 .rs-sidenav-default .rs-sidenav-item.rs-sidenav-item-active,
 .rs-sidenav-default .rs-dropdown-item.rs-dropdown-item-active,
-.rs-sidenav-default .rs-dropdown.rs-dropdown-selected-within .rs-dropdown-toggle-icon {
+.rs-sidenav-default .rs-dropdown.rs-dropdown-selected-within .rs-sidenav-item-icon {
   color: #1675e0;
   color: var(--rs-sidenav-default-selected-text);
 }
+.rs-sidenav-default .rs-sidenav-toggle {
+  border-top-color: #e5e5ea;
+  border-top-color: var(--rs-sidenav-default-footer-border);
+}
 .rs-sidenav-default.rs-sidenav-collapse-out .rs-dropdown-item.rs-dropdown-item-active {
   background-color: rgba(204, 233, 255, 0.5);
   background-color: var(--rs-menuitem-active-bg);
@@ -12975,9 +13019,9 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
 .rs-theme-high-contrast .rs-sidenav-default.rs-sidenav-collapsing .rs-dropdown-menu > .rs-dropdown-item.rs-dropdown-item-active {
   text-decoration: underline;
 }
-.rs-sidenav-default.rs-sidenav-collapse-in .rs-dropdown.rs-dropdown-selected-within .rs-dropdown-toggle-icon,
-.rs-sidenav-default.rs-sidenav-collapsing .rs-dropdown.rs-dropdown-selected-within .rs-dropdown-toggle-icon,
-.rs-sidenav-default.rs-sidenav-collapse-out .rs-dropdown.rs-dropdown-selected-within .rs-dropdown-toggle-icon {
+.rs-sidenav-default.rs-sidenav-collapse-in .rs-dropdown.rs-dropdown-selected-within .rs-sidenav-item-icon,
+.rs-sidenav-default.rs-sidenav-collapsing .rs-dropdown.rs-dropdown-selected-within .rs-sidenav-item-icon,
+.rs-sidenav-default.rs-sidenav-collapse-out .rs-dropdown.rs-dropdown-selected-within .rs-sidenav-item-icon {
   color: #1675e0;
   color: var(--rs-sidenav-default-selected-text);
 }
@@ -12989,34 +13033,41 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
 }
 .rs-sidenav-inverse .rs-sidenav-item,
 .rs-sidenav-inverse .rs-dropdown .rs-dropdown-toggle,
+.rs-sidenav-inverse .rs-sidenav-toggle-button,
 .rs-sidenav-inverse .rs-dropdown-item-submenu:hover > .rs-dropdown-item-toggle {
   background-color: #3498ff;
   background-color: var(--rs-sidenav-inverse-bg);
 }
 .rs-sidenav-inverse .rs-sidenav-item:hover,
 .rs-sidenav-inverse .rs-dropdown .rs-dropdown-toggle:hover,
+.rs-sidenav-inverse .rs-sidenav-toggle-button:hover,
 .rs-sidenav-inverse .rs-dropdown-item-submenu:hover > .rs-dropdown-item-toggle:hover,
 .rs-sidenav-inverse .rs-sidenav-item:focus,
 .rs-sidenav-inverse .rs-dropdown .rs-dropdown-toggle:focus,
+.rs-sidenav-inverse .rs-sidenav-toggle-button:focus,
 .rs-sidenav-inverse .rs-dropdown-item-submenu:hover > .rs-dropdown-item-toggle:focus {
   background-color: #2589f5;
   background-color: var(--rs-sidenav-inverse-hover-bg);
 }
 .rs-sidenav-inverse .rs-dropdown-item,
 .rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-menu-toggle,
-.rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-item-toggle {
+.rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-item-toggle,
+.rs-sidenav-inverse .rs-sidenav-toggle-button {
   color: #fff;
   color: var(--rs-sidenav-inverse-text);
 }
 .rs-sidenav-inverse .rs-dropdown-item:hover,
 .rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-menu-toggle:hover,
 .rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-item-toggle:hover,
+.rs-sidenav-inverse .rs-sidenav-toggle-button:hover,
 .rs-sidenav-inverse .rs-dropdown-item:focus,
 .rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-menu-toggle:focus,
 .rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-item-toggle:focus,
+.rs-sidenav-inverse .rs-sidenav-toggle-button:focus,
 .rs-sidenav-inverse .rs-dropdown-item.rs-dropdown-item-focus,
 .rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-menu-toggle.rs-dropdown-item-focus,
-.rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-item-toggle.rs-dropdown-item-focus {
+.rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-item-toggle.rs-dropdown-item-focus,
+.rs-sidenav-inverse .rs-sidenav-toggle-button.rs-dropdown-item-focus {
   background-color: #2589f5;
   background-color: var(--rs-sidenav-inverse-hover-bg);
   color: #fff;
@@ -13049,26 +13100,37 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
   background-color: #1675e0;
   background-color: var(--rs-sidenav-inverse-selected-bg);
 }
+.rs-sidenav-inverse .rs-sidenav-toggle {
+  border-top-color: #2589f5;
+  border-top-color: var(--rs-sidenav-inverse-footer-border);
+}
 .rs-sidenav-subtle {
   background-color: transparent;
   color: #8e8e93;
   color: var(--rs-sidenav-subtle-text);
 }
 .rs-sidenav-subtle .rs-sidenav-item,
-.rs-sidenav-subtle .rs-dropdown .rs-dropdown-toggle {
+.rs-sidenav-subtle .rs-dropdown .rs-dropdown-toggle,
+.rs-sidenav-subtle .rs-dropdown .rs-dropdown-item:not(.rs-dropdown-item-submenu),
+.rs-sidenav-subtle .rs-sidenav-toggle-button {
   background-color: transparent;
 }
 .rs-sidenav-subtle .rs-sidenav-item:hover,
 .rs-sidenav-subtle .rs-dropdown .rs-dropdown-toggle:hover,
+.rs-sidenav-subtle .rs-dropdown .rs-dropdown-item:not(.rs-dropdown-item-submenu):hover,
+.rs-sidenav-subtle .rs-sidenav-toggle-button:hover,
 .rs-sidenav-subtle .rs-sidenav-item:focus,
-.rs-sidenav-subtle .rs-dropdown .rs-dropdown-toggle:focus {
-  background-color: transparent;
+.rs-sidenav-subtle .rs-dropdown .rs-dropdown-toggle:focus,
+.rs-sidenav-subtle .rs-dropdown .rs-dropdown-item:not(.rs-dropdown-item-submenu):focus,
+.rs-sidenav-subtle .rs-sidenav-toggle-button:focus {
+  background-color: #f7f7fa;
+  background-color: var(--rs-sidenav-subtle-hover-bg);
   color: #575757;
   color: var(--rs-sidenav-subtle-hover-text);
 }
 .rs-sidenav-subtle .rs-sidenav-item.rs-sidenav-item-active,
 .rs-sidenav-subtle .rs-dropdown-item.rs-dropdown-item-active,
-.rs-sidenav-subtle .rs-dropdown.rs-dropdown-selected-within .rs-dropdown-toggle {
+.rs-sidenav-subtle .rs-dropdown.rs-dropdown-selected-within .rs-sidenav-item-icon {
   color: #1675e0;
   color: var(--rs-sidenav-subtle-selected-text);
 }
@@ -13080,6 +13142,10 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
   background-color: #f7f7fa;
   background-color: var(--rs-sidenav-subtle-hover-bg);
 }
+.rs-sidenav-subtle .rs-sidenav-toggle {
+  border-top-color: #e5e5ea;
+  border-top-color: var(--rs-sidenav-subtle-footer-border);
+}
 .rs-sidenav-subtle.rs-sidenav-collapse-in .rs-dropdown-item > .rs-dropdown-menu-toggle,
 .rs-sidenav-subtle.rs-sidenav-collapsing .rs-dropdown-item > .rs-dropdown-menu-toggle,
 .rs-sidenav-subtle.rs-sidenav-collapse-in .rs-dropdown-item > .rs-dropdown-item-toggle,