Correção da cor do text input (#165)

* fix text input color * fix color with value
platformbuilders · Nov 7, 2023 · 2d91384 · 2d91384
1 parent 11ca201
commit 2d91384
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 7 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@platformbuilders/fluid-react",
-  "version": "1.1.1",
+  "version": "1.1.2",
   "private": false,
   "description": "Builders React for Fluid Design System",
   "keywords": [

diff --git a/src/components/TextInput/styles.tsx b/src/components/TextInput/styles.tsx
@@ -14,6 +14,7 @@ type InputProps = {
   $hasError: boolean;
 };
 
+const primaryMain = getTheme('brand.primary.main');
 const dangerMain = getTheme('danger.main');
 const textMain = getTheme('danger.main');
 const hasError = ifStyle('$hasError');
@@ -26,11 +27,13 @@ export const PlaceholderLabel = styled.span<PlaceholderLabelProps>`
   color: rgba(19, 19, 21, 0.6);
   transition: top 0.2s;
 
-  ${({ $hasValue }) =>
-    $hasValue &&
-    'top: 0; font-size: 0.9375rem; margin-bottom: 40px; color: #1e4bd1;'}
+  ${(props) =>
+    props.$hasValue &&
+    `top: 0; font-size: 0.9375rem; margin-bottom: 40px; color: ${primaryMain(
+      props,
+    )};`}
 
-  color: ${(props) => hasError(dangerMain(props), '#1e4bd1')(props)};
+  color: ${(props) => hasError(dangerMain(props), primaryMain(props))(props)};
 `;
 
 export const Input = styled.input<InputProps>`
@@ -50,15 +53,16 @@ export const Input = styled.input<InputProps>`
   }
 
   &:focus {
-    border-color: ${(props) => hasError(dangerMain(props), '#1e4bd1')(props)};
+    border-color: ${(props) =>
+      hasError(dangerMain(props), primaryMain(props))(props)};
     outline: none;
   }
 
   &:focus + ${PlaceholderLabel} {
     top: 0;
     font-size: 0.9375rem;
     margin-bottom: 40px;
-    color: ${(props) => hasError(dangerMain(props), '#1e4bd1')(props)};
+    color: ${(props) => hasError(dangerMain(props), primaryMain(props))(props)};
   }
 
   background: #eff1f2;