import * as React from 'react';
import Grid from '@material-ui/core/Grid';
import Hidden from '@material-ui/core/Hidden';

interface StandardLayoutProps {
    children: React.ReactElement
}

export const StandardLayout: React.FC<StandardLayoutProps> = ({children}) => (
    <Grid container style={{marginTop: 16}}>
       <Grid item xs="auto" md={2}/>
        <Hidden mdUp>
            <div style={{marginRight: '2.08333333334%'}}/>
        </Hidden>
       <Grid item xs={true} md={8}>
           {children}
       </Grid>
        <Hidden>
            <div style={{marginLeft: '2.08333333334%'}}/>
        </Hidden>
    </Grid>
);