static-cms/website/src/components/home-section.js

37 lines
708 B
JavaScript

import React from 'react';
import styled from '@emotion/styled';
import Container from './container';
import Page from './page';
import theme from '../theme';
const Header = styled.header`
text-align: center;
padding-top: ${theme.space[7]};
padding-bottom: ${theme.space[7]};
`;
const Title = styled.h2`
font-size: ${theme.fontsize[6]};
`;
const Text = styled.div`
max-width: 710px;
margin: 0 auto;
`;
const HomeSection = ({ title, text, children, ...props }) => (
<Page as="section" {...props}>
<Container>
<Header>
<Title>{title}</Title>
{text && <Text>{text}</Text>}
</Header>
{children}
</Container>
</Page>
);
export default HomeSection;