Skip to content

Commit

Permalink
Update a11y-no-visually-hidden-interactive-element.md
Browse files Browse the repository at this point in the history
### What

Clean up documentation `htmlPropName` was moved to the eslint settings.
  • Loading branch information
kendallgassner committed Jul 21, 2023
1 parent cd17c09 commit 213894f
Showing 1 changed file with 2 additions and 4 deletions.
6 changes: 2 additions & 4 deletions docs/rules/a11y-no-visually-hidden-interactive-element.md
Expand Up @@ -12,7 +12,7 @@ Note: we are not guarding against visually hidden `input` elements at this time.

### Why do we visually hide content?

Visually hiding content can be useful when you want to provide information specifically to screen reader users or other assitive technology users while keeping content hidden from sighted users.
Visually hiding content can be useful when you want to provide information specifically to screen reader users or other assistive technology users while keeping content hidden from sighted users.

Applying the following css will visually hide content while still making it accessible to screen reader users.

Expand Down Expand Up @@ -61,16 +61,14 @@ width: 1px;

- className - A css className that visually hides content. Defaults to `sr-only`.
- componentName - A react component name that visually hides content. Defaults to `VisuallyHidden`.
- htmlPropName - A prop name used to replace the semantic element that is rendered. Defaults to `as`.

```json
{
"a11y-no-visually-hidden-interactive-element": [
"error",
{
"className": "visually-hidden",
"componentName": "VisuallyHidden",
"htmlPropName": "as"
"componentName": "VisuallyHidden"
}
]
}
Expand Down

0 comments on commit 213894f

Please sign in to comment.