mirror of
https://0xacab.org/anarsec/anarsec.guide.git
synced 2025-08-18 19:18:02 -04:00
Tails best, dark mode js, toc js, csp js
This commit is contained in:
parent
8cf6183410
commit
c2827a1522
7 changed files with 181 additions and 11 deletions
|
@ -1 +1,80 @@
|
|||
"use strict";
|
||||
|
||||
const menuBarHeight = document.querySelector("nav.navbar").clientHeight;
|
||||
const tocItems = document.querySelectorAll(".toc");
|
||||
const navSections = new Array(tocItems.length);
|
||||
|
||||
tocItems.forEach((el, i) => {
|
||||
let id = el.getAttribute("id").substring(5);
|
||||
navSections[i] = document.getElementById(id);
|
||||
})
|
||||
|
||||
function isVisible(tocIndex) {
|
||||
const current = navSections[tocIndex];
|
||||
const next = tocIndex < tocItems.length - 1 ? navSections[tocIndex + 1]
|
||||
: document.querySelectorAll("section.section").item(1);
|
||||
|
||||
const c = current.getBoundingClientRect();
|
||||
const n = next.getBoundingClientRect();
|
||||
const h = (window.innerHeight || document.documentElement.clientHeight);
|
||||
|
||||
return (c.top <= h) && (n.top - menuBarHeight >= 0);
|
||||
}
|
||||
|
||||
function activateIfVisible() {
|
||||
for (b = true, i = 0; i < tocItems.length; i++) {
|
||||
if (b && isVisible(i)) {
|
||||
tocItems[i].classList.add('is-active');
|
||||
b = false;
|
||||
} else
|
||||
tocItems[i].classList.remove('is-active');
|
||||
}
|
||||
}
|
||||
|
||||
var isTicking = null;
|
||||
window.addEventListener('scroll', () => {
|
||||
if (!isTicking) {
|
||||
window.requestAnimationFrame(() => {
|
||||
activateIfVisible();
|
||||
isTicking = false;
|
||||
});
|
||||
isTicking = true;
|
||||
}
|
||||
}, false);
|
||||
|
||||
function documentReadyCallback() {
|
||||
|
||||
if (localStorage.getItem("theme") === "dark") {
|
||||
document.body.setAttribute("theme", "dark");
|
||||
document.querySelectorAll("img, picture, video, pre").forEach(img => img.setAttribute("theme", "dark"));
|
||||
document.querySelectorAll(".vimeo, .youtube, .chart").forEach(video => video.setAttribute("theme", "dark"));
|
||||
document.getElementById("dark-mode").setAttribute("title", "Switch to light theme");
|
||||
}
|
||||
|
||||
document.getElementById("dark-mode").addEventListener("click", () => {
|
||||
if (
|
||||
localStorage.getItem("theme") == null ||
|
||||
localStorage.getItem("theme") == "light"
|
||||
) {
|
||||
localStorage.setItem("theme", "dark");
|
||||
document.body.setAttribute("theme", "dark");
|
||||
document.querySelectorAll("img, picture, video, pre").forEach(img => img.setAttribute("theme", "dark"));
|
||||
document.querySelectorAll(".vimeo, .youtube, .chart").forEach(video => video.setAttribute("theme", "dark"));
|
||||
|
||||
document.getElementById("dark-mode").setAttribute("title", "Switch to light theme");
|
||||
} else {
|
||||
localStorage.setItem("theme", "light");
|
||||
document.body.removeAttribute("theme", "dark");
|
||||
document.querySelectorAll("img, picture, video, pre").forEach(img => img.removeAttribute("theme", "dark"))
|
||||
document.querySelectorAll(".vimeo, .youtube, .chart").forEach(video => video.removeAttribute("theme", "dark"));
|
||||
|
||||
document.getElementById("dark-mode").setAttribute("title", "Switch to dark theme");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (document.readyState === 'loading') { // Loading hasn't finished yet
|
||||
document.addEventListener('DOMContentLoaded', documentReadyCallback);
|
||||
} else {
|
||||
documentReadyCallback();
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue