mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-18 11:21:23 +02:00
Code Issues Releases Wiki Activity

Update form validation styles to use new CSS variables for color and border-color (#38044)

Browse Source 
* Update form validation styles to use new CSS variables for color and border-color

* Use better Sass variables
This commit is contained in:
Mark Otto
2023-02-14 15:22:35 -08:00
committed by GitHub
parent 9dd42e1a07
commit 8fddb9fe57
4 changed files with 44 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
site/content/docs/5.3/forms/validation.md
View File

@@ -351,10 +351,24 @@ If your form layout allows it, you can swap the `.{valid|invalid}-feedback` clas
## CSS
### Variables
{{< added-in "5.3.0" >}}
As part of Bootstrap's evolving CSS variables approach, forms now use local CSS variables for validation for enhanced real-time customization. Values for the CSS variables are set via Sass, so Sass customization is still supported, too.
{{< scss-docs name="root-form-validation-variables" file="scss/_root.scss" >}}
These variables are also color mode adaptive, meaning they change color while in dark mode.
### Sass variables
{{< scss-docs name="form-feedback-variables" file="scss/_variables.scss" >}}
{{< scss-docs name="form-validation-colors" file="scss/_variables.scss" >}}
{{< scss-docs name="form-validation-colors-dark" file="scss/_variables-dark.scss" >}}
### Sass mixins
Two mixins are combined together, through our [loop](#loop), to generate our form validation feedback styles.