diff options
author | Mario <mario@mariovavti.com> | 2023-05-17 13:28:23 +0000 |
---|---|---|
committer | Mario <mario@mariovavti.com> | 2023-05-17 13:28:23 +0000 |
commit | 65d98af24c3c7b784f7e2c95998df65901011ce3 (patch) | |
tree | d7d6a60698d7a0c3704ea55cb71c543285186b17 /vendor/twbs/bootstrap/site/content/docs/5.3/forms/validation.md | |
parent | a57739c462a7991bf2130e8eca0c383eb276f0cd (diff) | |
parent | 62d35627f35537d0056482047e74a27ad837c3cf (diff) | |
download | volse-hubzilla-65d98af24c3c7b784f7e2c95998df65901011ce3.tar.gz volse-hubzilla-65d98af24c3c7b784f7e2c95998df65901011ce3.tar.bz2 volse-hubzilla-65d98af24c3c7b784f7e2c95998df65901011ce3.zip |
Merge branch '8.4RC'8.4
Diffstat (limited to 'vendor/twbs/bootstrap/site/content/docs/5.3/forms/validation.md')
-rw-r--r-- | vendor/twbs/bootstrap/site/content/docs/5.3/forms/validation.md | 26 |
1 files changed, 20 insertions, 6 deletions
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.3/forms/validation.md b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/validation.md index b119cd07d..5eb18f025 100644 --- a/vendor/twbs/bootstrap/site/content/docs/5.3/forms/validation.md +++ b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/validation.md @@ -127,7 +127,7 @@ While these feedback styles cannot be styled with CSS, you can still customize t <label for="validationDefaultUsername" class="form-label">Username</label> <div class="input-group"> <span class="input-group-text" id="inputGroupPrepend2">@</span> - <input type="text" class="form-control" id="validationDefaultUsername" aria-describedby="inputGroupPrepend2" required> + <input type="text" class="form-control" id="validationDefaultUsername" aria-describedby="inputGroupPrepend2" required> </div> </div> <div class="col-md-6"> @@ -349,19 +349,33 @@ If your form layout allows it, you can swap the `.{valid|invalid}-feedback` clas </form> {{< /example >}} -## Sass +## 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" >}} -### Mixins +{{< 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. +Two mixins are combined, through our [loop](#loop), to generate our form validation feedback styles. {{< scss-docs name="form-validation-mixins" file="scss/mixins/_forms.scss" >}} -### Map +### Sass map This is the validation Sass map from `_variables.scss`. Override or extend this to generate different or additional states. @@ -369,7 +383,7 @@ This is the validation Sass map from `_variables.scss`. Override or extend this Maps of `$form-validation-states` can contain three optional parameters to override tooltips and focus styles. -### Loop +### Sass loop Used to iterate over `$form-validation-states` map values to generate our validation styles. Any modifications to the above Sass map will be reflected in your compiled CSS via this loop. |