docs(dialog): updated dialog docs for accessbility #5411
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... |
| @@ -164,7 +164,7 @@ async function main() { | |||
| // Configure the index fields | |||
| this.ref('metadata'); | |||
| // Boost title field for higher relevance when matching titles | |||
| this.field('title', { boost: 10 }); | |||
| this.field('title', { boost: 100 }); | |||
There was a problem hiding this comment.
Adding more to the dialog docs made dialog, dialog base, and dialog wrapper have higher result than base docs, so we boosted the value of a matching title.
There was a problem hiding this comment.
We use sp-popover instead of sp-dialog-base as the wrapper. Should we stay consistent with using the dialog component architecture that's available? Maybe we add an example with context about how and when to use sp-popover over sp-dialog-base? I think this is where a lot of confusion can happen. I'm always confused with our dialog lol.
Maybe we also can highlight the components required to use with sp-dialog for the desired functionality since it is a compositional component?
For all of the receives focus examples across all docs, the guidance is actually specific to sp-overlay. Should we make sure there is an example in that component and link to it from the dialog docs so we don't have to maintain it in multiple places?
|
|
||
| The dialog base supports different display modes: | ||
|
|
||
| ##### Fullscreen Mode |
There was a problem hiding this comment.
h5 font size is almost impossible to notice. Can we fix this in CSS orrrr remove the ## Overview heading, and then all subsequent headings go up a level? This markdown file is rendered under an Overview Tab when built so we repeat it twice. This would improve all experiences.
There was a problem hiding this comment.
This is exactly the same content as dialog-base. Are they two different components that we ship?
There was a problem hiding this comment.
https://opensource.adobe.com/spectrum-web-components/components/dialog-wrapper/
It looks like a complex component with a lot of functionality not shown in the example based on the API. Happy to help on this one if we need a list of examples
Description
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 dialog docs
Review dialog base docs
Review dialog wrapper docs
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.