Improve changing of className

auth0 · Sep 5, 2023 · 7e38507 · 7e38507
1 parent cddf14e
commit 7e38507
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 8 deletions.
diff --git a/css/index.styl b/css/index.styl
@@ -495,10 +495,8 @@ loadingSize = 30px
       background #ffffff
       border 1px solid #ffffff
   .auth0-lock-input-checkbox.auth0-lock-error .auth0-lock-input-wrap
-    span
+    span.no-hint
       color red
-    .dont-show-as-invalid
-      color rgba(0,0,0,0.54)
 
   // Social
 

diff --git a/src/__tests__/field/__snapshots__/custom_input.test.jsx.snap b/src/__tests__/field/__snapshots__/custom_input.test.jsx.snap
@@ -18,7 +18,7 @@ exports[`CustomInput when type == checkbox and when placeholderHTML is set rende
         type="checkbox"
       />
       <span
-        className="dont-show-as-invalid"
+        className=""
         dangerouslySetInnerHTML={
           {
             "__html": "<b>Placeholder</b>",
@@ -48,7 +48,7 @@ exports[`CustomInput when type == checkbox highlights placeholder text when no i
         type="checkbox"
       />
       <span
-        className="show-as-invalid"
+        className="no-hint"
         dangerouslySetInnerHTML={
           {
             "__html": "<b>Placeholder</b>",
@@ -78,7 +78,7 @@ exports[`CustomInput when type == checkbox renders correctly as a CheckBoxInput
         type="checkbox"
       />
       <span
-        className="dont-show-as-invalid"
+        className=""
       >
         placeholder
       </span>
@@ -105,7 +105,7 @@ exports[`CustomInput when type == checkbox shows an error when value is incorrec
         type="checkbox"
       />
       <span
-        className="dont-show-as-invalid"
+        className=""
         dangerouslySetInnerHTML={
           {
             "__html": "<b>Placeholder</b>",

diff --git a/src/ui/input/checkbox_input.jsx b/src/ui/input/checkbox_input.jsx
@@ -14,7 +14,7 @@ export default class CheckboxInput extends React.Component {
       invalidHint
     } = this.props;
 
-    const spanClass = invalidHint ? 'dont-show-as-invalid' : 'show-as-invalid'
+    const spanClass = invalidHint ? '' : 'no-hint'
 
     return (
       <InputWrap