feat: add support for future spoiler tags
This commit is contained in:
parent
143131b413
commit
1fe65aed3b
|
@ -212,6 +212,20 @@ div.alert *:last-child {
|
|||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.spoiler {
|
||||
background: #1e1e1e;
|
||||
color: #1e1e1e;
|
||||
cursor: pointer;
|
||||
padding: 2px 10px;
|
||||
border-radius: 5px;
|
||||
margin: 10px 0;
|
||||
|
||||
&.spoiler-revealed {
|
||||
background: lighten(#333333, 12.5%);
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
|
||||
#blog-loading-spinner {
|
||||
margin: 20px;
|
||||
height: auto;
|
||||
|
|
17
src/ts/UI.ts
17
src/ts/UI.ts
|
@ -1,4 +1,4 @@
|
|||
import BlogPost from "./BlogPost";
|
||||
import BlogPost from "./BlogPost";
|
||||
import Author from "./Author";
|
||||
import TimeUtility from "./TimeUtility";
|
||||
|
||||
|
@ -71,6 +71,7 @@ class UI {
|
|||
UI.addLineNumbers(element);
|
||||
UI.addHighlighting(element);
|
||||
UI.addBootstrapTooltips(element);
|
||||
UI.renderSpoilers(element);
|
||||
UI.renderTeX(element);
|
||||
UI.renderTimestamps(element);
|
||||
}
|
||||
|
@ -120,6 +121,20 @@ class UI {
|
|||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders all spoilers in the document.
|
||||
* @param element The element to search for spoilers in.
|
||||
*/
|
||||
public static renderSpoilers(element?: Element) {
|
||||
element = element || document.body;
|
||||
const spoilers = element.querySelectorAll(".spoiler");
|
||||
spoilers.forEach((spoiler) => {
|
||||
spoiler.addEventListener("click", () => {
|
||||
spoiler.classList.add("spoiler-revealed");
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders all TeX in the document.
|
||||
* @param element The element to search for TeX in.
|
||||
|
|
Loading…
Reference in New Issue