rsuite 5.46.0 → 5.47.0

package/dist/rsuite-rtl.css

@@ -305,8 +305,8 @@
   --rs-avatar-text: var(--rs-gray-0);
   --rs-badge-bg: var(--rs-color-red);
   --rs-badge-text: var(--rs-gray-0);
+  --rs-close-button-hover-color: var(--rs-color-red);
   --rs-tag-bg: var(--rs-gray-50);
-  --rs-tag-close: var(--rs-color-red);
   --rs-carousel-bg: var(--rs-gray-600);
   --rs-carousel-indicator: rgb(from var(--rs-gray-0) r g b / 40%);
   --rs-carousel-indicator-hover: var(--rs-gray-0);
@@ -538,7 +538,7 @@
   --rs-progress-bar-success: var(--rs-color-green);
   --rs-progress-bar-fail: var(--rs-color-red);
   --rs-placeholder: var(--rs-gray-600);
-  --rs-placeholder-active: hsl(from var(--rs-gray-600) h s calc(l + l * 0.2));
+  --rs-placeholder-active: var(--rs-gray-500);
   --rs-breadcrumb-item-active-text: #fff;
   --rs-dropdown-divider: var(--rs-gray-600);
   --rs-dropdown-item-bg-hover: var(--rs-gray-600);
@@ -647,8 +647,8 @@
   --rs-avatar-text: var(--rs-gray-0);
   --rs-badge-bg: var(--rs-color-red);
   --rs-badge-text: var(--rs-gray-0);
+  --rs-close-button-hover-color: var(--rs-color-red);
   --rs-tag-bg: var(--rs-gray-600);
-  --rs-tag-close: var(--rs-color-red);
   --rs-carousel-bg: var(--rs-gray-600);
   --rs-carousel-indicator: rgb(from var(--rs-gray-0) r g b / 40%);
   --rs-carousel-indicator-hover: var(--rs-gray-0);
@@ -880,7 +880,7 @@
   --rs-progress-bar-success: var(--rs-color-green);
   --rs-progress-bar-fail: var(--rs-color-red);
   --rs-placeholder: var(--rs-gray-600);
-  --rs-placeholder-active: hsl(from var(--rs-gray-600) h s calc(l + l * 0.2));
+  --rs-placeholder-active: var(--rs-gray-500);
   --rs-breadcrumb-item-active-text: #fff;
   --rs-dropdown-divider: var(--rs-gray-600);
   --rs-dropdown-item-bg-hover: var(--rs-gray-600);
@@ -992,8 +992,8 @@
   --rs-avatar-text: var(--rs-gray-0);
   --rs-badge-bg: var(--rs-red-500);
   --rs-badge-text: var(--rs-gray-0);
+  --rs-close-button-hover-color: var(--rs-color-red);
   --rs-tag-bg: var(--rs-gray-600);
-  --rs-tag-close: var(--rs-color-red);
   --rs-carousel-bg: var(--rs-gray-600);
   --rs-carousel-indicator: rgb(from var(--rs-gray-0) r g b / 40%);
   --rs-carousel-indicator-hover: var(--rs-gray-0);
@@ -9476,6 +9476,13 @@ textarea.rs-picker-search-input {
   color: #575757;
   color: var(--rs-message-success-text);
 }
+.rs-message-success .rs-btn-close {
+  position: absolute;
+  left: 0;
+  top: 0;
+  padding: 8px;
+  font-size: 12px;
+}
 .rs-message-success .rs-message-icon-wrapper > .rs-icon,
 .rs-message-success .rs-btn-close {
   color: #4caf50;
@@ -9496,6 +9503,13 @@ textarea.rs-picker-search-input {
   color: #575757;
   color: var(--rs-message-info-text);
 }
+.rs-message-info .rs-btn-close {
+  position: absolute;
+  left: 0;
+  top: 0;
+  padding: 8px;
+  font-size: 12px;
+}
 .rs-message-info .rs-message-icon-wrapper > .rs-icon,
 .rs-message-info .rs-btn-close {
   color: #2196f3;
@@ -9516,6 +9530,13 @@ textarea.rs-picker-search-input {
   color: #575757;
   color: var(--rs-message-warning-text);
 }
+.rs-message-warning .rs-btn-close {
+  position: absolute;
+  left: 0;
+  top: 0;
+  padding: 8px;
+  font-size: 12px;
+}
 .rs-message-warning .rs-message-icon-wrapper > .rs-icon,
 .rs-message-warning .rs-btn-close {
   color: #ffb300;
@@ -9536,6 +9557,13 @@ textarea.rs-picker-search-input {
   color: #575757;
   color: var(--rs-message-error-text);
 }
+.rs-message-error .rs-btn-close {
+  position: absolute;
+  left: 0;
+  top: 0;
+  padding: 8px;
+  font-size: 12px;
+}
 .rs-message-error .rs-message-icon-wrapper > .rs-icon,
 .rs-message-error .rs-btn-close {
   color: #f44336;
@@ -10312,6 +10340,13 @@ textarea.rs-picker-search-input {
 .rs-notification.rs-notification-hiding ~ .rs-notification {
   margin-top: 0;
 }
+.rs-notification .rs-btn-close {
+  position: absolute;
+  left: 0;
+  top: 0;
+  padding: 8px;
+  font-size: 12px;
+}
 .rs-notification-success .rs-notification-content .rs-notification-title + .rs-notification-description {
   margin-right: 34px;
 }
@@ -11831,15 +11866,6 @@ textarea.rs-picker-search-input {
 .rs-picker-toggle-clean.rs-btn-close {
   padding: 4px 0;
 }
-.rs-picker-toggle-clean:hover {
-  color: #f44336;
-  color: var(--rs-state-error);
-}
-.rs-picker-toggle-clean:hover svg path {
-  stroke: #f44336;
-  stroke: var(--rs-state-error);
-  stroke-width: 1;
-}
 .rs-picker-date .rs-picker-toggle-clean,
 .rs-picker-daterange .rs-picker-toggle-clean {
   left: 38px;
@@ -14807,11 +14833,8 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
 }
 .rs-tag-icon-close {
   position: absolute;
-  font-size: 12px;
-}
-.rs-tag-default .rs-tag-icon-close:hover {
-  color: #f44336;
-  color: var(--rs-tag-close);
+  top: 0;
+  left: 0;
 }
 .rs-tag-group {
   margin: -10px -10px 0 0;
@@ -16062,7 +16085,7 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
 }
 .rs-uploader-text .rs-uploader-file-item-btn-remove {
   position: absolute;
-  font-size: 12px;
+  font-size: 14px;
   top: 12px;
   left: 12px;
   color: #8e8e93;
@@ -16919,20 +16942,26 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
           animation-name: notificationMoveOut;
 }
 .rs-btn-close {
-  background: transparent;
-  position: absolute;
-  top: 0;
-  left: 0;
-  padding: 8px 8px 0;
-  font-size: 12px;
-  line-height: 1;
   border: none;
   outline: none !important;
+  background: transparent;
+  line-height: 1;
   cursor: pointer;
 }
 .rs-btn-close .rs-icon {
   vertical-align: bottom;
 }
+.rs-btn-close:hover,
+.rs-btn-close:focus {
+  color: #f44336;
+  color: var(--rs-close-button-hover-color);
+}
+.rs-btn-close:hover svg path,
+.rs-btn-close:focus svg path {
+  stroke: #f44336;
+  stroke: var(--rs-close-button-hover-color);
+  stroke-width: 1;
+}
 .rs-stack {
   display: -webkit-box;
   display: -ms-flexbox;