oliverbooth/oliverbooth.dev
oliverbooth
/
oliverbooth.dev
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Activity

refactor: render bootstrap tooltips from UI class

This commit is contained in:
Oliver Booth 2023-08-10 15:30:49 +01:00
parent 28f310e315
commit 94a1ee00e1
Signed by: oliverbooth
GPG Key ID: 725DB725A0D9EE61
2 changed files with 17 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/ts/UI.ts
View File

@ -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 <pre> <code> blocks that have more than one line.
*/

11
src/ts/app.ts
View File

@ -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));
})();