reactjs - 反应 appbar 宽度未正确调整大小

Question

在我的反应项目中，我试图调整 appbar 的宽度。截至目前，它被推到最左边，如下图所示。

我尝试使用的自定义类没有做任何事情。没有错误消息，只是不工作。

有谁看到我做错了什么？

import AppBar from "@mui/material/AppBar";
import Toolbar from "@mui/material/Toolbar";

const drawerWidth = 200; //240

const useStyles = makeStyles((theme) => {
 return {
page: {
  background: "#f1f1f1",
  width: "100%",
  padding: useTheme().spacing(3),
},
drawer: {
  width: drawerWidth,
},
drawerPaper: {
  width: drawerWidth,
},
root: {
  display: "flex",
},
active: {
  background: "#f4f4f4",
},
appbar: {
  width: `calc(100% - ${drawerWidth}px)`,
},
// toolbar: theme.mixins.toolbar,
};
 });