rsuite 5.65.1 → 5.67.0

package/Accordion/styles/index.css

@@ -4,11 +4,11 @@
   --rs-gray-50: #f7f7fa;
   --rs-gray-100: #f2f2f5;
   --rs-gray-200: #e5e5ea;
-  --rs-gray-400: #c5c6c7;
-  --rs-gray-500: #a6a6a6;
-  --rs-gray-600: #8e8e93;
-  --rs-gray-800: #575757;
-  --rs-gray-900: #272c36;
+  --rs-gray-400: #b6b7b8;
+  --rs-gray-500: #939393;
+  --rs-gray-600: #717273;
+  --rs-gray-800: #343434;
+  --rs-gray-900: #121212;
   --rs-primary-400: #59afff;
   --rs-text-secondary: var(--rs-gray-600);
   --rs-text-heading: var(--rs-gray-900);
@@ -229,7 +229,7 @@ tbody.rs-panel .rs-anim-collapse.rs-anim-in {
   padding: 0 !important;
 }
 .rs-panel-header {
-  color: #272c36;
+  color: #121212;
   color: var(--rs-text-heading);
   font-size: 16px;
   line-height: 1.25;
@@ -255,7 +255,7 @@ tbody.rs-panel .rs-anim-collapse.rs-anim-in {
 .rs-panel-btn:active {
   background-color: #e5e5ea;
   background-color: var(--rs-btn-subtle-hover-bg);
-  color: #575757;
+  color: #343434;
   color: var(--rs-btn-subtle-hover-text);
   outline: transparent solid 2px;
 }
@@ -267,7 +267,7 @@ tbody.rs-panel .rs-anim-collapse.rs-anim-in {
 }
 .rs-panel-btn[disabled] {
   cursor: not-allowed;
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-text-disabled);
   background-color: var(--rs-btn-subtle-disabled-bg);
 }
@@ -298,7 +298,7 @@ tbody.rs-panel .rs-anim-collapse.rs-anim-in {
   padding: 10px;
 }
 .rs-panel-collapsible > .rs-panel-header > .rs-icon {
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-text-secondary);
   position: absolute;
   top: 24px;

package/AutoComplete/styles/index.css

@@ -5,12 +5,12 @@
   --rs-gray-100: #f2f2f5;
   --rs-gray-200: #e5e5ea;
   --rs-gray-300: #d9d9d9;
-  --rs-gray-400: #c5c6c7;
-  --rs-gray-500: #a6a6a6;
-  --rs-gray-600: #8e8e93;
-  --rs-gray-700: #7a7a7a;
-  --rs-gray-800: #575757;
-  --rs-gray-900: #272c36;
+  --rs-gray-400: #b6b7b8;
+  --rs-gray-500: #939393;
+  --rs-gray-600: #717273;
+  --rs-gray-700: #575757;
+  --rs-gray-800: #343434;
+  --rs-gray-900: #121212;
   --rs-primary-100: #cce9ff;
   --rs-primary-200: #a6d7ff;
   --rs-primary-400: #59afff;
@@ -134,7 +134,7 @@
     --rs-loader-ring: rgba(247, 247, 250, 0.8);
     --rs-loader-backdrop: rgba(255, 255, 255, 0.9);
     --rs-loader-ring-inverse: rgba(247, 247, 250, 0.3);
-    --rs-loader-backdrop-inverse: rgba(39, 44, 54, 0.83);
+    --rs-loader-backdrop-inverse: rgba(18, 18, 18, 0.83);
     --rs-listbox-option-hover-bg: rgba(204, 233, 255, 0.5);
   }
 }
@@ -421,7 +421,7 @@
 .rs-input {
   display: block;
   width: 100%;
-  color: #575757;
+  color: #343434;
   color: var(--rs-text-primary);
   background-color: #fff;
   background-color: var(--rs-input-bg);
@@ -450,19 +450,19 @@ textarea.rs-input {
   transition: none;
 }
 .rs-input::-webkit-input-placeholder {
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-text-secondary);
 }
 .rs-input::-moz-placeholder {
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-text-secondary);
 }
 .rs-input::-ms-input-placeholder {
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-text-secondary);
 }
 .rs-input::placeholder {
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-text-secondary);
 }
 .rs-input:focus,
