79e7370b39
The with-rebass example was using an outdate version of rebass(v1) which was throwing all sorts of deprecated warnings in the terminal, I've bumped up the version to the latest(v4) and made necessary changes to index.js page to keep it working. If there is any issue, or some additional work needed, I am absolutely open to help. Love the next.js framework and work you guys are doing ✌.
65 lines
1.4 KiB
JavaScript
65 lines
1.4 KiB
JavaScript
import { Heading, Text, Link, Flex, Box } from 'rebass'
|
|
|
|
function HomePage() {
|
|
return (
|
|
<Box
|
|
sx={{
|
|
maxWidth: 1100,
|
|
mx: 'auto',
|
|
px: 3,
|
|
textAlign: 'center',
|
|
}}
|
|
>
|
|
<Heading
|
|
as="h1"
|
|
children="Next.js + Rebass"
|
|
mb={3}
|
|
fontSize={[4, 5, 6]}
|
|
/>
|
|
|
|
<Box>
|
|
<Flex px={2} color="white" bg="black" alignItems="center">
|
|
<Link
|
|
p={2}
|
|
fontWeight="bold"
|
|
href="https://github.com/vercel/next.js/"
|
|
sx={{
|
|
fontWeight: '600',
|
|
color: 'white',
|
|
textDecoration: 'none',
|
|
}}
|
|
>
|
|
Next.js
|
|
</Link>
|
|
<Box mx="auto" />
|
|
<Link
|
|
variant="nav"
|
|
href="http://jxnblk.com/rebass/"
|
|
sx={{
|
|
fontWeight: '600',
|
|
color: 'white',
|
|
textDecoration: 'none',
|
|
}}
|
|
>
|
|
REBASS
|
|
</Link>
|
|
</Flex>
|
|
|
|
<Box>
|
|
<Text center fontSize={3} py={4}>
|
|
"Next.js is a minimalistic framework for server-rendered React
|
|
applications."
|
|
</Text>
|
|
</Box>
|
|
<Box>
|
|
<Text center fontSize={3} py={2}>
|
|
"Functional React UI component library, built with
|
|
styled-components"
|
|
</Text>
|
|
</Box>
|
|
</Box>
|
|
</Box>
|
|
)
|
|
}
|
|
|
|
export default HomePage
|