feat: warning variant of form-field-description

nl-design-system · Oct 14, 2021 · e047a94 · e047a94
1 parent ccb9204
commit e047a94
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/components/form-field-description/bem.js b/components/form-field-description/bem.js
@@ -9,6 +9,7 @@ export const FormFieldDescription = ({ id = null, innerHTML = '', status = null
   `<div${id ? ` id="${id}"` : ''} class="${clsx(
     'utrecht-form-field-description',
     'utrecht-form-field-description--distanced',
-    status === 'valid' && 'utrecht-form-field-description--valid',
     status === 'invalid' && 'utrecht-form-field-description--invalid',
+    status === 'valid' && 'utrecht-form-field-description--valid',
+    status === 'warning' && 'utrecht-form-field-description--warning',
   )}">${innerHTML}</div>`;
diff --git a/components/form-field-description/bem.scss b/components/form-field-description/bem.scss
@@ -31,3 +31,7 @@
     var(--utrecht-feedback-valid-color, var(--utrecht-feedback-safe-color))
   );
 }
+
+.utrecht-form-field-description--warning {
+  color: var(--utrecht-form-field-description-warning-color, var(--utrecht-feedback-warning-color));
+}