如何在material ui抽屉演示中将<main>设为100%高度

import React from 'react';
import { makeStyles } from '@material-ui/core/styles';
import Drawer from '@material-ui/core/Drawer';
import Box from '@material-ui/core/Box';

const useStyles = makeStyles({
  root: {
    display: 'flex',
  },
  drawer: {
    width: 240,
    flexShrink: 0,
  },
  drawerPaper: {
    width: 240,
  },
  content: {
    flexGrow: 1,
    height: '100%', // 设置高度为100%
    backgroundColor: '#f5f5f5',
    padding: 16,
  },
});

const Layout = () => {
  const classes = useStyles();

  return (
    <div className={classes.root}>
      <Drawer
        className={classes.drawer}
        variant="persistent"
        anchor="left"
        classes={{
          paper: classes.drawerPaper,
        }}
      >
        {/* 抽屉的内容 */}
      </Drawer>
      <Box component="main" className={classes.content}>
        {/* 主要内容 */}
      </Box>
    </div>
  );
};

export default Layout;