-
-
Notifications
You must be signed in to change notification settings - Fork 32.1k
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] Refresh the marketing example on the Color Inversion page #41497
Conversation
Netlify deploy previewhttps://deploy-preview-41497--material-ui.netlify.app/ Bundle size report |
4bf44c7
to
c978b8c
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.
Great changes all around! I took advantage of the PR to do some further refining here and there (and throughout other demos on the page, even though they're not fully fixed yet — the "Exceptions" demo is still a bit broken on mobile). In the marketing example specifically, though, there are still TypeScript errors, so we gotta tackle that! :)
aeaaff0
to
c884f44
Compare
Great work @danilo-leal, I have added the correct types and fixed all linting error. everything is passing now 👍 |
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.
🚀
…age (mui#41497) Co-authored-by: Danilo Leal <67129314+danilo-leal@users.noreply.github.com>
Preview: https://deploy-preview-41497--material-ui.netlify.app/joy-ui/main-features/color-inversion/#marketing-section
I made some changes to the last example to better showcase Joy UI color inversion. Here are the key features and enhancements:
1. Soft and Dark Palette:
I introduced a new mode with softer and darker tones.
2 . CSS Shapes:
Instead of using images, I designed shapes using CSS so that the shape's colors can dynamically adapt to the selected palette.
3. Enhanced Second Button:
Gentle mods.
4. Full Responsiveness:
The design is now fully responsive.