front: fix pr comments

Signed-off-by: Egor Berezovskiy <[email protected]>
OpenRailAssociation · Dec 20, 2024 · 108ff18 · 108ff18
1 parent 292635b
commit 108ff18
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 8 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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');
     }