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

Adjust hero spacing on smaller screens #10379

Merged
merged 4 commits into from
Jul 4, 2023
Merged

Adjust hero spacing on smaller screens #10379

merged 4 commits into from
Jul 4, 2023

Conversation

minimalsm
Copy link
Contributor

Description

Was messing around with @nloureiro in GH grooming and we made some small improvements to the PageHero's spacing on smaller screens, further changes will improve it on the DS implementation but this is a nice quick win.

Related Issue

None

>
<Heading
as="h1"
textTransform="uppercase"
fontSize="md"
fontWeight="normal"
mt={{ base: "0px", lg: 8 }}
Copy link
Contributor Author

Choose a reason for hiding this comment

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

For some reason, base: 0 wasn't changing the base style at all here.

Copy link
Member

Choose a reason for hiding this comment

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

Hmm I just tested it on my local and it worked as expected with base: 0 🤔

Sometimes the dev server does not update the components/styles automatically and you need to do a full refresh of the page.

Do you want to change it back to base: 0 and test it in the preview deploy? to discard that this is an issue with your local.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Tried again local... same thing in all browsers 🤷‍♂️. Will update this PR and try in the preview deploy.

src/components/PageHero.tsx Outdated Show resolved Hide resolved
@gatsby-cloud
Copy link

gatsby-cloud bot commented Jun 5, 2023

✅ ethereum-org-website-dev deploy preview ready

@nloureiro
Copy link
Contributor

When we have images on top of the H1 should be some space.

Screen Shot 2023-06-06 04 57 02 PM
Screen Shot 2023-06-06 04 56 29 PM

@minimalsm
Copy link
Contributor Author

When we have images on top of the H1 should be some space.

@nloureiro fixed in this commit.

Basically:

  • if the image is on top, add top padding,
  • if the image is below, add bottom padding.

@nloureiro
Copy link
Contributor

All good on my side, approved :)

src/components/PageHero.tsx Outdated Show resolved Hide resolved
src/components/PageHero.tsx Outdated Show resolved Hide resolved
@corwintines corwintines merged commit c41ad2d into dev Jul 4, 2023
@corwintines corwintines deleted the fixHeroSpacing branch July 4, 2023 19:34
This was referenced Jul 5, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants