From 108ff189ab4628114ba092ca44f364854b5b6325 Mon Sep 17 00:00:00 2001
From: Egor Berezovskiy <egor@berezify.fr>
Date: Fri, 20 Dec 2024 15:55:30 +0100
Subject: [PATCH] front: fix pr comments

Signed-off-by: Egor Berezovskiy <egor@berezify.fr>
---
 ui-core/src/components/inputs/Input.tsx           |  6 +-----
 ui-core/src/components/inputs/InputStatusIcon.tsx |  2 +-
 ui-core/src/styles/inputs/fieldWrapper.css        |  4 ++++
 ui-core/src/styles/inputs/statusMessage.css       | 12 ++++++++++--
 4 files changed, 16 insertions(+), 8 deletions(-)

diff --git a/ui-core/src/components/inputs/Input.tsx b/ui-core/src/components/inputs/Input.tsx
index 8e3f988e..813c21bd 100644
--- a/ui-core/src/components/inputs/Input.tsx
+++ b/ui-core/src/components/inputs/Input.tsx
@@ -86,11 +86,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
         disabled={disabled}
         required={required}
         small={small}
-        statusIconPosition={
-          statusWithMessage?.tooltip === 'left' || statusWithMessage?.tooltip === 'right'
-            ? 'before-status-message'
-            : undefined
-        }
+        statusIconPosition={statusWithMessage?.tooltip ? 'before-status-message' : undefined}
         className={cx('input-field-wrapper', inputFieldWrapperClassname)}
       >
         <div
diff --git a/ui-core/src/components/inputs/InputStatusIcon.tsx b/ui-core/src/components/inputs/InputStatusIcon.tsx
index 0c6bf113..49232f17 100644
--- a/ui-core/src/components/inputs/InputStatusIcon.tsx
+++ b/ui-core/src/components/inputs/InputStatusIcon.tsx
@@ -16,7 +16,7 @@ const InputStatusIcon = ({ status, small, className }: InputStatusIconProps) =>
   return (
     <span className={cx('status-icon', className, status)}>
       {status === 'loading' && <Gear size={size} />}
-      {status === 'info' && <Info size={size} />}
+      {status === 'info' && <Info variant="fill" size={size} />}
       {status === 'success' && <CheckCircle variant="fill" size={size} />}
       {status === 'warning' && <Alert variant="fill" size={size} />}
       {status === 'error' && <Blocked variant="fill" size={size} />}
diff --git a/ui-core/src/styles/inputs/fieldWrapper.css b/ui-core/src/styles/inputs/fieldWrapper.css
index 180e0ee3..26c101df 100644
--- a/ui-core/src/styles/inputs/fieldWrapper.css
+++ b/ui-core/src/styles/inputs/fieldWrapper.css
@@ -3,6 +3,10 @@
   position: relative;
   padding: 0.625rem 0.813rem 1rem 1rem;
 
+  &.success:not(:has(.status-message-wrapper-tooltip)) {
+    @apply bg-success-5;
+  }
+
   &.info:not(:has(.status-message-wrapper-tooltip)) {
     @apply bg-info-5;
   }
diff --git a/ui-core/src/styles/inputs/statusMessage.css b/ui-core/src/styles/inputs/statusMessage.css
index 4a242917..ced33794 100644
--- a/ui-core/src/styles/inputs/statusMessage.css
+++ b/ui-core/src/styles/inputs/statusMessage.css
@@ -61,6 +61,10 @@
     --tooltip-overlap: 5px;
   }
 
+  &.success {
+    background-color: theme('colors.success.5');
+  }
+
   &.error {
     background-color: theme('colors.error.5');
   }
@@ -74,17 +78,21 @@
   }
 
   &.tooltip-left {
-    left: -5px;
+    left: 8px;
   }
 
   &.tooltip-right {
-    right: -5px;
+    right: 8px;
   }
 
   .status-message {
     font-weight: 600;
     text-align: left;
 
+    &.success {
+      color: theme('colors.success.60');
+    }
+
     &.error {
       color: theme('colors.error.60');
     }