Merge pull request #2985 from RedisInsight/fe/feature/RI-5351-update-db-form

#RI-5351 - update styles for db form

Author: mariasergeenko

redisinsight/ui/src/pages/home/components/database-panel/DatabasePanel.tsx

@@ -205,7 +205,7 @@ const DatabasePanel = React.memo((props: Props) => {
   )
 
   return (
-    <>
+    <div className="databasePanelWrapper">
       <div className={cx('container relative', { addDbWrapper: !editMode })}>
         {!isFullWidth && onClose && (
           <EuiToolTip
@@ -235,7 +235,7 @@ const DatabasePanel = React.memo((props: Props) => {
         {Form()}
       </div>
       <div id="footerDatabaseForm" />
-    </>
+    </div>
   )
 })
 

redisinsight/ui/src/pages/home/styles.scss

@@ -278,15 +278,18 @@
     }
   }
 
+  .databasePanelWrapper {
+    height: 100%;
+    background-color: var(--euiColorEmptyShade);
+  }
+
   .container {
     @include euiScrollBar;
 
-    background-color: var(--euiColorEmptyShade);
     overflow-y: auto;
     overflow-x: hidden;
-    height: calc(100% - 57px);
+    height: calc(100% - 74px);
     padding: 40px 30px 25px;
-    border: 1px solid var(--euiColorPrimary);
     margin-right: 5px;
     border-radius: 4px;
 
@@ -331,8 +334,10 @@
     text-align: right;
     vertical-align: bottom;
     width: 100%;
-    padding: 15px 24px 0;
+    padding: 16px 24px 16px;
     border-radius: 0 0 4px 4px;
+
+    border-top: 1px solid var(--euiColorLightShade);
   }
 
   .euiResizableContainer {