fix: theme

This commit is contained in:
AykutSarac 2024-05-06 22:53:17 +03:00
parent ff02445301
commit 7fa47e955a
No known key found for this signature in database
3 changed files with 14 additions and 11 deletions

View File

@ -52,7 +52,7 @@ function JsonCrack({ Component, pageProps }: AppProps) {
<Head>
<title>JSON Crack | Best JSON Visualizer, Formatter and Viewer for everyone</title>
</Head>
<MantineProvider theme={mantineTheme} defaultColorScheme="light">
<MantineProvider theme={mantineTheme}>
<ThemeProvider theme={lightTheme}>
<Toaster
position="bottom-right"

View File

@ -54,8 +54,8 @@ const EditorPage: React.FC = () => {
<title>Editor | JSON Crack</title>
<link rel="canonical" href="https://jsoncrack.com/editor" />
</Head>
<MantineProvider forceColorScheme={darkmodeEnabled ? "dark" : "light"}>
<ThemeProvider theme={darkmodeEnabled ? darkTheme : lightTheme}>
<ThemeProvider theme={darkmodeEnabled ? darkTheme : lightTheme}>
<MantineProvider forceColorScheme={darkmodeEnabled ? "dark" : "light"}>
<QueryClientProvider client={queryClient}>
<ExternalMode />
<ModalController />
@ -69,8 +69,8 @@ const EditorPage: React.FC = () => {
<BottomBar />
</StyledEditorWrapper>
</QueryClientProvider>
</ThemeProvider>
</MantineProvider>
</MantineProvider>
</ThemeProvider>
</>
);
};

View File

@ -13,7 +13,10 @@ import useGraph from "src/store/useGraph";
interface EmbedMessage {
data: {
json?: string;
options?: any;
options?: {
theme?: "light" | "dark";
direction?: "LEFT" | "RIGHT" | "DOWN" | "UP";
};
};
}
@ -46,7 +49,7 @@ const WidgetPage = () => {
}
setContents({ contents: event.data.json, hasChanges: false });
setDirection(event.data.options?.direction);
setDirection(event.data.options?.direction || "RIGHT");
} catch (error) {
console.error(error);
toast.error("Invalid JSON!");
@ -62,12 +65,12 @@ const WidgetPage = () => {
<Head>
<meta name="robots" content="noindex,nofollow" />
</Head>
<MantineProvider forceColorScheme={theme}>
<ThemeProvider theme={theme === "dark" ? darkTheme : lightTheme}>
<ThemeProvider theme={theme === "dark" ? darkTheme : lightTheme}>
<MantineProvider forceColorScheme={theme}>
<Toolbar isWidget />
<Graph isWidget />
</ThemeProvider>
</MantineProvider>
</MantineProvider>
</ThemeProvider>
</>
);
};