/
index.js
57 lines (52 loc) · 1.4 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
import React from 'react'
import { withTheme } from 'emotion-theming'
import {
Link as ChakraLink,
Text,
Code,
Icon,
List,
ListIcon,
ListItem,
} from '@chakra-ui/core'
import { Hero } from '../components/Hero'
import { Container } from '../components/Container'
import { Main } from '../components/Main'
import { DarkModeSwitch } from '../components/DarkModeSwitch'
import { CTA } from '../components/CTA'
import { Footer } from '../components/Footer'
const Index = () => (
<Container>
<Hero />
<Main>
<Text>
Example repository of <Code>Next.js</Code> + <Code>chakra-ui</Code>.
</Text>
<List spacing={3} my={0}>
<ListItem>
<ListIcon icon="check-circle" color="green.500" />
<ChakraLink
isExternal
href="https://chakra-ui.com"
flexGrow={1}
mr={2}
>
Chakra UI <Icon name="external-link" mx="2px" />
</ChakraLink>
</ListItem>
<ListItem>
<ListIcon icon="check-circle" color="green.500" />
<ChakraLink isExternal href="https://nextjs.org" flexGrow={1} mr={2}>
Next.js <Icon name="external-link" mx="2px" />
</ChakraLink>
</ListItem>
</List>
</Main>
<DarkModeSwitch />
<Footer>
<Text>Next ❤️ Chakra</Text>
</Footer>
<CTA />
</Container>
)
export default withTheme(Index)