[joy-ui][docs] Add stray adjustments throughout the docs#41211
[joy-ui][docs] Add stray adjustments throughout the docs#41211danilo-leal merged 14 commits intomui:masterfrom
Conversation
zanivan
left a comment
There was a problem hiding this comment.
Looks good to me! Used this PR as an opportunity to add a tweak to the card playground demo too 😅
| - You can browse the documentation, find an example close to your use case, and then open it in a live editor: | ||
| <a href="/joy-ui/react-button/#basics"> | ||
| <span class="only-light-mode"> | ||
| <img src="/static/docs-infra/forking-an-example.png" alt="Forking an example" loading="lazy" width="1548" height="606" style="display: block; max-width: 774px;"> |
There was a problem hiding this comment.
Cool change, but I think we should propagate those everwhere. Handled for Base UI, Material UI, MUI System, and MUI X.
There was a problem hiding this comment.
The new image is pretty cool, but it creates a layout shift when loading.
Screen.Recording.2024-02-28.at.18.07.38.mov
Fixed in 479c040. The trick is for width="1628" height="700" to match. Until we improve the image loading strategy to do this automatically, there is no way around it.
There was a problem hiding this comment.
It's always a bit tricky properly handling image size 😅 but thanks!
| - [Accordion Group](#basic-usage) - a container that groups multiple accordions. It **does not** control the state of each accordion. | ||
| - [Accordion](#basic-usage) - a component that contains the expansion logic and send to AccordionSummary and AccordionDetails. | ||
| - [Accordion Summary](#basic-usage) - a header of the accordion which contain a button that triggers the expansion. | ||
| - [Accordion Details](#basic-usage) - a wrapper for the accordion details. |
There was a problem hiding this comment.
Broken anchor link:
| - [Accordion Details](#basic-usage) - a wrapper for the accordion details. | |
| - [Accordion Details](#basic) - a wrapper for the accordion details. |
But personally, this would make even more sense, it's a React component:
| - [Accordion Details](#basic-usage) - a wrapper for the accordion details. | |
| - [`AccordionDetails`](#basic) - a wrapper for the accordion details. |
There was a problem hiding this comment.
There are other broken links like this throughout some of the Joy UI components that I'm aware of and plan to fix soon!
There was a problem hiding this comment.
AccordionDetails would go against the style conventions—it should either be "Accordion Details" or <AccordionDetails />.
There was a problem hiding this comment.
+1 for the latter to not leave any room possible for confusion, but yeah no strong preference. Just one user feedback.
Co-authored-by: zanivan <victorzanivan@gmail.com>
This PR adds some minor quality-of-life adjustments to the Joy UI docs, mostly things that felt like low-hanging from scrolling through the dedicated docs-feedback channel. Nothing crazy. I guess the only thing I'd call out is leaving the implementation of CSS's
aspect-ratioopen-ended, given the previous information is already outdated.