diff --git a/src/ts/UI.ts b/src/ts/UI.ts index 707f480..0635596 100644 --- a/src/ts/UI.ts +++ b/src/ts/UI.ts @@ -1,4 +1,5 @@ -declare const katex: any; +declare const bootstrap: any; +declare const katex: any; class UI { public static get blogPostContainer(): HTMLDivElement { @@ -14,10 +15,25 @@ class UI { */ public static updateUI() { UI.addLineNumbers(); + UI.addBootstrapTooltips(); UI.renderTeX(); UI.unescapeMarkTags(); } + /** + * Adds Bootstrap tooltips to all elements with a title attribute. + */ + public static addBootstrapTooltips() { + document.querySelectorAll("[title]").forEach((el) => { + el.setAttribute("data-bs-toggle", "tooltip"); + el.setAttribute("data-bs-placement", "bottom"); + el.setAttribute("data-bs-html", "true"); + el.setAttribute("data-bs-title", el.getAttribute("title")); + + new bootstrap.Tooltip(el); + }); + } + /** * Adds line numbers to all
blocks that have more than one line.
*/
diff --git a/src/ts/app.ts b/src/ts/app.ts
index c39bdc4..b6fb676 100644
--- a/src/ts/app.ts
+++ b/src/ts/app.ts
@@ -2,7 +2,6 @@ import API from "./API";
import TimeUtility from "./TimeUtility";
import UI from "./UI";
-declare const bootstrap: any;
declare const Handlebars: any;
(() => {
@@ -103,14 +102,4 @@ declare const Handlebars: any;
break;
}
});
-
- document.querySelectorAll("[title]").forEach((el) => {
- el.setAttribute("data-bs-toggle", "tooltip");
- el.setAttribute("data-bs-placement", "bottom");
- el.setAttribute("data-bs-html", "true");
- el.setAttribute("data-bs-title", el.getAttribute("title"));
- });
-
- const list = document.querySelectorAll('[data-bs-toggle="tooltip"]');
- list.forEach((el: Element) => new bootstrap.Tooltip(el));
})();