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

Button: Revise documentation #66617

Merged
merged 12 commits into from
Dec 10, 2024
Merged

Button: Revise documentation #66617

Changes from 1 commit
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
d50f8a6
Button: Auto-generate README
mirka Oct 30, 2024
0711230
Add additional mdx file
mirka Oct 30, 2024
f3db348
Fixup to prevent merging consecutive lists
mirka Oct 31, 2024
ec69ef6
Add FigmaEmbed component
mirka Nov 14, 2024
41c4ad5
Update best-practices.mdx
auareyou Nov 14, 2024
4f9a5ac
Update best-practices.mdx
auareyou Nov 14, 2024
bb2b227
Update best-practices.mdx
auareyou Nov 14, 2024
fd025c7
Fixup
mirka Nov 15, 2024
172c49c
Fix iframe titles
mirka Nov 21, 2024
8db516e
Replace sizes section
mirka Nov 21, 2024
42d7cb9
Move variant description to story description?
mirka Nov 21, 2024
0850874
Move variant descriptions to main docs
mirka Dec 9, 2024
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
Prev Previous commit
Next Next commit
Fixup
  • Loading branch information
@mirka
mirka committed Nov 15, 2024
commit fd025c763521140d9376c338927e5fda39c19c0f
4 changes: 2 additions & 2 deletions packages/components/src/button/stories/best-practices.mdx
View file
Open in desktop
Copy link
Member Author

Choose a reason for hiding this comment

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

How about we write the supplementary docs in a file like this? I'm having second thoughts about putting all the documentation into the main Docs page, because it can already be quite long with the props table and the stories.

Copy link
Contributor

Choose a reason for hiding this comment

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

Chat notes:

  • Add TOC to Storybook generated DOCS page, linking to props and best practices
  • Add "Accessibility" section
  • Add a "Related components" section at the bottom
  • Add section on how to write component's documentation in the contributing guidelines
  • [optional] add linter to enforce some of the guidelines above

Original file line number Diff line number Diff line change
Expand Up @@ -54,12 +54,12 @@ The default size is 40px. Use smaller sizes for compact views or when placing bu
- Label buttons to show that a click or tap initiates an action.
- Use established color conventions; for example, reserve red buttons for irreversible or dangerous actions.
- Avoid crowding the screen with multiple calls to action, which confuses users.
- Keep button locations consistent across the interface
- Keep button locations consistent across the interface.

## Content guidelines

Buttons should be clear and predictable, showing users what will happen when clicked. Make labels reflect actions accurately to avoid confusion.

Start button text with a strong action verb and include a noun to specify the change, except for common actions like Save, Close, Cancel, or OK.

For other actions, use a {verb}+{noun} format for context. Keep button text brief and remove unnecessary words like "the," "an," or "a" for easy scanning.
For other actions, use a `{verb}+{noun}` format for context. Keep button text brief and remove unnecessary words like "the," "an," or "a" for easy scanning.
Loading