-
Notifications
You must be signed in to change notification settings - Fork 23
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Changed theme toggle to button
- Loading branch information
Showing
4 changed files
with
238 additions
and
101 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,30 @@ | ||
function dark() { | ||
// Get the dark mode switch element by its ID | ||
var isDarkModeEnabled, darkSwitch = document.getElementById("darkSwitch"); | ||
// Check if the dark mode switch exists in the DOM | ||
if (darkSwitch) { | ||
// Determine if dark mode was previously enabled by checking localStorage | ||
isDarkModeEnabled = localStorage.getItem("theme") === "dark"; | ||
// Set the checkbox state based on whether dark mode was previously enabled | ||
darkSwitch.checked = isDarkModeEnabled; | ||
// Apply or remove the "dark" theme based on the checkbox state | ||
if (isDarkModeEnabled) { | ||
document.body.setAttribute("data-theme", "dark"); | ||
} else { | ||
document.body.removeAttribute("data-theme"); | ||
} | ||
// Add an event listener to the switch for handling user changes | ||
darkSwitch.addEventListener("click", function () { | ||
if (document.body.getAttribute("data-theme") === "dark") { | ||
// If the switch is unchecked, disable dark mode | ||
document.body.removeAttribute("data-theme"); | ||
localStorage.removeItem("theme"); // Remove the preference from localStorage | ||
} else { | ||
// If the switch is checked, enable dark mode | ||
document.body.setAttribute("data-theme", "dark"); | ||
localStorage.setItem("theme", "dark"); // Save the preference in localStorage | ||
} | ||
}); | ||
} | ||
} | ||
dark(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.