diff options
Diffstat (limited to 'site/content/docs/4.3/forms/validation.md')
| -rw-r--r-- | site/content/docs/4.3/forms/validation.md | 28 |
1 files changed, 7 insertions, 21 deletions
diff --git a/site/content/docs/4.3/forms/validation.md b/site/content/docs/4.3/forms/validation.md index 2d6e2cab1..4613a6d74 100644 --- a/site/content/docs/4.3/forms/validation.md +++ b/site/content/docs/4.3/forms/validation.md @@ -370,24 +370,10 @@ Validation states can be customized via Sass with the `$form-validation-states` Please note that we do not recommend customizing these values without also modifying the `form-validation-state` mixin. -{{< highlight scss >}} -// Sass map from `_variables.scss` -// Override this and recompile your Sass to generate different states -$form-validation-states: ( - "valid": ( - "color": $form-feedback-valid-color, - "icon": $form-feedback-icon-valid - ), - "invalid": ( - "color": $form-feedback-invalid-color, - "icon": $form-feedback-icon-invalid - ) -); - -// Loop from `_forms.scss` -// Any modifications to the above Sass map will be reflected in your compiled -// CSS via this loop. -@each $state, $data in $form-validation-states { - @include form-validation-state($state, map-get($data, color), map-get($data, icon)); -} -{{< /highlight >}} +This is the Sass map from `_variables.scss`. Override this and recompile your Sass to generate different states: + +{{< scss-docs name="form-validation-states" file="scss/_variables.scss" >}} + +This is the loop from `forms/_validation.scss.scss`. Any modifications to the above Sass map will be reflected in your compiled CSS via this loop: + +{{< scss-docs name="form-validation-states-loop" file="scss/forms/_validation.scss" >}} |