Browse Source

better hero and how it woeksfk as

pull/1/head
remorses 1 year ago
parent
commit
5cb9f009bb
3 changed files with 8 additions and 8 deletions
  1. +4
    -4
      core/src/Hero.tsx
  2. +3
    -3
      core/src/HowItWorks.tsx
  3. +1
    -1
      demos/pages/index.tsx

+ 4
- 4
core/src/Hero.tsx View File

@ -44,8 +44,8 @@ export const Hero = ({
bg={bg}
style={{ opacity: backgroundImage ? bgOpacity : 1, height: '100%' }}
/>
<Row {...props}>
<Stack spacing={4} flex='1'>
<Row {...props} justify='center' align='flex-start'>
<Stack spacing={4} maxW='500px'>
<Heading fontSize='46px'>{heading}</Heading>
<SubHeading fontSize='22px'>{subhead}</SubHeading>
<Col align={['center', 'center', 'flex-start']}>
@ -54,8 +54,8 @@ export const Hero = ({
</Button>
</Col>
</Stack>
<Box flex='0.1' />
<Col flex='1'>{image}</Col>
<Box ml='40px' />
<Col maxW='500px'>{image}</Col>
</Row>
</Box>
)

+ 3
- 3
core/src/HowItWorks.tsx View File

@ -40,8 +40,8 @@ export const HowItWorks = ({
const Step = ({ heading, subhead, number, image, flip = false, ...rest }) => {
const dir = flip ? 'row-reverse' : 'row'
return (
<Row flexDir={dir} px='120px' align='center' {...rest}>
<Stack flex='1' spacing={6}>
<Row flexDir={dir} justify='center' align='center' {...rest}>
<Stack maxW='500px' flex='1' spacing={6}>
<Stack isInline align='flex-end' opacity={0.1}>
<Heading lineHeight='70px' fontSize='80px'>
{number}
@ -62,7 +62,7 @@ const Step = ({ heading, subhead, number, image, flip = false, ...rest }) => {
</Text>
</Stack>
<Box ml='40px'/>
<Col flex='1'>{image}</Col>
<Col maxW='500px' flex='1'>{image}</Col>
</Row>
)
}

+ 1
- 1
demos/pages/index.tsx View File

@ -18,7 +18,7 @@ const Page = () => (
heading='Make your website editable for the whole team'
subhead='Choose your technology. Use the API to fetch content. Empower
your content team.'
image={<img src='/code.png' />}
image={<img width='500px' src='/code.png' />}
cta='Test it out'
/>
<Feature

Loading…
Cancel
Save