Skip to content

Commit

Permalink
Change all true values to boolean in docs (#2330)
Browse files Browse the repository at this point in the history
  • Loading branch information
libertymayc committed Sep 5, 2023
1 parent 63c1f30 commit 8b20caa
Show file tree
Hide file tree
Showing 7 changed files with 10 additions and 10 deletions.
2 changes: 1 addition & 1 deletion site/docs/components/avatar/accessibility.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,6 @@ data:

### Best practices

Decorative Avatars (Avatars that repeat the information already expressed by the accompanied text) should be hidden from the screen reader to avoid repetition. If you are adding an Avatar for decorative purposes, pass `aria-hidden=”true”` to hide its label from the screen reader.
Decorative Avatars (Avatars that repeat the information already expressed by the accompanying text) should be hidden from the screen reader to avoid repetition. If you are adding an Avatar for decorative purposes, use `aria-hidden` to hide its label from the screen reader.

If an alternative icon is used inside an Avatar, the icon's `aria-label` should be descriptive in relation to the Avatar context, not the icon context. For example, when using `<BuildingSolidIcon/>` to represent a company `aria-label` should read "Company profile" rather than the Icon's default label "building solid".
2 changes: 1 addition & 1 deletion site/docs/components/button/accessibility.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ data:

### Best practices

- When a Button has both an icon and text, pass `aria-hidden=”true”` to the icon so that its text is not announced by screen readers.
- When a Button has both an icon and text, use`aria-hidden` on the icon so that screen readers do not announce its text.
- When a Button has an icon only and no text, pass an `aria-label` to Button that describes its purpose.

#### Focusable disabled button
Expand Down
6 changes: 3 additions & 3 deletions site/docs/components/checkbox/examples.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,7 @@ To configure checkbox groups to maintain a horizontal alignment but allow text w

When a checkbox option is neither selected nor deselected, it is indeterminate. This is a third, separate state.

A checkbox with the prop `indeterminate="true"` will display an indeterminate icon. The most common use is a nested checkbox group with a hierarchy of selections. When the group contains a mix of selected and unselected children, the parent will show an indeterminate state.
A checkbox with the prop `indeterminate={true}` will display an indeterminate icon. The most common use is a nested checkbox group with a hierarchy of selections. When the group contains a mix of selected and unselected children, the parent will show an indeterminate state.

</LivePreview>

Expand All @@ -75,7 +75,7 @@ A checkbox with the prop `indeterminate="true"` will display an indeterminate ic

A disabled checkbox is not interactive or focusable.

A checkbox can be disabled by setting `disabled=true`.
A checkbox can be disabled by setting `disabled={true}`.

Guidance:

Expand All @@ -91,7 +91,7 @@ If a disabled checkbox's text description contains information that is valuable

A read-only checkbox permits the user to only read or copy the text description, but not edit the text or change the state of the checkbox.

A checkbox with the prop `readOnly="true"` will suppress all functionality along with displaying read-only styling.
A checkbox with the prop `readOnly={true}` will suppress all functionality along with displaying read-only styling.

Guidance:

Expand Down
2 changes: 1 addition & 1 deletion site/docs/components/flex-layout/examples.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ By default, Flex Layout displays items along the horizontal axis in a row, align

#### Guidance

Set the `wrap` prop to `true` to overflow items onto subsequent rows when they no longer fit in the container.
Set `wrap={true}` to overflow items onto subsequent rows when they no longer fit in the container.

</LivePreview>

Expand Down
2 changes: 1 addition & 1 deletion site/docs/components/multiline-input/examples.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ When setting Multiline Input to a read-only state, ensure to also disable any ne

### Bordered

To style Multiline Input with a full border set the `bordered` prop to `true`.
To style Multiline Input with a full border set `bordered={true}`.

- We recommend this styling when the field uses the same fill color as the background (i.e., a primary fill color on a primary background).

Expand Down
4 changes: 2 additions & 2 deletions site/docs/components/radio-button/examples.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ You can configure radio button groups to maintain a horizontal alignment but all

A disabled radio button is not interactive or focusable.

A radio button can be disabled by setting `disabled=true`.
A radio button can be disabled by setting `disabled={true}`.

Guidance:

Expand All @@ -73,7 +73,7 @@ If a disabled radio button's text description contains information that is valua

A read-only radio button permits the user to only read or copy the value, but not edit the value or change the state of the radio.

A radio button with the prop `readOnly="true"` will suppress all functionality along with displaying read-only styling.
A radio button with the prop `readOnly={true}` will suppress all functionality along with displaying read-only styling.

Guidance:

Expand Down
2 changes: 1 addition & 1 deletion site/docs/components/toggle-button/examples.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ The basic toggle button component allows users to switch between two states.

Use icons and text in toggle buttons if it's important to visually reinforce the theme of the options. Or if providing additional context may help decision-making (for example, selecting a document type or a text style).

Pass `aria-hidden=true` to the icon so its text description is not announced by the screen reader.
Pass `aria-hidden={true}` to the icon so its text description is not announced by the screen reader.

Guidance:

Expand Down

1 comment on commit 8b20caa

@vercel
Copy link

@vercel vercel bot commented on 8b20caa Sep 5, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.