Skip to content
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

[website] Refine button design and other details #41686

Merged
merged 13 commits into from
Mar 27, 2024

Conversation

danilo-leal
Copy link
Contributor

@danilo-leal danilo-leal commented Mar 27, 2024

This PR mostly adds general adjustments to the branding theme's button box-shadow styles. Aside from that, I'm also including some stray improvements in other components (like, color, spacing, etc.).

https://deploy-preview-41686--material-ui.netlify.app/experiments/website/branding-theme-test/

@danilo-leal danilo-leal added design This is about UI or UX design, please involve a designer website Pages that are not documentation-related, marketing-focused. labels Mar 27, 2024
@danilo-leal danilo-leal self-assigned this Mar 27, 2024
@mui-bot
Copy link

mui-bot commented Mar 27, 2024

Netlify deploy preview

https://deploy-preview-41686--material-ui.netlify.app/

Bundle size report

No bundle size changes (Toolpad)
No bundle size changes

Generated by 🚫 dangerJS against f9febe0

Copy link
Contributor

@zanivan zanivan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great improvement! Navigation feels way more consistent.


I'd make these gradients a bit subtler, making it to bottom right instead. I think this way the colored side is up, where the icon is. This brings me to the idea that the Icon is emanating the color :) (left the CSS just for reference)

Screenshot 2024-03-27 at 15 38 34
backgroundImage: linear-gradient(to bottom right, rgba(235, 245, 255, 0.5) 10%, rgba(243, 246, 249, 0.2) 100%)
Screenshot 2024-03-27 at 15 38 57
backgroundImage: linear-gradient(to bottom right, rgba(0, 58, 117, 0.1) 10%, rgba(20, 26, 31, 0.2) 100%) rgb(16, 20, 24)

docs/src/modules/components/DiamondSponsors.js Outdated Show resolved Hide resolved
Copy link
Contributor

@zanivan zanivan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Left a comment, but other than that, LGTM 🚀

docs/pages/careers.tsx Outdated Show resolved Hide resolved
@danilo-leal danilo-leal merged commit 6e36046 into mui:next Mar 27, 2024
22 checks passed
@danilo-leal danilo-leal deleted the stray-design-touches branch March 27, 2024 23:11
mnajdova pushed a commit to mnajdova/material-ui that referenced this pull request Mar 29, 2024
tejasparkar pushed a commit to tejasparkar/material-ui that referenced this pull request Mar 30, 2024
DiegoAndai pushed a commit to DiegoAndai/material-ui that referenced this pull request Apr 16, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
design This is about UI or UX design, please involve a designer website Pages that are not documentation-related, marketing-focused.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants