-
Notifications
You must be signed in to change notification settings - Fork 222
docs(overlay): a11y docs update #5409
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.
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
base: main
Are you sure you want to change the base?
Conversation
|
Branch previewReview the following VRT differencesWhen a visual regression test fails (or has previously failed while working on this branch), its results can be found in the following URLs:
If the changes are expected, update the |
Tachometer resultsCurrently, no packages are changed by this PR... |
d6f0e46
to
3cd6388
Compare
#### Placement | ||
|
||
When using the `placement` attribute of an `<overlay-trigger>` (`"top" |"top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "right" | "right-start" | "right-end" | "left" | "left-start" | "left-end"`), you can suggest to the overlay in which direction relative to the trigger that the content should display. When there is adequate room for the content to display in the specified direction, it will do so. When adequate room is not available, the overlaid content will calculate the direction in which it has the most room to be displayed and use that direction. | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Do we want sp-tabs
with examples of some of these placement options?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't see these yet.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We have examples of how to use the placement
attribute in the docs so I wonder if we need to show all examples of all possible values for that attributes in this case. Thought it might be too redundant. But I am open to have my thoughts changed here
ee09cc5
to
2faeeb2
Compare
2faeeb2
to
499d562
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
A few suggestions for heading cases and wording but otherwise this is a great update with lots of improvements in it.
499d562
to
2311a0e
Compare
@@ -17,7 +17,7 @@ | |||
</div> | |||
</div> | |||
|
|||
## Description | |||
## Overview |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I wonder if we should use the alert-banner
for our notices.
`; | ||
``` | ||
|
||
<div class="spectrum-InLineAlert spectrum-InLineAlert--notice"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I wonder if we should use the alert-banner
for our notices.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just a bit more feedback. Overall this is very impressive work and I appreciate the time you spent making this more understandable to both the consumers and the contributors.
2311a0e
to
e3e76b2
Compare
Description
Improving the accessibility documentation of components.
Related issue(s)
Motivation and context
Documentation should provide more information and examples that demonstrate how to use the components accessibly.
How has this been tested?
Review overlay docs
Do the docs examples give enough context to test for accessibility?
Do the docs examples and text provide information on how to use the component accessibly?
If the component is to be used in the context of another component, do the examples include how that component is used accessibly in that context?
Are the docs headings logical and consistent across these components? You can use the WAVE browser extension's Structure tab to review heading structure.
Did it pass in Desktop?
Did it pass in Mobile?
Did it pass in iPad?
Screenshots (if appropriate)
Types of changes
Checklist
Best practices
This repository uses conventional commit syntax for each commit message; note that the GitHub UI does not use this by default so be cautious when accepting suggested changes. Avoid the "Update branch" button on the pull request and opt instead for rebasing your branch against
main
.