Persistant Dark/Light mode.
This commit is contained in:
+14
-1
@@ -23,7 +23,7 @@ function App() {
|
|||||||
[tagsChecked, setTagsChecked] = useState(true),
|
[tagsChecked, setTagsChecked] = useState(true),
|
||||||
[sortBy, setSortBy] = useState('Default'),
|
[sortBy, setSortBy] = useState('Default'),
|
||||||
[loader, setLoader] = useState(false),
|
[loader, setLoader] = useState(false),
|
||||||
[lightMode, setLightMode] = useState(false);
|
[lightMode, setLightMode] = useState(localStorage.getItem('light-mode') === 'true');
|
||||||
|
|
||||||
function SetLoader(x) {
|
function SetLoader(x) {
|
||||||
setLoader(x)
|
setLoader(x)
|
||||||
@@ -82,13 +82,26 @@ function App() {
|
|||||||
setNumberOfResults(filteredData.length);
|
setNumberOfResults(filteredData.length);
|
||||||
}, [filteredData]);
|
}, [filteredData]);
|
||||||
|
|
||||||
|
// useEffect(() => {
|
||||||
|
// const isLight = localStorage.getItem("light-mode");
|
||||||
|
|
||||||
|
// if (JSON.parse(isLight)) {
|
||||||
|
// setLightMode(true);
|
||||||
|
// } else {
|
||||||
|
// setLightMode(false);
|
||||||
|
// }
|
||||||
|
// }, []);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (lightMode) {
|
if (lightMode) {
|
||||||
document.body.classList.add("light");
|
document.body.classList.add("light");
|
||||||
} else {
|
} else {
|
||||||
document.body.classList.remove("light");
|
document.body.classList.remove("light");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
localStorage.setItem('light-mode', lightMode);
|
||||||
}, [lightMode]);
|
}, [lightMode]);
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="App">
|
<div className="App">
|
||||||
|
|||||||
Reference in New Issue
Block a user