Fix very minor layout issues

ShortestPathLab · May 19, 2024 · 130bbf0 · 130bbf0
1 parent e61eb6b
commit 130bbf0
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 17 deletions.
diff --git a/src/components/theme.ts b/src/components/theme.ts
@@ -174,7 +174,7 @@ export function usePaper(): (e?: number) => SxProps<Theme> {
     borderRadius: 4,
     backdropFilter: "blur(32px)",
     background: ({ palette }) =>
-      `url(img/noise.png), ${alpha(palette.background.paper, 0.8)}`,
+      `url(/img/noise.png), ${alpha(palette.background.paper, 0.8)}`,
     backgroundSize: "32px 32px",
   });
 }

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -144,11 +144,9 @@ function Content() {
 function ContentWithTheme() {
   const [mode] = useContext(ModeContext);
   return (
-    <ThemeProvider theme={themes[mode]}>
-      <CssBaseline>
-        <Content />
-      </CssBaseline>
-    </ThemeProvider>
+    <CssBaseline>
+      <Content />
+    </CssBaseline>
   );
 }
 

diff --git a/src/theme/Navbar/ColorModeToggle/index.js b/src/theme/Navbar/ColorModeToggle/index.js
@@ -1,3 +1,4 @@
+import BrowserOnly from "@docusaurus/BrowserOnly";
 import { useColorMode, useThemeConfig } from "@docusaurus/theme-common";
 import { DarkModeOutlined, LightModeOutlined } from "@mui/icons-material";
 import { Box, IconButton } from "@mui/material";
@@ -11,16 +12,20 @@ export default function NavbarColorModeToggle({ className }) {
     return null;
   }
   return (
-    <Box>
-      <IconButton
-        sx={{ color: "text.primary" }}
-        onClick={() => {
-          setColorMode(mode === "light" ? "dark" : "light");
-          setMode(mode === "light" ? "dark" : "light");
-        }}
-      >
-        {mode === "dark" ? <LightModeOutlined /> : <DarkModeOutlined />}
-      </IconButton>
-    </Box>
+    <BrowserOnly>
+      {() => (
+        <Box>
+          <IconButton
+            sx={{ color: "text.primary" }}
+            onClick={() => {
+              setColorMode(mode === "light" ? "dark" : "light");
+              setMode(mode === "light" ? "dark" : "light");
+            }}
+          >
+            {mode === "dark" ? <LightModeOutlined /> : <DarkModeOutlined />}
+          </IconButton>
+        </Box>
+      )}
+    </BrowserOnly>
   );
 }