create regular input field component

Author: AnthonyMarin

src/components/settings/Settings.styles.ts

@@ -2,6 +2,14 @@ import styled from 'styled-components';
 import { Input } from 'antd';
 
 export const InputField = styled(Input)`
+  border-radius: 7px !important;
+  padding: 0.5rem !important;
+  &:focus{
+  border-color: var(--ant-primary-5) !important;
+  box-shadow: 0 0 0 2px var(--ant-primary-color-outline) !important;
+  }
+`;
+
 export const InputFieldWithPrefix = styled(Input)`
   &.ant-input-affix-wrapper {
     padding: 0 !important;

src/components/settings/SettingsPage.tsx

@@ -122,9 +122,8 @@ const SettingsWrapper = styled.div`
   }
   
   .ant-input, .ant-input-number, .ant-select-selector {
-    background-color: rgba(0, 0, 0, 0.2) !important;
-    border: 1px solid rgba(255, 255, 255, 0.1) !important;
-    border-radius: 4px !important;
+    background-color: var(--input-bg-color) !important;
+    border: 1px solid var(--border-base-color) !important;
   }
 `;