Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[docs] Improve doc for textField and buttons #20207

Merged
merged 4 commits into from
Mar 21, 2020
Merged

[docs] Improve doc for textField and buttons #20207

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
10d0371
[docs]:Improve doc for textField and buttons
DDDDDanica Mar 21, 2020
7312a9d
Update docs/src/pages/components/text-fields/text-fields.md
DDDDDanica Mar 21, 2020
ab2ab2a
Update docs/src/pages/components/buttons/buttons.md
oliviertassinari Mar 21, 2020
9a47f8a
Update docs/src/pages/components/buttons/buttons.md
oliviertassinari Mar 21, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion docs/src/pages/components/buttons/buttons.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -122,7 +122,7 @@ If you wish to use `not-allowed`, you have two options:

However:

- You should add `pointer-events: none;` back when you need to display [tooltips on disabled elements](/components/tooltips/#disabled-elements)
- You should add `pointer-events: none;` back when you need to display [tooltips on disabled elements](/components/tooltips/#disabled-elements).
- The cursor won't change if you render something other than a button element, for instance, a link `<a>` element.

2. **DOM change**. You can wrap the button:
Expand Down
8 changes: 4 additions & 4 deletions docs/src/pages/components/text-fields/text-fields.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ There are multiple ways to display an icon with a text field.
### Input Adornments

The main way is with an `InputAdornment`.
These can be used to add a prefix, a suffix or an action to an input.
This can be used to add a prefix, a suffix or an action to an input.
For instance, you can use an icon button to hide or reveal the password.

{{"demo": "pages/components/text-fields/InputAdornments.js"}}
Expand All @@ -67,7 +67,7 @@ Fancy smaller inputs? Use the `size` prop.

## Layout

`margin` can be used to alter the vertical spacing of inputs.
`margin` prop can be used to alter the vertical spacing of inputs.
Using `none` (default) will not apply margins to the `FormControl`, whereas `dense` and `normal` will.
`dense` and `normal` alter other styles to meet the specification.

Expand All @@ -77,7 +77,7 @@ Using `none` (default) will not apply margins to the `FormControl`, whereas `den

## Uncontrolled vs Controlled

The component can be controlled or uncontrolled
The component can be controlled or uncontrolled.

{{"demo": "pages/components/text-fields/StateTextFields.js"}}

Expand Down Expand Up @@ -192,7 +192,7 @@ function MyInputComponent(props) {

## Accessibility

In order for the text field to be accessible, **the input should be linked to the label and the helper text**. The underlying DOM nodes should have this structure.
In order for the text field to be accessible, **the input should be linked to the label and the helper text**. The underlying DOM nodes should have this structure:

```jsx
<div class="form-control">
Expand Down