fix: tweak landing page buttons (#5661)

* Tweak landing details

* flex

Co-authored-by: Vignesh Mohankumar <me@vig.xyz>
This commit is contained in:
Callil Capuozzo 2022-12-12 13:45:28 -05:00 committed by GitHub
parent 3613dc2d4a
commit aa29ea80a9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -49,6 +49,9 @@ const Glow = styled.div`
` `
const ContentWrapper = styled.div<{ isDarkMode: boolean }>` const ContentWrapper = styled.div<{ isDarkMode: boolean }>`
display: flex;
flex-direction: column;
align-items: center;
width: 100%; width: 100%;
max-width: min(720px, 90%); max-width: min(720px, 90%);
position: absolute; position: absolute;
@ -113,7 +116,7 @@ const SubTextContainer = styled.div`
` `
const LandingButton = styled(BaseButton)` const LandingButton = styled(BaseButton)`
padding: 16px; padding: 16px 0px;
border-radius: 24px; border-radius: 24px;
` `
@ -142,15 +145,12 @@ const ButtonCTASecondary = styled(LandingButton)`
const ButtonCTAText = styled.p` const ButtonCTAText = styled.p`
margin: 0px; margin: 0px;
font-size: 16px; font-size: 16px;
font-weight: 600;
white-space: nowrap; white-space: nowrap;
@media screen and (min-width: ${BREAKPOINTS.sm}px) { @media screen and (min-width: ${BREAKPOINTS.sm}px) {
font-size: 20px; font-size: 20px;
} }
@media screen and (min-width: ${BREAKPOINTS.md}px) {
font-size: 24px;
}
` `
const ActionsWrapper = styled.span` const ActionsWrapper = styled.span`
@ -158,6 +158,7 @@ const ActionsWrapper = styled.span`
justify-content: center; justify-content: center;
gap: 12px; gap: 12px;
width: 100%; width: 100%;
max-width: 600px;
& > * { & > * {
max-width: 288px; max-width: 288px;