@@ -480,7 +480,7 @@ textarea.rs-input {
 .rs-input:disabled {
   background-color: #f7f7fa;
   background-color: var(--rs-input-disabled-bg);
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-text-disabled);
 }
 textarea.rs-input {
@@ -557,7 +557,7 @@ textarea.rs-input-sm {
       -ms-user-select: none;
           user-select: none;
   text-decoration: none;
-  color: #575757;
+  color: #343434;
   color: var(--rs-btn-default-text);
   background-color: #f7f7fa;
   background-color: var(--rs-btn-default-bg);
@@ -622,7 +622,7 @@ textarea.rs-input-sm {
 }
 .rs-btn:active,
 .rs-btn.rs-btn-active {
-  color: #272c36;
+  color: #121212;
   color: var(--rs-btn-default-active-text);
   background-color: #d9d9d9;
   background-color: var(--rs-btn-default-active-bg);
@@ -630,7 +630,7 @@ textarea.rs-input-sm {
 .rs-btn:disabled,
 .rs-btn.rs-btn-disabled {
   cursor: not-allowed;
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-btn-default-disabled-text);
   background-color: #f7f7fa;
   background-color: var(--rs-btn-default-disabled-bg);
@@ -688,28 +688,28 @@ textarea.rs-input-sm {
   border-color: var(--rs-btn-default-disabled-boreder-color);
 }
 .rs-btn-subtle {
-  color: #575757;
+  color: #343434;
   color: var(--rs-btn-subtle-text);
   background-color: transparent;
   border: none;
 }
 .rs-btn-subtle:hover,
 .rs-btn-subtle:focus {
-  color: #575757;
+  color: #343434;
   color: var(--rs-btn-subtle-hover-text);
   background-color: #e5e5ea;
   background-color: var(--rs-btn-subtle-hover-bg);
 }
 .rs-btn-subtle:active,
 .rs-btn-subtle.rs-btn-active {
-  color: #272c36;
+  color: #121212;
   color: var(--rs-btn-subtle-active-text);
   background-color: #e5e5ea;
   background-color: var(--rs-btn-subtle-active-bg);
 }
 .rs-btn-subtle:disabled,
 .rs-btn-subtle.rs-btn-disabled {
-  color: #c5c6c7;
+  color: #b6b7b8;
   color: var(--rs-btn-subtle-disabled-text);
   background: none;
 }
@@ -797,7 +797,7 @@ textarea.rs-input-sm {
   --rs-btn-subtle-hover-bg: var(--rs-red-500);
   --rs-btn-subtle-hover-text: #e5e5ea;
   --rs-btn-subtle-active-bg: var(--rs-red-600);
-  --rs-btn-subtle-active-text: #575757;
+  --rs-btn-subtle-active-text: #343434;
   --rs-btn-ghost-border: var(--rs-red-700);
   --rs-btn-ghost-text: var(--rs-red-700);
   --rs-btn-ghost-hover-border: var(--rs-red-900);
@@ -851,7 +851,7 @@ textarea.rs-input-sm {
   --rs-btn-subtle-hover-bg: var(--rs-orange-500);
   --rs-btn-subtle-hover-text: #e5e5ea;
   --rs-btn-subtle-active-bg: var(--rs-orange-600);
-  --rs-btn-subtle-active-text: #575757;
+  --rs-btn-subtle-active-text: #343434;
   --rs-btn-ghost-border: var(--rs-orange-700);
   --rs-btn-ghost-text: var(--rs-orange-700);
   --rs-btn-ghost-hover-border: var(--rs-orange-900);
@@ -905,7 +905,7 @@ textarea.rs-input-sm {
   --rs-btn-subtle-hover-bg: var(--rs-yellow-500);
   --rs-btn-subtle-hover-text: #e5e5ea;
   --rs-btn-subtle-active-bg: var(--rs-yellow-600);
-  --rs-btn-subtle-active-text: #575757;
+  --rs-btn-subtle-active-text: #343434;
   --rs-btn-ghost-border: var(--rs-yellow-700);
   --rs-btn-ghost-text: var(--rs-yellow-700);
   --rs-btn-ghost-hover-border: var(--rs-yellow-900);
@@ -959,7 +959,7 @@ textarea.rs-input-sm {
   --rs-btn-subtle-hover-bg: var(--rs-green-500);
   --rs-btn-subtle-hover-text: #e5e5ea;
   --rs-btn-subtle-active-bg: var(--rs-green-600);
-  --rs-btn-subtle-active-text: #575757;
+  --rs-btn-subtle-active-text: #343434;
   --rs-btn-ghost-border: var(--rs-green-700);
   --rs-btn-ghost-text: var(--rs-green-700);
   --rs-btn-ghost-hover-border: var(--rs-green-900);
@@ -1013,7 +1013,7 @@ textarea.rs-input-sm {
   --rs-btn-subtle-hover-bg: var(--rs-cyan-500);
   --rs-btn-subtle-hover-text: #e5e5ea;
   --rs-btn-subtle-active-bg: var(--rs-cyan-600);
-  --rs-btn-subtle-active-text: #575757;
+  --rs-btn-subtle-active-text: #343434;
   --rs-btn-ghost-border: var(--rs-cyan-700);
   --rs-btn-ghost-text: var(--rs-cyan-700);
   --rs-btn-ghost-hover-border: var(--rs-cyan-900);
@@ -1067,7 +1067,7 @@ textarea.rs-input-sm {
   --rs-btn-subtle-hover-bg: var(--rs-blue-500);
   --rs-btn-subtle-hover-text: #e5e5ea;
   --rs-btn-subtle-active-bg: var(--rs-blue-600);
-  --rs-btn-subtle-active-text: #575757;
+  --rs-btn-subtle-active-text: #343434;
   --rs-btn-ghost-border: var(--rs-blue-700);
   --rs-btn-ghost-text: var(--rs-blue-700);
   --rs-btn-ghost-hover-border: var(--rs-blue-900);
@@ -1121,7 +1121,7 @@ textarea.rs-input-sm {
   --rs-btn-subtle-hover-bg: var(--rs-violet-500);
   --rs-btn-subtle-hover-text: #e5e5ea;
   --rs-btn-subtle-active-bg: var(--rs-violet-600);
-  --rs-btn-subtle-active-text: #575757;
+  --rs-btn-subtle-active-text: #343434;
   --rs-btn-ghost-border: var(--rs-violet-700);
   --rs-btn-ghost-text: var(--rs-violet-700);
   --rs-btn-ghost-hover-border: var(--rs-violet-900);
@@ -1325,7 +1325,6 @@ textarea.rs-input-sm {
   border-left: var(--rs-btn-default-border, none);
 }
 .rs-btn-block {
-  display: block;
   width: 100%;
 }
 .rs-btn-block + .rs-btn-block {
@@ -1369,7 +1368,7 @@ textarea.rs-input-sm {
 }
 .rs-btn-loading > .rs-btn-spin::after {
   border-width: 3px;
-  border-color: #a6a6a6 transparent transparent;
+  border-color: #939393 transparent transparent;
   border-color: var(--rs-loader-rotor) transparent transparent;
   border-style: solid;
   -webkit-animation: buttonSpin 0.6s infinite linear;
@@ -1412,7 +1411,7 @@ textarea.rs-input-sm {
   transition: border-color ease-in-out 0.15s;
   width: 100%;
   cursor: text;
-  color: #575757;
+  color: #343434;
   color: var(--rs-text-primary);
   border: 1px solid #e5e5ea;
   border: 1px solid var(--rs-border-primary);
@@ -1522,7 +1521,7 @@ textarea.rs-input-sm {
   width: auto;
 }
 .rs-input-group.rs-input-group-inside .rs-input-group-btn {
-  color: #575757;
+  color: #343434;
   color: var(--rs-btn-subtle-text);
   background-color: transparent;
   border: none;
@@ -1533,21 +1532,21 @@ textarea.rs-input-sm {
 }
 .rs-input-group.rs-input-group-inside .rs-input-group-btn:hover,
 .rs-input-group.rs-input-group-inside .rs-input-group-btn:focus {
-  color: #575757;
+  color: #343434;
   color: var(--rs-btn-subtle-hover-text);
   background-color: #e5e5ea;
   background-color: var(--rs-btn-subtle-hover-bg);
 }
 .rs-input-group.rs-input-group-inside .rs-input-group-btn:active,
 .rs-input-group.rs-input-group-inside .rs-input-group-btn.rs-btn-active {
-  color: #272c36;
+  color: #121212;
   color: var(--rs-btn-subtle-active-text);
   background-color: #e5e5ea;
   background-color: var(--rs-btn-subtle-active-bg);
 }
 .rs-input-group.rs-input-group-inside .rs-input-group-btn:disabled,
 .rs-input-group.rs-input-group-inside .rs-input-group-btn.rs-btn-disabled {
-  color: #c5c6c7;
+  color: #b6b7b8;
   color: var(--rs-btn-subtle-disabled-text);
   background: none;
 }
@@ -1603,7 +1602,7 @@ textarea.rs-input-sm {
 .rs-input-group.rs-input-group-disabled {
   background-color: #f7f7fa;
   background-color: var(--rs-input-disabled-bg);
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-text-disabled);
   cursor: not-allowed;
 }
@@ -1908,7 +1907,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
           align-items: center;
   white-space: nowrap;
   vertical-align: middle;
-  color: #575757;
+  color: #343434;
   color: var(--rs-text-primary);
   padding: 8px 12px;
   font-size: 14px;
@@ -2038,7 +2037,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
 .rs-loader-spin::after {
   border-width: 3px;
   border-style: solid;
-  border-color: #a6a6a6 transparent transparent;
+  border-color: #939393 transparent transparent;
   border-color: var(--rs-loader-rotor) transparent transparent;
   -webkit-animation: loaderSpin 0.6s infinite linear;
           animation: loaderSpin 0.6s infinite linear;
@@ -2093,7 +2092,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
   color: var(--rs-text-inverse);
 }
 .rs-loader-inverse .rs-loader-backdrop {
-  background: rgb(from #272c36 r g b / 83%);
+  background: rgb(from #121212 r g b / 83%);
   background: var(--rs-loader-backdrop-inverse);
 }
 .rs-loader-inverse .rs-loader-spin::before {
@@ -2116,6 +2115,10 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
   -webkit-animation-duration: 0.8s;
           animation-duration: 0.8s;
 }
+.rs-loader-speed-paused .rs-loader-spin::after {
+  -webkit-animation-play-state: paused;
+          animation-play-state: paused;
+}
 .rs-loader-center,
 .rs-loader-backdrop-wrapper {
   position: absolute;
@@ -2309,14 +2312,14 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
 .rs-picker-disabled .rs-picker-toggle-value,
 .rs-picker-disabled .rs-picker-toggle-indicator,
 .rs-picker-disabled .rs-picker-tag-list .rs-tag {
-  color: #8e8e93 !important;
+  color: #717273 !important;
   color: var(--rs-text-disabled) !important;
 }
 .rs-picker-disabled .rs-picker-value-count {
   opacity: 0.5;
 }
 .rs-picker-toggle .rs-picker-toggle-placeholder {
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-text-secondary);
 }
 .rs-picker-has-value .rs-btn .rs-picker-toggle-value,
@@ -2326,7 +2329,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
 }
 .rs-picker-none {
   padding: 6px 12px 12px;
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-text-secondary);
   cursor: default;
 }
@@ -2374,7 +2377,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
           box-shadow: var(--rs-state-focus-shadow);
 }
 .rs-picker-label.rs-input-group-addon {
-  color: #575757;
+  color: #343434;
   color: var(--rs-text-primary);
   padding-right: 4px !important;
 }
@@ -2427,7 +2430,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
       -ms-user-select: none;
           user-select: none;
   text-decoration: none;
-  color: #575757;
+  color: #343434;
   color: var(--rs-btn-default-text);
   background-color: #f7f7fa;
   background-color: var(--rs-btn-default-bg);
@@ -2492,7 +2495,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
 }
 .rs-picker-toggle:active,
 .rs-picker-toggle.rs-btn-active {
-  color: #272c36;
+  color: #121212;
   color: var(--rs-btn-default-active-text);
   background-color: #d9d9d9;
   background-color: var(--rs-btn-default-active-bg);
@@ -2500,7 +2503,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
 .rs-picker-toggle:disabled,
 .rs-picker-toggle.rs-btn-disabled {
   cursor: not-allowed;
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-btn-default-disabled-text);
   background-color: #f7f7fa;
   background-color: var(--rs-btn-default-disabled-bg);
@@ -2528,7 +2531,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
   border: 1px solid #0000;
   padding-left: 10px;
   padding-right: 32px;
-  color: #575757;
+  color: #343434;
   color: var(--rs-text-primary);
   background-color: #fff;
   background-color: var(--rs-input-bg);
@@ -2561,7 +2564,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
   border-color: var(--rs-input-focus-border);
 }
 .rs-picker-subtle .rs-picker-toggle {
-  color: #575757;
+  color: #343434;
   color: var(--rs-btn-subtle-text);
   background-color: transparent;
   border: none;
@@ -2570,21 +2573,21 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
 }
 .rs-picker-subtle .rs-picker-toggle:hover,
 .rs-picker-subtle .rs-picker-toggle:focus {
-  color: #575757;
+  color: #343434;
   color: var(--rs-btn-subtle-hover-text);
   background-color: #e5e5ea;
   background-color: var(--rs-btn-subtle-hover-bg);
 }
 .rs-picker-subtle .rs-picker-toggle:active,
 .rs-picker-subtle .rs-picker-toggle.rs-btn-active {
-  color: #272c36;
+  color: #121212;
   color: var(--rs-btn-subtle-active-text);
   background-color: #e5e5ea;
   background-color: var(--rs-btn-subtle-active-bg);
 }
 .rs-picker-subtle .rs-picker-toggle:disabled,
 .rs-picker-subtle .rs-picker-toggle.rs-btn-disabled {
-  color: #c5c6c7;
+  color: #b6b7b8;
   color: var(--rs-btn-subtle-disabled-text);
   background: none;
 }
@@ -2595,7 +2598,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
 .rs-picker-subtle .rs-picker-toggle-active {
   background-color: #e5e5ea;
   background-color: var(--rs-btn-subtle-hover-bg);
-  color: #575757;
+  color: #343434;
   color: var(--rs-btn-subtle-hover-text);
 }
 /* stylelint-disable-next-line */
@@ -2923,7 +2926,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
   z-index: 5;
   padding-right: 32px;
   display: inline-block;
-  color: #575757;
+  color: #343434;
   color: var(--rs-text-primary);
   border: 1px solid #e5e5ea;
   border: 1px solid var(--rs-border-primary);
@@ -2960,7 +2963,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
   text-align: left;
 }
 .rs-picker-toggle-label {
-  color: #575757;
+  color: #343434;
   color: var(--rs-text-primary);
 }
 .rs-picker-toggle-label::after {
@@ -2991,7 +2994,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
   height: 20px;
   font-size: 12px;
   background: inherit;
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-text-secondary);
   -webkit-transition: 0.2s color linear;
   transition: 0.2s color linear;
@@ -3017,7 +3020,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
   right: 12px;
   height: 20px;
   font-size: 12px;
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-text-secondary);
 }
 .rs-picker-toggle-indicator .rs-picker-loader {
@@ -3184,7 +3187,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
   clear: both;
   font-weight: normal;
   line-height: 1.42857143;
-  color: #575757;
+  color: #343434;
   color: var(--rs-text-primary);
   cursor: pointer;
   text-decoration: none;

package/Avatar/styles/index.css

@@ -2,8 +2,8 @@
 .rs-theme-light {
   --rs-gray-0: #fff;
   --rs-gray-300: #d9d9d9;
-  --rs-gray-400: #c5c6c7;
-  --rs-gray-900: #272c36;
+  --rs-gray-400: #b6b7b8;
+  --rs-gray-900: #121212;
   --rs-red-500: #f44336;
   --rs-orange-500: #fa8900;
   --rs-yellow-500: #ffb300;

package/Breadcrumb/styles/index.css

@@ -1,8 +1,8 @@
 :root,
 .rs-theme-light {
   --rs-gray-200: #e5e5ea;
-  --rs-gray-600: #8e8e93;
-  --rs-gray-900: #272c36;
+  --rs-gray-600: #717273;
+  --rs-gray-900: #121212;
   --rs-text-secondary: var(--rs-gray-600);
   --rs-breadcrumb-item-active-text: var(--rs-gray-900);
 }
@@ -33,7 +33,7 @@
 .rs-breadcrumb {
   margin-bottom: 20px;
   font-size: 12px;
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-text-secondary);
 }
 .rs-breadcrumb-item {
@@ -44,7 +44,7 @@
   outline: 0;
 }
 .rs-breadcrumb-item-active {
-  color: #272c36;
+  color: #121212;
   color: var(--rs-breadcrumb-item-active-text);
 }
 .rs-breadcrumb-separator {

package/Button/styles/index.css

@@ -5,11 +5,11 @@
   --rs-gray-100: #f2f2f5;
   --rs-gray-200: #e5e5ea;
   --rs-gray-300: #d9d9d9;
-  --rs-gray-400: #c5c6c7;
-  --rs-gray-500: #a6a6a6;
-  --rs-gray-600: #8e8e93;
-  --rs-gray-800: #575757;
-  --rs-gray-900: #272c36;
+  --rs-gray-400: #b6b7b8;
+  --rs-gray-500: #939393;
+  --rs-gray-600: #717273;
+  --rs-gray-800: #343434;
+  --rs-gray-900: #121212;
   --rs-primary-200: #a6d7ff;
   --rs-primary-400: #59afff;
   --rs-primary-500: #3498ff;
@@ -355,7 +355,7 @@
       -ms-user-select: none;
           user-select: none;
   text-decoration: none;
-  color: #575757;
+  color: #343434;
   color: var(--rs-btn-default-text);
   background-color: #f7f7fa;
   background-color: var(--rs-btn-default-bg);
@@ -420,7 +420,7 @@
 }
 .rs-btn:active,
 .rs-btn.rs-btn-active {
-  color: #272c36;
+  color: #121212;
   color: var(--rs-btn-default-active-text);
   background-color: #d9d9d9;
   background-color: var(--rs-btn-default-active-bg);
@@ -428,7 +428,7 @@
 .rs-btn:disabled,
 .rs-btn.rs-btn-disabled {
   cursor: not-allowed;
-  color: #8e8e93;
+  color: #717273;
   color: var(--rs-btn-default-disabled-text);
   background-color: #f7f7fa;
   background-color: var(--rs-btn-default-disabled-bg);
@@ -486,28 +486,28 @@
   border-color: var(--rs-btn-default-disabled-boreder-color);
 }
 .rs-btn-subtle {
-  color: #575757;
+  color: #343434;
   color: var(--rs-btn-subtle-text);
   background-color: transparent;
   border: none;
 }
 .rs-btn-subtle:hover,
 .rs-btn-subtle:focus {
-  color: #575757;
+  color: #343434;
   color: var(--rs-btn-subtle-hover-text);
   background-color: #e5e5ea;
   background-color: var(--rs-btn-subtle-hover-bg);
 }
 .rs-btn-subtle:active,
 .rs-btn-subtle.rs-btn-active {
-  color: #272c36;
+  color: #121212;
   color: var(--rs-btn-subtle-active-text);
   background-color: #e5e5ea;
   background-color: var(--rs-btn-subtle-active-bg);
 }
 .rs-btn-subtle:disabled,
 .rs-btn-subtle.rs-btn-disabled {
-  color: #c5c6c7;
+  color: #b6b7b8;
   color: var(--rs-btn-subtle-disabled-text);
   background: none;
 }
@@ -595,7 +595,7 @@
   --rs-btn-subtle-hover-bg: var(--rs-red-500);
   --rs-btn-subtle-hover-text: #e5e5ea;
   --rs-btn-subtle-active-bg: var(--rs-red-600);
-  --rs-btn-subtle-active-text: #575757;
+  --rs-btn-subtle-active-text: #343434;
   --rs-btn-ghost-border: var(--rs-red-700);
   --rs-btn-ghost-text: var(--rs-red-700);
   --rs-btn-ghost-hover-border: var(--rs-red-900);
@@ -649,7 +649,7 @@
   --rs-btn-subtle-hover-bg: var(--rs-orange-500);
   --rs-btn-subtle-hover-text: #e5e5ea;
   --rs-btn-subtle-active-bg: var(--rs-orange-600);
-  --rs-btn-subtle-active-text: #575757;
+  --rs-btn-subtle-active-text: #343434;
   --rs-btn-ghost-border: var(--rs-orange-700);
   --rs-btn-ghost-text: var(--rs-orange-700);
   --rs-btn-ghost-hover-border: var(--rs-orange-900);
@@ -703,7 +703,7 @@
   --rs-btn-subtle-hover-bg: var(--rs-yellow-500);
   --rs-btn-subtle-hover-text: #e5e5ea;
   --rs-btn-subtle-active-bg: var(--rs-yellow-600);
-  --rs-btn-subtle-active-text: #575757;
+  --rs-btn-subtle-active-text: #343434;
   --rs-btn-ghost-border: var(--rs-yellow-700);
   --rs-btn-ghost-text: var(--rs-yellow-700);
   --rs-btn-ghost-hover-border: var(--rs-yellow-900);
@@ -757,7 +757,7 @@
   --rs-btn-subtle-hover-bg: var(--rs-green-500);
   --rs-btn-subtle-hover-text: #e5e5ea;
   --rs-btn-subtle-active-bg: var(--rs-green-600);
-  --rs-btn-subtle-active-text: #575757;
+  --rs-btn-subtle-active-text: #343434;
   --rs-btn-ghost-border: var(--rs-green-700);
   --rs-btn-ghost-text: var(--rs-green-700);
   --rs-btn-ghost-hover-border: var(--rs-green-900);
@@ -811,7 +811,7 @@
   --rs-btn-subtle-hover-bg: var(--rs-cyan-500);
   --rs-btn-subtle-hover-text: #e5e5ea;
   --rs-btn-subtle-active-bg: var(--rs-cyan-600);
-  --rs-btn-subtle-active-text: #575757;
+  --rs-btn-subtle-active-text: #343434;
   --rs-btn-ghost-border: var(--rs-cyan-700);
   --rs-btn-ghost-text: var(--rs-cyan-700);
   --rs-btn-ghost-hover-border: var(--rs-cyan-900);
@@ -865,7 +865,7 @@
   --rs-btn-subtle-hover-bg: var(--rs-blue-500);
   --rs-btn-subtle-hover-text: #e5e5ea;
   --rs-btn-subtle-active-bg: var(--rs-blue-600);
-  --rs-btn-subtle-active-text: #575757;
+  --rs-btn-subtle-active-text: #343434;
   --rs-btn-ghost-border: var(--rs-blue-700);
   --rs-btn-ghost-text: var(--rs-blue-700);
   --rs-btn-ghost-hover-border: var(--rs-blue-900);
@@ -919,7 +919,7 @@
   --rs-btn-subtle-hover-bg: var(--rs-violet-500);
   --rs-btn-subtle-hover-text: #e5e5ea;
   --rs-btn-subtle-active-bg: var(--rs-violet-600);
-  --rs-btn-subtle-active-text: #575757;
+  --rs-btn-subtle-active-text: #343434;
   --rs-btn-ghost-border: var(--rs-violet-700);
   --rs-btn-ghost-text: var(--rs-violet-700);
   --rs-btn-ghost-hover-border: var(--rs-violet-900);
@@ -1123,7 +1123,6 @@
   border-left: var(--rs-btn-default-border, none);
 }
 .rs-btn-block {
-  display: block;
   width: 100%;
 }
 .rs-btn-block + .rs-btn-block {
@@ -1167,7 +1166,7 @@
 }
 .rs-btn-loading > .rs-btn-spin::after {
   border-width: 3px;
-  border-color: #a6a6a6 transparent transparent;
+  border-color: #939393 transparent transparent;
   border-color: var(--rs-loader-rotor) transparent transparent;
   border-style: solid;
   -webkit-animation: buttonSpin 0.6s infinite linear;

package/Button/styles/index.less

@@ -263,7 +263,6 @@ each(@spectrum, .(@color) {
 // --------------------------------------------------
 
 .rs-btn-block {
-  display: block;
   width: 100%;
 
   // Vertically space out multiple block buttons