error fixes

src/components/atoms/Input/index.module.css

@@ -15,14 +15,15 @@
 .error {
   display: inline-block;
   font-size: var(--font-size-mini);
+  line-height: 1.2;
   font-weight: var(--font-weight-bold);
   color: var(--brand-white);
   background: var(--brand-alert-red);
   border-radius: var(--border-radius);
-  padding: 0 0.4rem;
+  padding: 0.2rem 0.4rem;
   position: absolute;
   right: 0;
-  bottom: -0.75rem;
+  top: 85%;
   z-index: 1;
 }
 
@@ -31,7 +32,10 @@
 }
 
 .hasError input,
+.hasError input:focus,
 .hasError select,
-.hasError textarea {
+.hasError textarea,
+.hasError [class*='prefix'],
+.hasError [class*='postfix'] {
   border-color: var(--brand-alert-red);
 }

src/components/atoms/Input/index.tsx

@@ -71,7 +71,7 @@ export default function Input(props: Partial<InputProps>): ReactElement {
       </Label>
       <InputElement small={small} {...field} {...props} />
 
-      {field && field.name !== 'price' && (
+      {field && field.name !== 'price' && hasError && (
         <div className={styles.error}>
           <ErrorMessage name={field.name} />
         </div>

src/components/organisms/AssetActions/Pool/Add.tsx

@@ -179,7 +179,7 @@ export default function Add({
                 </div>
 
                 <Field name="amount">
-                  {({ field }: { field: any }) => (
+                  {({ field, form }: { field: any; form: any }) => (
                     <Input
                       type="number"
                       max={amountMax}
@@ -196,6 +196,7 @@ export default function Add({
                       }
                       placeholder="0"
                       field={field}
+                      form={form}
                     />
                   )}
                 </Field>