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.

Sign up for GitHub

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

Jump to bottom

Adjust hero spacing on smaller screens #10379

Merged
merged 4 commits into from
Jul 4, 2023
Merged

Adjust hero spacing on smaller screens #10379

Changes from 3 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
0cdef63
Alter hero spacing on smaller screens
minimalsm Jun 5, 2023
4fb0f31
Update src/components/PageHero.tsx
minimalsm Jun 5, 2023
ce04239
Add padding based on isReverse prop (image on top or bottom) of hero …
minimalsm Jun 6, 2023
a3e675e
"0px" -> 0 base
minimalsm Jun 8, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 5 additions & 2 deletions src/components/PageHero.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,15 +56,17 @@ const PageHero: React.FC<IProps> = ({
>
<Box
maxW={{ base: "full", lg: "container.sm" }}
py={{ base: 16, lg: 32 }}
pt={{ base: isReverse ? 0 : 8, lg: 32 }}
pb={{ base: isReverse ? 8 : 0, lg: 32 }}
pl={{ base: 0, lg: 8 }}
mr={4}
mr={{ base: "0px", lg: 4 }}
minimalsm marked this conversation as resolved.
Show resolved Hide resolved
minimalsm marked this conversation as resolved.
Show resolved Hide resolved
>
<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.

minimalsm marked this conversation as resolved.
Show resolved Hide resolved
mb={4}
color="text300"
lineHeight={1.4}
Expand All @@ -77,6 +79,7 @@ const PageHero: React.FC<IProps> = ({
fontSize={{ base: "2.5rem", lg: "5xl" }}
maxW="full"
mb={0}
mt={{ base: 8, lg: 12 }}
color="text00"
lineHeight={1.4}
>
Expand Down