Skip to content

Commit

Permalink
Update dense form help text/validation docs
Browse files Browse the repository at this point in the history
  • Loading branch information
jmuzina committed Oct 21, 2024
1 parent 6864e80 commit 4afc7fb
Showing 1 changed file with 9 additions and 1 deletion.
10 changes: 9 additions & 1 deletion templates/docs/base/forms.md
Original file line number Diff line number Diff line change
Expand Up @@ -177,6 +177,14 @@ Supplementary help text can be provided for the form fields by adding an element
View example of a form fields with help text
</a></div>

### Dense help text {{ status('updated') }}

To use help text with a [dense input element](#dense-form-elements), add `.is-dense` to the `.p-form-validation__input` element.

<div class="embedded-example"><a href="/docs/examples/patterns/forms/form-help-text-dense" class="js-example">
View example of a form fields with dense help text
</a></div>

## Validation

To use form validation feedback - which includes feedback messages, icons and border colours - wrap individual input elements in a `p-form-validation` and additionally apply the `.is-error`, `.is-caution` or `.is-success` to the wrapper as appropriate.
Expand All @@ -189,7 +197,7 @@ Descriptive text relating to the element's validation status should use the clas
View example of form validation patterns
</a></div>

### Dense form validation select wrapper
### Dense form validation select wrapper {{ status('updated') }}

To create a [dense input](#dense-form-elements) inside a `p-form-validation__select-wrapper`, add the `.is-dense` class to the select wrapper, not the input.

Expand Down

0 comments on commit 4afc7fb

Please sign in to comment.