Use Fork Awesome instead, JS-ify
This commit is contained in:
parent
2c874ccf1f
commit
35c8407a9e
70
index.html
70
index.html
|
@ -13,8 +13,8 @@
|
|||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic"
|
||||
crossorigin="anonymous" />
|
||||
<link rel="stylesheet" href="https://static.fwdekker.com/css/milligram-bundle.min.css" crossorigin="anonymous" />
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css"
|
||||
integrity="sha256-h20CPZ0QyXlBuAw7A+KluUYx/3pK+c7lYEpqLTlxjYQ=" crossorigin="anonymous" />
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fork-awesome/1.1.7/css/fork-awesome.min.css"
|
||||
integrity="sha256-gsmEoJAws/Kd3CjuOQzLie5Q3yshhvmo7YNtBG7aaEY=" crossorigin="anonymous" />
|
||||
|
||||
<!--suppress CssUnresolvedCustomProperty, CssUnusedSymbol -->
|
||||
<style>
|
||||
|
@ -82,6 +82,11 @@
|
|||
color: var(--error-color);
|
||||
}
|
||||
|
||||
#networkTable th a i {
|
||||
font-size: 0.9em;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
|
||||
/***
|
||||
* Loading icon
|
||||
|
@ -198,7 +203,7 @@
|
|||
<a href="https://git.fwdekker.com/FWDekker/interlanguage-checker/src/branch/master/LICENSE">MIT License</a>.
|
||||
Source code available on <a href="https://git.fwdekker.com/FWDekker/interlanguage-checker/">git</a>.
|
||||
|
||||
<div style="float: right;">v1.2.0</div>
|
||||
<div style="float: right;">v1.2.1</div>
|
||||
</section>
|
||||
</footer>
|
||||
</main>
|
||||
|
@ -550,19 +555,18 @@
|
|||
const editIconLink = document.createElement("a");
|
||||
editIconLink.href = url + "?action=edit";
|
||||
editIconLink.target = "_blank";
|
||||
const editIcon = document.createElement("i");
|
||||
editIcon.classList.add("fa", "fa-edit");
|
||||
editIconLink.appendChild(editIcon);
|
||||
new FontIcon("pencil").appendTo(editIconLink);
|
||||
span.appendChild(editIconLink);
|
||||
|
||||
span.appendChild(padding.cloneNode(true));
|
||||
|
||||
const copyIconLink = document.createElement("a");
|
||||
copyIconLink.href = "#";
|
||||
copyIconLink.addEventListener("click", () => navigator.clipboard.writeText(`[[${linkStr}]]`));
|
||||
const copyIcon = document.createElement("i");
|
||||
copyIcon.classList.add("fa", "fa-copy");
|
||||
copyIconLink.appendChild(copyIcon);
|
||||
const copyIcon = new FontIcon("clipboard").appendTo(copyIconLink);
|
||||
copyIconLink.addEventListener("click", () => {
|
||||
navigator.clipboard.writeText(`[[${linkStr}]]`);
|
||||
copyIcon.changeTo("check", 1000);
|
||||
});
|
||||
span.appendChild(copyIconLink);
|
||||
|
||||
return span;
|
||||
|
@ -849,6 +853,52 @@
|
|||
}
|
||||
|
||||
|
||||
/**
|
||||
* A font-based icon.
|
||||
*/
|
||||
class FontIcon {
|
||||
/**
|
||||
* Constructs a new `FontIcon`.
|
||||
*
|
||||
* @param name {string} the name of the icon
|
||||
*/
|
||||
constructor(name) {
|
||||
this._node = document.createElement("i");
|
||||
this._node.classList.add("fa", `fa-${name}`);
|
||||
|
||||
this._name = name;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Appends this icon to the given parent node.
|
||||
*
|
||||
* @param parent {HTMLElement} the node to append the icon to
|
||||
* @return {FontIcon} this `FontIcon`
|
||||
*/
|
||||
appendTo(parent) {
|
||||
parent.appendChild(this._node);
|
||||
return this;
|
||||
}
|
||||
|
||||
/**
|
||||
* Temporarily changes this icon to the given name.
|
||||
*
|
||||
* @param name {string} the temporary icon to display
|
||||
* @param time {number} the number of milliseconds to display the other icon
|
||||
*/
|
||||
changeTo(name, time) {
|
||||
this._node.classList.remove(`fa-${this._name}`);
|
||||
this._node.classList.add(`fa-${name}`);
|
||||
|
||||
setTimeout(() => {
|
||||
this._node.classList.remove(`fa-${name}`);
|
||||
this._node.classList.add(`fa-${this._name}`);
|
||||
}, time);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// noinspection JSUnresolvedFunction
|
||||
doAfterLoad(async () => {
|
||||
const urlInput = new ValidatableInput($("#url"), (value) => {
|
||||
|
|
Loading…
Reference in New Issue