-
-
Notifications
You must be signed in to change notification settings - Fork 32.5k
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
[joy-ui][docs] Add stray adjustments throughout the docs #41211
Conversation
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.
Looks good to me! Used this PR as an opportunity to add a tweak to the card playground demo too 😅
Same as in mui/material-ui#41211
- 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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
AccordionDetails
would go against the style conventions—it should either be "Accordion Details" or <AccordionDetails />
.
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.
+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-ratio
open-ended, given the previous information is already outdated.