diff --git a/striker-ui/components/organisms/Header.tsx b/striker-ui/components/organisms/Header.tsx index 6efc1b44..4e32b8f3 100644 --- a/striker-ui/components/organisms/Header.tsx +++ b/striker-ui/components/organisms/Header.tsx @@ -1,9 +1,8 @@ -import { FunctionComponent } from 'react'; import AppBar from '@material-ui/core/AppBar'; import { makeStyles, createStyles } from '@material-ui/core/styles'; +import { Grid } from '@material-ui/core'; import Image from 'next/image'; - -// import DEFAULT_THEME from '../../lib/consts/DEFAULT_THEME'; +import { ICONS, ICON_SIZE } from '../../lib/consts/ICONS'; const useStyles = makeStyles((theme) => createStyles({ @@ -11,18 +10,40 @@ const useStyles = makeStyles((theme) => paddingTop: theme.spacing(0.5), paddingBottom: theme.spacing(0.5), paddingLeft: theme.spacing(3), - paddingRight: theme.spacing(0.5), + paddingRight: theme.spacing(3), + }, + input: { + height: '40px', + width: '500px', + backgroundColor: theme.palette.secondary.main, + borderRadius: '3px', }, }), ); -const Header: FunctionComponent = () => { +const Header = (): JSX.Element => { const classes = useStyles(); return ( -
- -
+ + + + + + + + + {ICONS.map( + (icon): JSX.Element => ( + + ), + )} + +
); }; diff --git a/striker-ui/lib/consts/ICONS.ts b/striker-ui/lib/consts/ICONS.ts new file mode 100644 index 00000000..ac6da859 --- /dev/null +++ b/striker-ui/lib/consts/ICONS.ts @@ -0,0 +1,15 @@ +export const ICONS = [ + '/pngs/files_on.png', + '/pngs/tasks_no-jobs_icon.png', + '/pngs/configure_icon_on.png', + '/pngs/striker_icon_on.png', + '/pngs/anvil_icon_on.png', + '/pngs/email_on.png', + '/pngs/users_icon_on.png', + '/pngs/help_icon_on.png', +]; + +export const ICON_SIZE = { + width: 40, + height: 40, +};