63 lines
1.3 KiB
JavaScript
63 lines
1.3 KiB
JavaScript
import paths from 'client/common/paths';
|
|
import { LogoText } from 'client/Elements/Text';
|
|
import colors from 'client/UIKit/colors';
|
|
import { Box, Flex } from 'client/UIKit/grid';
|
|
import React from 'react';
|
|
import { Route, Switch } from 'react-router-dom';
|
|
|
|
const Header = () => (
|
|
<Flex style={styles.header}>
|
|
{/* {paths.map(
|
|
(path, i) =>
|
|
path.route && (
|
|
<Link to={path.route}>
|
|
<MenuButton key={i}>{path.name}</MenuButton>
|
|
</Link>
|
|
)
|
|
)} */}
|
|
<LogoText>EVO Calculator</LogoText>
|
|
</Flex>
|
|
);
|
|
|
|
const Content = () => (
|
|
<Box style={styles.root}>
|
|
<Switch>
|
|
{paths.map((path, i) => (
|
|
<Route
|
|
key={i}
|
|
path={path.route}
|
|
exact={path.exact}
|
|
component={path.content}
|
|
/>
|
|
))}
|
|
</Switch>
|
|
</Box>
|
|
);
|
|
|
|
const Layout = () => (
|
|
<Flex flexDirection="column" style={styles.flex}>
|
|
<Header />
|
|
<Content />
|
|
</Flex>
|
|
);
|
|
|
|
const styles = {
|
|
root: {
|
|
height: '100%',
|
|
},
|
|
flex: { width: '100%' },
|
|
header: {
|
|
position: 'sticky',
|
|
top: 0,
|
|
// backgroundColor: colors.violet.shades[700],
|
|
background: 'linear-gradient(90deg, #1C01A9 0%, #3A0185 50%, #580161 100%)',
|
|
height: '65px',
|
|
padding: '10px 12px',
|
|
paddingLeft: '20px',
|
|
// borderRadius: "0 0 10px 10px",
|
|
zIndex: 999999,
|
|
},
|
|
};
|
|
|
|
export default Layout;
|