45 lines
1.0 KiB
JavaScript
45 lines
1.0 KiB
JavaScript
import React from 'react';
|
||
import PropTypes from 'prop-types';
|
||
import styled from 'styled-components';
|
||
import remcalc from 'remcalc';
|
||
import { H1, P, Button, ViewContainer } from 'joyent-ui-toolkit';
|
||
|
||
const StyledContainer = styled.div`
|
||
/* trick prettier */
|
||
margin-top: ${remcalc(60)};
|
||
`;
|
||
|
||
const StyledTitle = styled(H1)`
|
||
font-weight: normal;
|
||
font-size: ${remcalc(32)};
|
||
`;
|
||
|
||
const StyledP = styled(P)`
|
||
margin-bottom: ${remcalc(30)};
|
||
max-width: ${remcalc(490)};
|
||
`;
|
||
|
||
const NotFound = ({
|
||
title = 'I have no memory of this place',
|
||
message = 'HTTP 404: We can’t find what you are looking for. Next time, always follow your nose.',
|
||
link = 'Back home',
|
||
to = '/'
|
||
}) => (
|
||
<ViewContainer>
|
||
<StyledContainer>
|
||
<StyledTitle>{title}</StyledTitle>
|
||
<StyledP>{message}</StyledP>
|
||
<Button to={to}>{link}</Button>
|
||
</StyledContainer>
|
||
</ViewContainer>
|
||
);
|
||
|
||
NotFound.propTypes = {
|
||
title: PropTypes.string,
|
||
message: PropTypes.string,
|
||
link: PropTypes.string,
|
||
to: PropTypes.string
|
||
};
|
||
|
||
export default NotFound;
|