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

Add dark theme (#1204)

Browse Source 
Fixes #1151
This commit was merged in pull request #1204.
This commit is contained in:
Dawid Potocki
2019-08-29 20:03:04 +00:00
committed by GitHub
parent 09e1d85933
commit f09d6c3165
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" */