rsuite 5.51.0 → 5.52.0

package/Message/styles/index.css

@@ -0,0 +1,473 @@
+:root,
+.rs-theme-light {
+  --rs-gray-0: #fff;
+  --rs-gray-50: #f7f7fa;
+  --rs-gray-800: #575757;
+  --rs-gray-900: #272c36;
+  --rs-color-red: #f44336;
+  --rs-color-yellow: #ffb300;
+  --rs-color-green: #4caf50;
+  --rs-color-blue: #2196f3;
+  --rs-red-50: #fff2f2;
+  --rs-red-300: #fa8682;
+  --rs-red-500: #f44336;
+  --rs-red-900: #8f1300;
+  --rs-yellow-50: #fffaf2;
+  --rs-yellow-500: #ffb300;
+  --rs-yellow-900: #997500;
+  --rs-green-50: #eeffed;
+  --rs-green-300: #82cf82;
+  --rs-green-500: #4caf50;
+  --rs-green-900: #007d0c;
+  --rs-blue-50: #f0f9ff;
+  --rs-blue-500: #2196f3;
+  --rs-blue-900: #00448c;
+  --rs-text-primary: var(--rs-gray-800);
+  --rs-text-heading: var(--rs-gray-900);
+  --rs-message-success-header: var(--rs-text-heading);
+  --rs-message-success-text: var(--rs-text-primary);
+  --rs-message-success-icon: var(--rs-color-green);
+  --rs-message-success-bg: var(--rs-green-50);
+  --rs-message-info-header: var(--rs-text-heading);
+  --rs-message-info-text: var(--rs-text-primary);
+  --rs-message-info-icon: var(--rs-color-blue);
+  --rs-message-info-bg: var(--rs-blue-50);
+  --rs-message-warning-header: var(--rs-text-heading);
+  --rs-message-warning-text: var(--rs-text-primary);
+  --rs-message-warning-icon: var(--rs-color-yellow);
+  --rs-message-warning-bg: var(--rs-yellow-50);
+  --rs-message-error-header: var(--rs-text-heading);
+  --rs-message-error-text: var(--rs-text-primary);
+  --rs-message-error-icon: var(--rs-color-red);
+  --rs-message-error-bg: var(--rs-red-50);
+  --rs-close-button-hover-color: var(--rs-color-red);
+}
+.rs-theme-dark {
+  --rs-gray-0: #fff;
+  --rs-gray-50: #e9ebf0;
+  --rs-gray-800: #1a1d24;
+  --rs-gray-900: #0f131a;
+  --rs-color-red: #f04f43;
+  --rs-color-yellow: #ffc757;
+  --rs-color-green: #58b15b;
+  --rs-color-blue: #1499ef;
+  --rs-red-50: #ffeded;
+  --rs-red-300: #f58884;
+  --rs-red-500: #f04f43;
+  --rs-red-900: #8a1200;
+  --rs-yellow-50: #fff9f0;
+  --rs-yellow-500: #ffc757;
+  --rs-yellow-900: #997000;
+  --rs-green-50: #f3fff2;
+  --rs-green-300: #8ccf8c;
+  --rs-green-500: #58b15b;
+  --rs-green-900: #007d0c;
+  --rs-blue-50: #edf9ff;
+  --rs-blue-500: #1499ef;
+  --rs-blue-900: #00498a;
+  --rs-text-primary: var(--rs-gray-50);
+  --rs-text-heading: var(--rs-gray-0);
+  --rs-message-success-header: #fff;
+  --rs-message-success-text: #fff;
+  --rs-message-success-icon: #fff;
+  --rs-message-success-bg: var(--rs-green-500);
+  --rs-message-info-header: #fff;
+  --rs-message-info-text: #fff;
+  --rs-message-info-icon: #fff;
+  --rs-message-info-bg: var(--rs-blue-500);
+  --rs-message-warning-header: var(--rs-gray-900);
+  --rs-message-warning-text: var(--rs-gray-900);
+  --rs-message-warning-icon: var(--rs-gray-900);
+  --rs-message-warning-bg: var(--rs-yellow-500);
+  --rs-message-error-header: #fff;
+  --rs-message-error-text: #fff;
+  --rs-message-error-icon: #fff;
+  --rs-message-error-bg: var(--rs-red-500);
+  --rs-close-button-hover-color: var(--rs-color-red);
+}
+.rs-theme-high-contrast {
+  --rs-gray-0: #fff;
+  --rs-gray-50: #e9ebf0;
+  --rs-gray-800: #1a1d24;
+  --rs-gray-900: #0f131a;
+  --rs-color-red: #bd1732;
+  --rs-color-yellow: #ffc757;
+  --rs-color-green: #0d822c;
+  --rs-color-blue: #1499ef;
+  --rs-red-50: #fff2f5;
+  --rs-red-300: #d6637a;
+  --rs-red-500: #bd1732;
+  --rs-red-900: #70000b;
+  --rs-yellow-50: #fff9f0;
+  --rs-yellow-500: #ffc757;
+  --rs-yellow-900: #997000;
+  --rs-green-50: #f2fff5;
+  --rs-green-300: #50b567;
+  --rs-green-500: #0d822c;
+  --rs-green-900: #006923;
+  --rs-blue-50: #edf9ff;
+  --rs-blue-500: #1499ef;
+  --rs-blue-900: #00498a;
+  --rs-text-primary: var(--rs-gray-50);
+  --rs-text-heading: var(--rs-gray-0);
+  --rs-message-success-header: #fff;
+  --rs-message-success-text: #fff;
+  --rs-message-success-icon: #fff;
+  --rs-message-success-bg: var(--rs-green-900);
+  --rs-message-success-border: var(--rs-green-300);
+  --rs-message-info-header: #fff;
+  --rs-message-info-text: #fff;
+  --rs-message-info-icon: #fff;
+  --rs-message-info-bg: var(--rs-blue-900);
+  --rs-message-info-border: var(--rs-blue-500);
+  --rs-message-warning-header: #fff;
+  --rs-message-warning-text: #fff;
+  --rs-message-warning-icon: #fff;
+  --rs-message-warning-bg: var(--rs-yellow-900);
+  --rs-message-warning-border: var(--rs-yellow-500);
+  --rs-message-error-header: #fff;
+  --rs-message-error-text: #fff;
+  --rs-message-error-icon: #fff;
+  --rs-message-error-bg: var(--rs-red-900);
+  --rs-message-error-border: var(--rs-red-300);
+  --rs-close-button-hover-color: var(--rs-color-red);
+}
+/* stylelint-disable */
+*[class*='rs-'] {
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+}
+*[class*='rs-']::before,
+*[class*='rs-']::after {
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+}
+@-webkit-keyframes notificationMoveIn {
+  0% {
+    opacity: 0;
+    -webkit-transform-origin: 0% 0%;
+            transform-origin: 0% 0%;
+    -webkit-transform: scaleY(0.8);
+            transform: scaleY(0.8);
+  }
+  100% {
+    opacity: 1;
+    -webkit-transform-origin: 0% 0%;
+            transform-origin: 0% 0%;
+    -webkit-transform: scaleY(1);
+            transform: scaleY(1);
+  }
+}
+@keyframes notificationMoveIn {
+  0% {
+    opacity: 0;
+    -webkit-transform-origin: 0% 0%;
+            transform-origin: 0% 0%;
+    -webkit-transform: scaleY(0.8);
+            transform: scaleY(0.8);
+  }
+  100% {
+    opacity: 1;
+    -webkit-transform-origin: 0% 0%;
+            transform-origin: 0% 0%;
+    -webkit-transform: scaleY(1);
+            transform: scaleY(1);
+  }
+}
+@-webkit-keyframes notificationMoveInLeft {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(-100%, 0, 0);
+            transform: translate3d(-100%, 0, 0);
+  }
+  to {
+    opacity: 1;
+    -webkit-transform: none;
+            transform: none;
+  }
+}
+@keyframes notificationMoveInLeft {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(-100%, 0, 0);
+            transform: translate3d(-100%, 0, 0);
+  }
+  to {
+    opacity: 1;
+    -webkit-transform: none;
+            transform: none;
+  }
+}
+@-webkit-keyframes notificationMoveInRight {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(100%, 0, 0);
+            transform: translate3d(100%, 0, 0);
+  }
+  to {
+    opacity: 1;
+    -webkit-transform: none;
+            transform: none;
+  }
+}
+@keyframes notificationMoveInRight {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(100%, 0, 0);
+            transform: translate3d(100%, 0, 0);
+  }
+  to {
+    opacity: 1;
+    -webkit-transform: none;
+            transform: none;
+  }
+}
+@-webkit-keyframes notificationMoveOut {
+  0% {
+    opacity: 1;
+    -webkit-transform-origin: 0% 0%;
+            transform-origin: 0% 0%;
+    -webkit-transform: scaleY(1);
+            transform: scaleY(1);
+    max-height: 100px;
+  }
+  100% {
+    opacity: 0;
+    -webkit-transform-origin: 0% 0%;
+            transform-origin: 0% 0%;
+    -webkit-transform: scaleY(0.8);
+            transform: scaleY(0.8);
+    max-height: 0;
+    overflow: hidden;
+  }
+}
+@keyframes notificationMoveOut {
+  0% {
+    opacity: 1;
+    -webkit-transform-origin: 0% 0%;
+            transform-origin: 0% 0%;
+    -webkit-transform: scaleY(1);
+            transform: scaleY(1);
+    max-height: 100px;
+  }
+  100% {
+    opacity: 0;
+    -webkit-transform-origin: 0% 0%;
+            transform-origin: 0% 0%;
+    -webkit-transform: scaleY(0.8);
+            transform: scaleY(0.8);
+    max-height: 0;
+    overflow: hidden;
+  }
+}
+.rs-btn-close {
+  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-message {
+  border-radius: 6px;
+  font-size: 14px;
+  line-height: 1.42857143;
+  position: relative;
+  -webkit-animation-fill-mode: forwards;
+          animation-fill-mode: forwards;
+}
+.rs-message-container {
+  padding: 20px;
+  padding-right: 28px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+}
+.rs-message-icon-wrapper {
+  -ms-flex-item-align: center;
+      align-self: center;
+  font-size: 0;
+  margin-right: 10px;
+}
+.rs-message-icon-wrapper .rs-icon {
+  font-size: 12px;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+}
+.rs-message-content {
+  -webkit-box-flex: 1;
+      -ms-flex-positive: 1;
+          flex-grow: 1;
+}
+.rs-message-header {
+  color: #272c36;
+  color: var(--rs-text-heading);
+  line-height: 1.71428571;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  width: 100%;
+}
+.rs-message-header + .rs-message-body {
+  margin-top: 4px;
+}
+.rs-message-body {
+  color: #575757;
+  color: var(--rs-text-primary);
+}
+.rs-message.rs-message-has-title .rs-message-icon-wrapper {
+  -ms-flex-item-align: start;
+      align-self: flex-start;
+}
+.rs-message.rs-message-has-title .rs-message-icon-wrapper .rs-icon {
+  font-size: 24px;
+  line-height: 1;
+}
+.rs-message:not(.rs-message-hiding) + .rs-message {
+  margin-top: 10px;
+}
+.rs-message:not(.rs-message-hiding) + .rs-message.rs-message-hiding:last-child {
+  -webkit-transition: margin-top 0.1s linear 0.3s;
+  transition: margin-top 0.1s linear 0.3s;
+  margin-top: 0;
+}
+.rs-message.rs-message-hiding {
+  -webkit-animation: notificationMoveOut 0.3s ease-in forwards;
+          animation: notificationMoveOut 0.3s ease-in forwards;
+}
+.rs-theme-dark .rs-message .rs-btn-link,
+.rs-theme-dark .rs-message a {
+  color: inherit;
+  text-decoration: underline;
+}
+.rs-message-full {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  border-radius: 0;
+}
+.rs-message-success {
+  background-color: #eeffed;
+  background-color: var(--rs-message-success-bg);
+}
+.rs-message-success .rs-message-header {
+  color: #272c36;
+  color: var(--rs-message-success-header);
+}
+.rs-message-success .rs-message-body {
+  color: #575757;
+  color: var(--rs-message-success-text);
+}
+.rs-message-success .rs-btn-close {
+  position: absolute;
+  right: 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;
+  color: var(--rs-message-success-icon);
+}
+.rs-theme-high-contrast .rs-message-success {
+  border: 1px solid var(--rs-message-success-border);
+}
+.rs-message-info {
+  background-color: #f0f9ff;
+  background-color: var(--rs-message-info-bg);
+}
+.rs-message-info .rs-message-header {
+  color: #272c36;
+  color: var(--rs-message-info-header);
+}
+.rs-message-info .rs-message-body {
+  color: #575757;
+  color: var(--rs-message-info-text);
+}
+.rs-message-info .rs-btn-close {
+  position: absolute;
+  right: 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;
+  color: var(--rs-message-info-icon);
+}
+.rs-theme-high-contrast .rs-message-info {
+  border: 1px solid var(--rs-message-info-border);
+}
+.rs-message-warning {
+  background-color: #fffaf2;
+  background-color: var(--rs-message-warning-bg);
+}
+.rs-message-warning .rs-message-header {
+  color: #272c36;
+  color: var(--rs-message-warning-header);
+}
+.rs-message-warning .rs-message-body {
+  color: #575757;
+  color: var(--rs-message-warning-text);
+}
+.rs-message-warning .rs-btn-close {
+  position: absolute;
+  right: 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;
+  color: var(--rs-message-warning-icon);
+}
+.rs-theme-high-contrast .rs-message-warning {
+  border: 1px solid var(--rs-message-warning-border);
+}
+.rs-message-error {
+  background-color: #fff2f2;
+  background-color: var(--rs-message-error-bg);
+}
+.rs-message-error .rs-message-header {
+  color: #272c36;
+  color: var(--rs-message-error-header);
+}
+.rs-message-error .rs-message-body {
+  color: #575757;
+  color: var(--rs-message-error-text);
+}
+.rs-message-error .rs-btn-close {
+  position: absolute;
+  right: 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;
+  color: var(--rs-message-error-icon);
+}
+.rs-theme-high-contrast .rs-message-error {
+  border: 1px solid var(--rs-message-error-border);
+}
+
+/*# sourceMappingURL=index.css.map */

package/Message/styles/index.less

@@ -1,6 +1,7 @@
-@import '../../styles/common';
-@import '../../toaster/styles/animation';
-@import 'mixin';
+@import '../../styles/common.less';
+@import '../../toaster/styles/animation.less';
+@import '../../internals/CloseButton/styles/index.less';
+@import './mixin.less';
 
 //
 // Messages