2017-01-23 23:29:15 +00:00
|
|
|
import { createComponent } from 'react-fela'
|
|
|
|
import Page from '../layout'
|
|
|
|
|
2017-06-28 17:14:18 +00:00
|
|
|
const Container = createComponent(() => ({
|
|
|
|
maxWidth: 700,
|
|
|
|
marginLeft: 'auto',
|
|
|
|
marginRight: 'auto',
|
|
|
|
lineHeight: 1.5
|
|
|
|
}))
|
2017-01-23 23:29:15 +00:00
|
|
|
|
2017-06-28 17:14:18 +00:00
|
|
|
const Text = createComponent(({ size = 16 }) => ({
|
|
|
|
fontFamily:
|
|
|
|
'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',
|
|
|
|
fontSize: size,
|
|
|
|
color: '#333'
|
|
|
|
}))
|
2017-01-23 23:29:15 +00:00
|
|
|
|
2017-06-28 17:14:18 +00:00
|
|
|
const Title = createComponent(
|
|
|
|
({ size = 24 }) => ({
|
|
|
|
fontSize: size,
|
|
|
|
color: '#555'
|
|
|
|
}),
|
|
|
|
Text,
|
|
|
|
)
|
|
|
|
|
|
|
|
export default () =>
|
2017-01-23 23:29:15 +00:00
|
|
|
<Page>
|
2017-06-28 17:14:18 +00:00
|
|
|
<Container>
|
|
|
|
<Title size={50}>My Title</Title>
|
|
|
|
<Text>Hi, I am Fela.</Text>
|
|
|
|
</Container>
|
2017-01-23 23:29:15 +00:00
|
|
|
</Page>
|