- remove invalid rule;

- fix error-text color;
- rollback hintText logic;

Author: JoaoFerreira-FrontEnd

core/src/components/checkbox/checkbox.ionic.scss

@@ -117,7 +117,7 @@ input {
 }
 
 .checkbox-bottom .error-text {
-  color: globals.$ion-text-danger;
+  color: globals.$ion-semantics-danger-800;
 }
 
 .checkbox-bottom .helper-text {
@@ -197,9 +197,9 @@ input {
 
 // Ionic Design Checkbox Invalid
 // --------------------------------------------------
-:host(.ion-invalid:not(.checkbox-checked)) {
+:host(.ion-invalid) {
   --focus-ring-color: #{globals.$ion-border-focus-error};
-
+  
   .native-wrapper {
     border-color: globals.$ion-border-danger-default;
   }

core/src/components/checkbox/checkbox.tsx

@@ -239,30 +239,25 @@ export class Checkbox implements ComponentInterface {
    * This element should only be rendered if hint text is set.
    */
   private renderHintText() {
-    const { helperText, errorText, helperTextId, errorTextId, checked } = this;
+    const { helperText, errorText, helperTextId, errorTextId } = this;
 
     /**
      * undefined and empty string values should
      * be treated as not having helper/error text.
      */
-    const hasHelperText = !!helperText;
-    const hasErrorText = !!errorText && !checked;
-    if (!hasHelperText && !hasErrorText) {
+    const hasHintText = !!helperText || !!errorText;
+    if (!hasHintText) {
       return;
     }
 
     return (
       <div class="checkbox-bottom">
-        {hasHelperText && (
-          <div id={helperTextId} class="helper-text" part="supporting-text helper-text">
-            {helperText}
-          </div>
-        )}
-        {hasErrorText && (
-          <div id={errorTextId} class="error-text" part="supporting-text error-text">
-            {errorText}
-          </div>
-        )}
+        <div id={helperTextId} class="helper-text" part="supporting-text helper-text">
+          {helperText}
+        </div>
+        <div id={errorTextId} class="error-text" part="supporting-text error-text">
+          {errorText}
+        </div>
       </div>
     );
   }