@nordcode/ui 2.1.5 → 2.1.6

package/CHANGELOG.md

@@ -1,3 +1,13 @@
+## 2.1.6 (2025-12-12)
+
+### fixes
+
+- fix required checkboxes looking broken
+
+### features
+
+- add style for required markers
+
 ## 2.1.5 (2025-12-12)
 
 ### fixes

package/out/complete.css

@@ -2194,10 +2194,6 @@
     background-color: var(--_input-hover-background);
   }
 
-  :where(input, textarea, select, .nc-input)[required] {
-    border-inline-start-width: var(--border-width-thick);
-  }
-
   :where(input, textarea, select, .nc-input)::placeholder {
     color: var(--color-text-subtle);
   }
@@ -2432,6 +2428,11 @@
   :where(.nc-radio-field, .nc-checkbox-field) > :not(:first-child) {
     margin-block-start: var(--control-spacing-far, .75em);
   }
+
+  :where(.nc-input-required-mark) {
+    color: var(--color-status-danger-emphasis);
+    font-size: 1.25em;
+  }
 }
 
 @layer components.inputs-segmented {

package/out/complete_configless.css

@@ -1978,10 +1978,6 @@
     background-color: var(--_input-hover-background);
   }
 
-  :where(input, textarea, select, .nc-input)[required] {
-    border-inline-start-width: var(--border-width-thick);
-  }
-
   :where(input, textarea, select, .nc-input)::placeholder {
     color: var(--color-text-subtle);
   }
@@ -2216,6 +2212,11 @@
   :where(.nc-radio-field, .nc-checkbox-field) > :not(:first-child) {
     margin-block-start: var(--control-spacing-far, .75em);
   }
+
+  :where(.nc-input-required-mark) {
+    color: var(--color-status-danger-emphasis);
+    font-size: 1.25em;
+  }
 }
 
 @layer components.inputs-segmented {

package/package.json

@@ -12,7 +12,7 @@
     "type": "git",
     "url": "https://github.com/nordcode-agency/nordcode/tree/main/packages/ui"
   },
-  "version": "2.1.5",
+  "version": "2.1.6",
   "publishConfig": {
     "access": "public"
   },

package/src/styles/components/inputs/base.css

@@ -63,10 +63,6 @@
             background-color: var(--_input-hover-background);
         }
 
-        &[required] {
-            border-inline-start-width: var(--border-width-thick);
-        }
-
         &::placeholder {
             color: var(--color-text-subtle);
         }

package/src/styles/components/inputs/fields.css

@@ -81,4 +81,9 @@
             margin-block-start: var(--control-spacing-far, 0.75em);
         }
     }
+
+    :where(.nc-input-required-mark) {
+        color: var(--color-status-danger-emphasis);
+        font-size: 1.25em;
+    }
 }