[website] Add Join Us block #24521
[website] Add Join Us block #24521
Conversation
oliviertassinari
added
the
website
| ); | ||
| } | ||
|
|
||
| function BrandingSupportUs() { |
| If you love the challenge of doing things differently, empowering creativity, and making | ||
| real connections along the way–then this may be the place for you. | ||
| </Typography> | ||
| <Button |
There was a problem hiding this comment.
Shouldn't the button look like this? Or maybe I am not up to date with the latest version.
There was a problem hiding this comment.
It's the only white button I could find in the whole design. I went on assuming that it was inconsistent and removed the variant. But not sure. It could also be an interesting customization exercise. Let's wait for Matt's point of view.
There was a problem hiding this comment.
The blue definitely looks better, and +1 for consistency.
The only feedback I have is how laggy the hover and click styles feel on the buttons.
There was a problem hiding this comment.
The only feedback I have is how laggy the hover and click styles feel on the buttons.
@mbrookes The transition is from the default Material Design styles. It's 250ms. Bootstrap has 150ms. Tailwind 200ms. Chakra 250ms, GitHub 200ms.
I have reduced the color gap, it helps.
Otherwise, we could consider theme.transitions.duration.shorter (200ms) instead of theme.transitions.duration.short (250ms) for button base, but it's a large change and I would advocate shouldn't be specific to our custom branding.
| @@ -208,14 +208,14 @@ theme = createMuiTheme(theme, { | |||
| boxShadow: `0 0 0 0.25rem ${alpha(theme.palette.greyD7, 0.5)}`, | |||
| }, | |||
| '&:hover': { | |||
| backgroundColor: darken(theme.palette.greyD7, 0.1), | |||
| backgroundColor: darken(theme.palette.greyD7, 0.07), | |||
There was a problem hiding this comment.
Well, if you don't feel the difference, then it's a false attempt. I still do hope that the new opacities look better.
Oh no actually GitHub do 100ms for the hover-in and 200m for the hover-out transitions. Interesting tradeoff, but maybe too hard to customize and feel "unbalanced".
There was a problem hiding this comment.
Well, if you don't feel the difference, then it's a false attempt.
I didn't compare them side by side, but before looking at the code I couldn't notice a difference. And since changing the opacity doesn't change the transition duration, I'm not surprised. 🙂
We can pick it up in a mop-up / final review when the page is done.
Review link https://deploy-preview-24521--material-ui.netlify.app/branding/about/