flash.scss in alchemy_cms-4.1.0.beta

- old
+ new
@@ -1,43 +1,52 @@
 div#flash_notices {
   position: fixed;
   right: 0;
   z-index: 400000;
-  width: 348px;
+  width: 400px;
   top: 0;
 
   .flash.error {
     cursor: pointer;
     padding-right: 24px;
 
     &:before {
+      content: fa-content($fa-var-times);
       position: absolute;
       right: 2*$default-padding;
-      top: 2*$default-padding;
-      @extend .icon-cross:before;
-      font-size: 14px;
-      font-family: 'Alchemy Icons';
+      top: 11px;
+      font-size: $small-font-size;
+      font-family: 'Font Awesome 5 Free';
     }
   }
 }
 
 div.flash {
-  @extend %rounded-border;
+  border-radius: $default-border-radius;
   opacity: 0.95;
   padding: 8px 8px 8px 30px;
   font-weight: bold;
   border-width: 1px;
   border-style: solid;
   z-index: 1000;
-  margin: $default-margin;
+  margin: $default-margin $default-margin 2*$default-margin;
   position: relative;
-  min-height: 1.3em;
+  min-height: 2.6em;
   word-break: break-all;
+  transition-property: opacity, transform;
+  transition-duration: 0.4s;
 
-  span.icon {
+  .icon {
     position: absolute;
-    top: 8px;
+    top: 10px;
     left: 8px;
+    color: inherit;
+  }
+
+  &.dismissed {
+    display: block;
+    opacity: 0;
+    transform: translate3d(0, -100%, 0);
   }
 
   &.notice {
     border-color: $success_border_color;
     color: $success_text_color;