#RI-4217-4219 - update styles

Author: AmirAllayarovSofteq

redisinsight/ui/src/components/uploadFile/UploadFile.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { EuiButtonEmpty, EuiText } from '@elastic/eui'
+import { EuiButtonEmpty, EuiText, EuiIcon } from '@elastic/eui'
 
 import styles from './styles.module.scss'
 
@@ -10,18 +10,18 @@ export interface Props {
 
 const UploadFile = ({ onFileChange, onClick }: Props) => (
   <EuiButtonEmpty
-    iconType="folderOpen"
     className={styles.emptyBtn}
+    onClick={onClick}
   >
     <label htmlFor="upload-input-file" className={styles.uploadBtn}>
+      <EuiIcon className={styles.icon} type="folderOpen" />
       <EuiText className={styles.label}>Upload</EuiText>
       <input
         type="file"
         id="upload-input-file"
         data-testid="upload-input-file"
         accept="application/json, text/plain"
         onChange={onFileChange}
-        onClick={onClick}
         className={styles.fileDrop}
         aria-label="Select file"
       />

redisinsight/ui/src/components/uploadFile/styles.module.scss

@@ -5,6 +5,7 @@
 .uploadBtn {
   display: flex;
   cursor: pointer;
+  padding: 4px 12px;
 }
 
 .emptyBtn:global(.euiButtonEmpty) {
@@ -13,7 +14,14 @@
 }
 
 .emptyBtn:global(.euiButtonEmpty .euiButtonEmpty__content) {
-  padding: 0 12px;
+  padding: 0;
+}
+
+.emptyBtn .icon {
+  width: 14px;
+  height: 14px;
+  margin-right: 4px;
+  color: var(--inputTextColor);
 }
 
 :global(.euiButtonEmpty.euiButtonEmpty--primary).emptyBtn .label {

redisinsight/ui/src/pages/home/HomePage.tsx

@@ -248,9 +248,8 @@ const HomePage = () => {
                             [styles.contentActive]: editDialogIsOpen,
                           })}
                           id="form"
-                          minSize="538px"
                           paddingSize="none"
-                          style={{ minWidth: '512px' }}
+                          style={{ minWidth: '545px' }}
                         >
                           {editDialogIsOpen && (
                             <AddDatabaseContainer

redisinsight/ui/src/pages/home/components/AddInstanceForm/InstanceForm/InstanceForm.tsx

@@ -446,6 +446,7 @@ const AddStandaloneForm = (props: Props) => {
           alignItems="center"
           className="footerAddDatabase"
           gutterSize="none"
+          responsive={false}
           style={{ height: '68px' }}
         >
           <EuiFlexItem className="btn-back" grow={false}>
@@ -492,7 +493,7 @@ const AddStandaloneForm = (props: Props) => {
                 submitIsDisabled={submitIsDisable()}
               />
             </EuiFlexGroup>
-            </EuiFlexItem>
+          </EuiFlexItem>
         </EuiFlexGroup>,
         footerEl
       )