barrett/barrettruth.com
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(post): fold h2s as well

Browse source
This commit is contained in:
Barrett Ruth 2024-07-03 11:57:38 -05:00
parent 155b34e286
commit 1d3083a39d
2 changed files with 554 additions and 478 deletions
Download patch file Download diff file Expand all files Collapse all files

57
scripts/post.js
View file

@ -3,6 +3,38 @@ document.documentElement.style.setProperty(
getTopicColor(urlToTopic()),
);
const tagToHeader = new Map([
["H2", "#"],
["H3", "##"],
]);
const makeFold = (h, i) => {
const toggle = document.createElement("span");
toggle.style.fontStyle = "normal";
toggle.textContent = "v";
// only unfold first algorithm problem
if (urlToTopic() === "algorithms" && i === 0) toggle.textContent = "v";
h.parentElement.nextElementSibling.style.display =
toggle.textContent === ">" ? "none" : "block";
h.parentE;
toggle.classList.add("fold-toggle");
toggle.addEventListener("click", () => {
const content = h.parentElement.nextElementSibling;
toggle.textContent = toggle.textContent === ">" ? "v" : ">";
content.style.display = toggle.textContent === ">" ? "none" : "block";
});
const mdHeading = document.createElement("span");
const header = tagToHeader.has(h.tagName) ? tagToHeader.get(h.tagName) : "";
mdHeading.textContent = `${header} `;
mdHeading.style.color = getTopicColor(urlToTopic());
h.prepend(mdHeading);
h.prepend(toggle);
};
document.addEventListener("DOMContentLoaded", () => {
document.querySelectorAll("article h2").forEach((h2) => {
const mdHeading = document.createElement("span");
@ -11,27 +43,6 @@ document.addEventListener("DOMContentLoaded", () => {
h2.prepend(mdHeading);
});
document.querySelectorAll(".fold h3").forEach((h3, i) => {
const toggle = document.createElement("span");
toggle.textContent = "v";
// only unfold first algorithm problem
if (urlToTopic() === "algorithms" && i === 0) toggle.textContent = "v";
h3.parentElement.nextElementSibling.style.display =
toggle.textContent === ">" ? "none" : "block";
toggle.classList.add("fold-toggle");
toggle.addEventListener("click", () => {
const content = h3.parentElement.nextElementSibling;
toggle.textContent = toggle.textContent === ">" ? "v" : ">";
content.style.display = toggle.textContent === ">" ? "none" : "block";
});
const mdHeading = document.createElement("span");
mdHeading.textContent = "## ";
mdHeading.style.color = getTopicColor(urlToTopic());
h3.prepend(mdHeading);
h3.prepend(toggle);
});
document.querySelectorAll(".fold h2").forEach(makeFold);
document.querySelectorAll(".fold h3").forEach(makeFold);
});