privacyguides/privacytools.io
Archived
1
0
Fork 0
Code Issues 304 Pull Requests 47 Activity

Add dark theme

Browse Source 
Fixes #1151
This commit is contained in:
Dawid Potocki
2019-08-24 12:34:05 +12:00
parent 4684647d43
commit 12bb38c6db
5 changed files with 236 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
assets/js/main.js
View File

@ -27,6 +27,47 @@ function navSectionsClose(event) {
});
}
// Dark/Light color scheme switch button
document.querySelector("#nav-switch-theme").style.display = "inline"
if (localStorage.getItem("colorScheme") === "dark") {
document.querySelector("#dark-css").removeAttribute("media"); // Set dark theme
}
else if (localStorage.getItem("colorScheme") === "light") {
document.querySelector("#dark-css").setAttribute("media", "invalid"); // Set light theme
}
function changeColorScheme() {
// Use whatever users want
if (localStorage.getItem("colorScheme") === "dark") {
// Change to light theme
// by setting invalid media it will just not apply CSS for anyone
document.querySelector("#dark-css").setAttribute("media", "invalid");
localStorage.setItem("colorScheme", "light");
}
else if (localStorage.getItem("colorScheme") === "light") {
// Change to dark theme
// media was set to prefers-color-scheme: dark
document.querySelector("#dark-css").removeAttribute("media");
localStorage.setItem("colorScheme", "dark");;
}
// Just use whatever browsers want
else if (window.matchMedia("(prefers-color-scheme: dark)").matches === true) {
// Change to light Theme
document.querySelector("#dark-css").setAttribute("media", "invalid");
localStorage.setItem("colorScheme", "light");
}
else {
// Change to dark theme
document.querySelector("#dark-css").removeAttribute("media");
localStorage.setItem("colorScheme", "dark");;
}
}
// Matomo
var _paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */