titor/drawDB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Save theme in local storage

Browse Source
This commit is contained in:
1ilit 2023-09-19 15:51:43 +03:00
parent f774699bfb
commit a51d5cf03d
3 changed files with 20 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/canvas.jsx
View File

@ -370,6 +370,8 @@ export default function Canvas(props) {
};
});
const theme = localStorage.getItem("theme");
return (
<div className="flex-grow h-full" id="canvas">
<div ref={canvas} className="w-full h-full">
@ -380,8 +382,7 @@ export default function Canvas(props) {
className="w-full h-full"
style={{
cursor: cursor,
backgroundColor:
settings.mode === "light" ? "white" : "rgba(22, 22, 26, 1)",
backgroundColor: theme === "dark" ? "rgba(22, 22, 26, 1)" : "white",
}}
>
{settings.showGrid && (

2
src/components/control_panel.jsx
View File

@ -921,6 +921,7 @@ export default function ControlPanel(props) {
if (body.hasAttribute("theme-mode")) {
body.setAttribute("theme-mode", "light");
}
localStorage.setItem("theme", "light");
setSettings((prev) => ({ ...prev, mode: "light" }));
},
},
@ -930,6 +931,7 @@ export default function ControlPanel(props) {
if (body.hasAttribute("theme-mode")) {
body.setAttribute("theme-mode", "dark");
}
localStorage.setItem("theme", "dark");
setSettings((prev) => ({ ...prev, mode: "dark" }));
},
},

15
src/pages/editor.jsx
View File

@ -490,6 +490,21 @@ export default function Editor(props) {
socket.on("user-connected", onUserConnected);
socket.on("user-disconnected", onUserDisconnected);
const theme = localStorage.getItem("theme");
if (theme === "dark") {
setSettings((prev) => ({ ...prev, mode: "dark" }));
const body = document.body;
if (body.hasAttribute("theme-mode")) {
body.setAttribute("theme-mode", "dark");
}
} else {
setSettings((prev) => ({ ...prev, mode: "light" }));
const body = document.body;
if (body.hasAttribute("theme-mode")) {
body.setAttribute("theme-mode", "light");
}
}
return () => {
socket.off("connect", onConnect);
socket.off("recieve-message", onRecieve);