nebel/_
1
0
Fork 0
mirror of https://github.com/kou029w/_.git synced 2025-01-31 06:18:07 +00:00
Code Issues Projects Releases Wiki Activity

コンポーネントとして切り出す

Browse source
This commit is contained in:
Nebel 2019-04-23 22:47:07 +09:00
parent 612fef6b90
commit 94ba725cca
1 changed files with 15 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
styles/MainTheme.tsx
View file

@ -43,17 +43,23 @@ export const components = {
) )
}; };
const useStyles = makeStyles({ export const Container: React.FC<{}> = ({ children }) => {
container: { const classes = makeStyles({
padding: [8, 3, 1].map(n => `${n * theme.spacing.unit}px`).join(" "), root: {
[theme.breakpoints.up("sm")]: { padding: [8, 3, 1].map(n => `${theme.spacing.unit * n}px`).join(" "),
padding: [9, 4, 1].map(n => `${n * theme.spacing.unit}px`).join(" ") [theme.breakpoints.up("sm")]: {
padding: [9, 4, 1].map(n => `${theme.spacing.unit * n}px`).join(" ")
}
} }
} })();
}); return (
<Grid className={classes.root} container>
{children}
</Grid>
);
};
const MainTheme: React.FC<{}> = ({ children }) => { const MainTheme: React.FC<{}> = ({ children }) => {
const classes = useStyles();
return ( return (
<ThemeProvider theme={theme}> <ThemeProvider theme={theme}>
<Head> <Head>
@ -71,9 +77,7 @@ const MainTheme: React.FC<{}> = ({ children }) => {
<MDXProvider components={components}> <MDXProvider components={components}>
<Typography component="div" variant="body1"> <Typography component="div" variant="body1">
<TopAppBar /> <TopAppBar />
<Grid className={classes.container} container> <Container>{children}</Container>
{children}
</Grid>
</Typography> </Typography>
</MDXProvider> </MDXProvider>
</ThemeProvider> </ThemeProvider>