rsuite 5.74.2 → 5.76.0

package/toaster/styles/index.less

@@ -23,30 +23,6 @@
     box-shadow: var(--rs-shadow-overlay);
   }
 
-  // Animations
-  .rs-toast-fade-entered,
-  .rs-toast-fade-exiting {
-    animation-fill-mode: forwards;
-  }
-
-  .rs-toast-fade-entered {
-    animation-duration: 0.4s;
-    animation-timing-function: cubic-bezier(0.99, 0.44, 0.44, 1.35);
-  }
-
-  .rs-toast-fade-exited,
-  .rs-toast-fade-entering {
-    opacity: 0;
-  }
-
-  // The same to @keyframe notificationMoveOut  100%.
-  .rs-toast-fade-exited {
-    transform-origin: 0 0;
-    transform: scaleY(0.8);
-    max-height: 0;
-    overflow: hidden;
-  }
-
   &-top-center,
   &-bottom-center {
     align-items: center;
@@ -89,10 +65,34 @@
   &-bottom-end {
     bottom: @toast-spacing;
   }
+}
 
-  .rs-toast-fade-exiting {
-    animation-duration: 0.3s;
-    animation-timing-function: cubic-bezier(0.64, 0.65, 0.57, 1.13);
-    animation-name: notificationMoveOut;
-  }
+// Animations
+.rs-toast-fade-entered,
+.rs-toast-fade-exiting {
+  animation-fill-mode: forwards;
+}
+
+.rs-toast-fade-entered {
+  animation-duration: 0.4s;
+  animation-timing-function: cubic-bezier(0.99, 0.44, 0.44, 1.35);
+}
+
+.rs-toast-fade-exited,
+.rs-toast-fade-entering {
+  opacity: 0;
+}
+
+// The same to @keyframe notificationMoveOut  100%.
+.rs-toast-fade-exited {
+  transform-origin: 0 0;
+  transform: scaleY(0.8);
+  max-height: 0;
+  overflow: hidden;
+}
+
+.rs-toast-fade-exiting {
+  animation-duration: 0.3s;
+  animation-timing-function: cubic-bezier(0.64, 0.65, 0.57, 1.13);
+  animation-name: notificationMoveOut;
 }

package/useToaster/styles/index.css

@@ -157,29 +157,6 @@
           box-shadow: 0 4px 4px rgba(0, 0, 0, 0.12), 0 0 10px rgba(0, 0, 0, 0.06);
           box-shadow: var(--rs-shadow-overlay);
 }
-.rs-toast-container .rs-toast-fade-entered,
-.rs-toast-container .rs-toast-fade-exiting {
-  -webkit-animation-fill-mode: forwards;
-          animation-fill-mode: forwards;
-}
-.rs-toast-container .rs-toast-fade-entered {
-  -webkit-animation-duration: 0.4s;
-          animation-duration: 0.4s;
-  -webkit-animation-timing-function: cubic-bezier(0.99, 0.44, 0.44, 1.35);
-          animation-timing-function: cubic-bezier(0.99, 0.44, 0.44, 1.35);
-}
-.rs-toast-container .rs-toast-fade-exited,
-.rs-toast-container .rs-toast-fade-entering {
-  opacity: 0;
-}
-.rs-toast-container .rs-toast-fade-exited {
-  -webkit-transform-origin: 0 0;
-          transform-origin: 0 0;
-  -webkit-transform: scaleY(0.8);
-          transform: scaleY(0.8);
-  max-height: 0;
-  overflow: hidden;
-}
 .rs-toast-container-top-center,
 .rs-toast-container-bottom-center {
   -webkit-box-align: center;
@@ -227,7 +204,30 @@
 .rs-toast-container-bottom-end {
   bottom: 24px;
 }
-.rs-toast-container .rs-toast-fade-exiting {
+.rs-toast-fade-entered,
+.rs-toast-fade-exiting {
+  -webkit-animation-fill-mode: forwards;
+          animation-fill-mode: forwards;
+}
+.rs-toast-fade-entered {
+  -webkit-animation-duration: 0.4s;
+          animation-duration: 0.4s;
+  -webkit-animation-timing-function: cubic-bezier(0.99, 0.44, 0.44, 1.35);
+          animation-timing-function: cubic-bezier(0.99, 0.44, 0.44, 1.35);
+}
+.rs-toast-fade-exited,
+.rs-toast-fade-entering {
+  opacity: 0;
+}
+.rs-toast-fade-exited {
+  -webkit-transform-origin: 0 0;
+          transform-origin: 0 0;
+  -webkit-transform: scaleY(0.8);
+          transform: scaleY(0.8);
+  max-height: 0;
+  overflow: hidden;
+}
+.rs-toast-fade-exiting {
   -webkit-animation-duration: 0.3s;
           animation-duration: 0.3s;
   -webkit-animation-timing-function: cubic-bezier(0.64, 0.65, 0.57, 1.13);