Browse Source

Fix hero buttons to be clickable (#373)

main
Sophie Alpert 8 years ago
committed by GitHub
parent
commit
33cfa5f6b8
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
  1. 126
      src/pages/index.js

126
src/pages/index.js

@ -116,66 +116,72 @@ class Home extends Component {
}, },
}, },
}}> }}>
<Container> <div
<h1 css={{
css={{ // Content should be above absolutely-positioned hero image
color: colors.brand, position: 'relative',
textAlign: 'center', }}>
margin: 0, <Container>
fontSize: 45, <h1
letterSpacing: '0.01em', css={{
[media.size('xsmall')]: { color: colors.brand,
fontSize: 30, textAlign: 'center',
}, margin: 0,
[media.greaterThan('xlarge')]: { fontSize: 45,
fontSize: 60, letterSpacing: '0.01em',
}, [media.size('xsmall')]: {
}}> fontSize: 30,
React },
</h1> [media.greaterThan('xlarge')]: {
<p fontSize: 60,
css={{ },
paddingTop: 15, }}>
textAlign: 'center', React
fontSize: 24, </h1>
letterSpacing: '0.01em', <p
fontWeight: 200, css={{
paddingTop: 15,
[media.size('xsmall')]: { textAlign: 'center',
fontSize: 16, fontSize: 24,
maxWidth: '12em', letterSpacing: '0.01em',
marginLeft: 'auto', fontWeight: 200,
marginRight: 'auto',
}, [media.size('xsmall')]: {
fontSize: 16,
[media.greaterThan('xlarge')]: { maxWidth: '12em',
paddingTop: 20, marginLeft: 'auto',
fontSize: 30, marginRight: 'auto',
}, },
}}>
A JavaScript library for building user interfaces [media.greaterThan('xlarge')]: {
</p> paddingTop: 20,
<Flex fontSize: 30,
valign="center" },
css={{ }}>
paddingTop: 40, A JavaScript library for building user interfaces
</p>
[media.greaterThan('xlarge')]: { <Flex
paddingTop: 65, valign="center"
}, css={{
}}> paddingTop: 40,
<CtaItem>
<ButtonLink to="/docs/hello-world.html" type="primary"> [media.greaterThan('xlarge')]: {
Get Started paddingTop: 65,
</ButtonLink> },
</CtaItem> }}>
<CtaItem> <CtaItem>
<ButtonLink to="/tutorial/tutorial.html" type="secondary"> <ButtonLink to="/docs/hello-world.html" type="primary">
Take the Tutorial Get Started
</ButtonLink> </ButtonLink>
</CtaItem> </CtaItem>
</Flex> <CtaItem>
</Container> <ButtonLink to="/tutorial/tutorial.html" type="secondary">
Take the Tutorial
</ButtonLink>
</CtaItem>
</Flex>
</Container>
</div>
</div> </div>
</header> </header>

Loading…
Cancel
Save