[docs] Revise Joy UI "Typography" page #35868
Conversation
Getting started with reviewing the Typography paged. I reviewed the page to (hopefully) be more consistent with the style guide. I tried to rework the structure so it looks more like the one you had intended, but I could use some guidance on if I'm on the right track or not. I'm curious if you would think adding an example under the 'basics' part of the page could be beneficial versus the code example currently there. @samuelsycamore Signed-off-by: Sarah <98355961+LadyBluenotes@users.noreply.github.com>
|
There was a problem hiding this comment.
Thank you so much for tackling this @LadyBluenotes !! This is definitely an improvement over the earlier version. I've left some comments throughout to suggest ways to further improve it in the next draft—and hopefully they'll help clarify some of our house style rules if you decide to do more of these revisions (and I hope you will)!
Additionally: this doc is currently missing a section called "Anatomy" that I've been adding to all of our component docs. This section details what the component actually renders out to in the DOM, including all HTML tags and classes denoting the component's slots. You can get this info by inspecting the component in your browser dev tools and copying+pasting the code from there. It may include some redundant/noisy CSS classes that you shouldn't apply styles to anyway, so check the other component docs I've revised to see which ones I include as relevant.
samuelsycamore
added
docs
|
Here's some MUI-specific stuff you'll need to know to get those pesky tests to pass:
|
|
One more thing: if/when you create a new demo for the Basics section, you'll want to start with a Once you're happy with that demo, you'll need to run |
There was a problem hiding this comment.
Still waiting on some clarification on the levels / semantic levels part but I've made some of the changes that were talked about!
I used some of the other finished docs to base the anatomy section off of.
If there's anything else you see that I've missed, please let me know!
There was a problem hiding this comment.
Nice work on the next draft @LadyBluenotes! I think we're getting close. Left some more comments throughout. Don't forget to run yarn prettier and yarn markdownlint!
|
@LadyBluenotes feel free to request a review from me if/when you're ready! |
|
Great job @LadyBluenotes! I went ahead and pushed some commits to your branch here, so be sure to |
There was a problem hiding this comment.
I am tentatively approving this to be merged 👍 but let's wait for a final review from @siriwatknp or @danilo-leal to confirm that everything is still technically accurate and that we're not missing any key details.
There was a problem hiding this comment.
Left just a tiny note there but aside from that, it looks fantastic!
Thanks, @LadyBluenotes for helping us out with it!
There was a problem hiding this comment.
👍 Huge improvement! Great job @LadyBluenotes 👏. Looking forward to the next one.
Signed-off-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
|
Thanks again @LadyBluenotes!! Great job! |
#33998
Getting started with reviewing the Typography page.
I reviewed the page to (hopefully) be more consistent with the style guide.
I tried to rework the structure so it looks more like the one you had intended, but I could use some guidance on if I'm on the right track or not.
I'm curious if you would think adding an example under the 'basics' part of the page could be beneficial versus the code example currently there.
@samuelsycamore
Signed-off-by: Sarah 98355961+LadyBluenotes@users.noreply.github.com
https://deploy-preview-35868--material-ui.netlify.app/joy-ui/react-typography/