messages form

src/containers/dialogs/BetterScrollDialog/index.tsx

@@ -22,8 +22,6 @@ const BetterScrollDialog: FC<IProps> = ({
   footer,
   width = 600,
   error,
-  onOverlayClick,
-  onRefCapture,
   onClose,
 }) => {
   const ref = useRef(null);
@@ -43,7 +41,12 @@ const BetterScrollDialog: FC<IProps> = ({
           </div>
         )}
         {header && <div className={styles.header}>{header}</div>}
-        <div className={styles.body}>{children}</div>
+
+        <div className={styles.body}>
+          {children}
+          {error && <div className={styles.error}>{error}</div>}
+        </div>
+
         {footer && <div className={styles.header}>{footer}</div>}
       </div>
     </div>

src/containers/dialogs/BetterScrollDialog/styles.scss

@@ -39,13 +39,14 @@
 .footer {
   @include outer_shadow();
 
-  padding: 10px;
+  // padding: 10px;
   background: darken($content_bg, 2%);
 }
 
 .body {
   @include outer_shadow();
 
+  position: relative;
   overflow: auto;
   flex: 1;
   background: $content_bg;
@@ -86,3 +87,13 @@
     height: 24px;
   }
 }
+
+.error {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 40px;
+  pointer-events: none;
+  background: linear-gradient($red, transparentize($red, 1));
+}