Replace legacy icons in JS files

diff --git a/ts/WoltLabSuite/Core/Acp/Ui/Devtools/Notification/Test.ts b/ts/WoltLabSuite/Core/Acp/Ui/Devtools/Notification/Test.ts
index 72b2cf6bf32fa91f9125d8660169ce6763e6e1e1..87a969298bb4d113f69d609b27641deafde8890c 100644 (file)
--- a/ts/WoltLabSuite/Core/Acp/Ui/Devtools/Notification/Test.ts
+++ b/ts/WoltLabSuite/Core/Acp/Ui/Devtools/Notification/Test.ts
@@ -123,7 +123,7 @@ class AcpUiDevtoolsNotificationTest implements AjaxCallbackObject, DialogCallbac
   private test(event: MouseEvent): void {
     const button = event.currentTarget as HTMLButtonElement;
 
-    button.innerHTML = '<span class="icon icon16 fa-spinner"></span>';
+    button.innerHTML = '<fa-icon size="16" name="spinner" solid></fa-icon>';
 
     this.buttons.forEach((button) => (button.disabled = true));
 

diff --git a/ts/WoltLabSuite/Core/Acp/Ui/Devtools/Project/Sync.ts b/ts/WoltLabSuite/Core/Acp/Ui/Devtools/Project/Sync.ts
index 667d207b8830a305ba1d8bf6bc08ada614d36e45..30728961cf8e39606483c386c32e21d96f6a03a5 100644 (file)
--- a/ts/WoltLabSuite/Core/Acp/Ui/Devtools/Project/Sync.ts
+++ b/ts/WoltLabSuite/Core/Acp/Ui/Devtools/Project/Sync.ts
@@ -141,7 +141,7 @@ class AcpUiDevtoolsProjectSync {
     }
 
     const syncAll = document.createElement("li");
-    syncAll.innerHTML = `<a href="#" class="button"><span class="icon icon16 fa-refresh"></span> ${Language.get(
+    syncAll.innerHTML = `<a href="#" class="button"><fa-icon size="16" name="arrows-rotate" solid></fa-icon> ${Language.get(
       "wcf.acp.devtools.sync.syncAll",
     )}</a>`;
     this.buttonSyncAll = syncAll.children[0] as HTMLAnchorElement;
@@ -154,7 +154,7 @@ class AcpUiDevtoolsProjectSync {
   private sync(pluginName: string, target: string): void {
     const identifier = this.getButtonIdentifier(pluginName, target);
     this.buttons.get(identifier)!.disabled = true;
-    this.buttonStatus.get(identifier)!.innerHTML = '<span class="icon icon16 fa-spinner"></span>';
+    this.buttonStatus.get(identifier)!.innerHTML = '<fa-icon size="16" name="spinner" solid></fa-icon>';
 
     Ajax.api(this, {
       parameters: {

diff --git a/ts/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.ts b/ts/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.ts
index 8c1bc4ae5f5bc92f9a6ec574d0e562e974cb0412..9031e3861c07f3177efe18402efde9262288dadb 100644 (file)
--- a/ts/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.ts
+++ b/ts/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.ts
@@ -75,7 +75,7 @@ class EmailSmtpTest implements AjaxCallbackObject {
     event.preventDefault();
 
     this.buttonRunTest.classList.add("disabled");
-    this.buttonRunTest.innerHTML = `<span class="icon icon16 fa-spinner"></span> ${Language.get("wcf.global.loading")}`;
+    this.buttonRunTest.innerHTML = `<fa-icon size="16" name="spinner" solid></fa-icon> ${Language.get("wcf.global.loading")}`;
 
     DomUtil.innerError(this.buttonRunTest, false);
 

diff --git a/ts/WoltLabSuite/Core/Date/Picker.ts b/ts/WoltLabSuite/Core/Date/Picker.ts
index fbe365626f630784dabbdb75166f928b8829935b..badf4afff656d190f5e3d8c18347dbdfdfad0eb7 100644 (file)
--- a/ts/WoltLabSuite/Core/Date/Picker.ts
+++ b/ts/WoltLabSuite/Core/Date/Picker.ts
@@ -58,7 +58,7 @@ function createPicker() {
   _dateMonthPrevious.className = "previous jsTooltip";
   _dateMonthPrevious.title = Language.get("wcf.date.datePicker.previousMonth");
   _dateMonthPrevious.setAttribute("aria-label", Language.get("wcf.date.datePicker.previousMonth"));
-  _dateMonthPrevious.innerHTML = '<span class="icon icon16 fa-arrow-left"></span>';
+  _dateMonthPrevious.innerHTML = '<fa-icon size="16" name="arrow-left" solid></fa-icon>';
   _dateMonthPrevious.addEventListener("click", () => DatePicker.previousMonth());
   header.appendChild(_dateMonthPrevious);
 
@@ -90,7 +90,7 @@ function createPicker() {
   _dateMonthNext.className = "next jsTooltip";
   _dateMonthNext.title = Language.get("wcf.date.datePicker.nextMonth");
   _dateMonthNext.setAttribute("aria-label", Language.get("wcf.date.datePicker.nextMonth"));
-  _dateMonthNext.innerHTML = '<span class="icon icon16 fa-arrow-right"></span>';
+  _dateMonthNext.innerHTML = '<fa-icon size="16" name="arrow-right" solid></fa-icon>';
   _dateMonthNext.addEventListener("click", () => DatePicker.nextMonth());
   header.appendChild(_dateMonthNext);
 

diff --git a/ts/WoltLabSuite/Core/Ui/Article/Search.ts b/ts/WoltLabSuite/Core/Ui/Article/Search.ts
index a89d87f2c9371edf4c1e7430978b31143985416a..4a4e914a6845ec0ffe2bbe6731f4447d24dc029d 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/Article/Search.ts
+++ b/ts/WoltLabSuite/Core/Ui/Article/Search.ts
@@ -133,7 +133,7 @@ class UiArticleSearch implements AjaxCallbackObject, DialogCallbackObject {
             <dd>
               <div class="inputAddon">
                 <input type="text" id="wcfUiArticleSearchInput" class="long">
-                <a href="#" class="inputSuffix"><span class="icon icon16 fa-search"></span></a>
+                <a href="#" class="inputSuffix"><fa-icon size="16" name="search" solid></fa-icon></a>
               </div>
             </dd>
           </dl>

diff --git a/ts/WoltLabSuite/Core/Ui/Comment/Add.ts b/ts/WoltLabSuite/Core/Ui/Comment/Add.ts
index 3018446c0f8bfe9fb52075c396e1fd86d4a0aa2b..ec60bd0a438fdc21b7e4a8670afeb00172113a27 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/Comment/Add.ts
+++ b/ts/WoltLabSuite/Core/Ui/Comment/Add.ts
@@ -206,7 +206,7 @@ class UiCommentAdd {
     if (this._loadingOverlay === null) {
       this._loadingOverlay = document.createElement("div");
       this._loadingOverlay.className = "commentLoadingOverlay";
-      this._loadingOverlay.innerHTML = '<span class="icon icon96 fa-spinner"></span>';
+      this._loadingOverlay.innerHTML = '<fa-icon size="96" name="spinner" solid></fa-icon>';
     }
 
     this._content.classList.add("loading");

diff --git a/ts/WoltLabSuite/Core/Ui/Comment/Edit.ts b/ts/WoltLabSuite/Core/Ui/Comment/Edit.ts
index c4ec8d063822c2739abe96c9b721c95da4220260..e1e9c552139b187263f0099092171ddaadeb145a 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/Comment/Edit.ts
+++ b/ts/WoltLabSuite/Core/Ui/Comment/Edit.ts
@@ -93,7 +93,7 @@ class UiCommentEdit {
   protected _prepare(): void {
     this._editorContainer = document.createElement("div");
     this._editorContainer.className = "commentEditorContainer";
-    this._editorContainer.innerHTML = '<span class="icon icon48 fa-spinner"></span>';
+    this._editorContainer.innerHTML = '<fa-icon size="48" name="spinner" solid></fa-icon>';
 
     const content = this._activeElement!.querySelector(".commentContentContainer")!;
     content.insertBefore(this._editorContainer, content.firstChild);

diff --git a/ts/WoltLabSuite/Core/Ui/Comment/Response/Edit.ts b/ts/WoltLabSuite/Core/Ui/Comment/Response/Edit.ts
index cc18eefeeecfa182f96694b49397b95442af35af..c711925066f82cd345abbec58391ed842597e6e9 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/Comment/Response/Edit.ts
+++ b/ts/WoltLabSuite/Core/Ui/Comment/Response/Edit.ts
@@ -96,7 +96,7 @@ class UiCommentResponseEdit extends UiCommentEdit {
   protected _prepare(): void {
     this._editorContainer = document.createElement("div");
     this._editorContainer.className = "commentEditorContainer";
-    this._editorContainer.innerHTML = '<span class="icon icon48 fa-spinner"></span>';
+    this._editorContainer.innerHTML = '<fa-icon size="48" name="spinner" solid></fa-icon>';
 
     const content = this._activeElement!.querySelector(".commentResponseContent")!;
     content.insertBefore(this._editorContainer, content.firstChild);

diff --git a/ts/WoltLabSuite/Core/Ui/ItemList/Filter.ts b/ts/WoltLabSuite/Core/Ui/ItemList/Filter.ts
index 98a42eda321cdd781a38b7766377a0234f4568be..c26fdbcc7a2415f03039895ca99db253f25c10da 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/ItemList/Filter.ts
+++ b/ts/WoltLabSuite/Core/Ui/ItemList/Filter.ts
@@ -98,7 +98,7 @@ class UiItemListFilter {
     this._clearButton.href = "#";
     this._clearButton.className = "button inputSuffix disabled jsTooltip";
     this._clearButton.title = Language.get("wcf.global.filter.button.clear");
-    this._clearButton.innerHTML = '<span class="icon icon16 fa-times"></span>';
+    this._clearButton.innerHTML = '<fa-icon size="16" name="times" solid></fa-icon>';
     this._clearButton.addEventListener("click", (event) => {
       event.preventDefault();
 
@@ -113,7 +113,7 @@ class UiItemListFilter {
       visibilityButton.href = "#";
       visibilityButton.className = "button inputSuffix jsTooltip";
       visibilityButton.title = Language.get("wcf.global.filter.button.visibility");
-      visibilityButton.innerHTML = '<span class="icon icon16 fa-eye"></span>';
+      visibilityButton.innerHTML = '<fa-icon size="16" name="eye"></fa-icon>';
       visibilityButton.addEventListener("click", (ev) => this._toggleVisibility(ev));
       inputAddon.appendChild(visibilityButton);
     }

diff --git a/ts/WoltLabSuite/Core/Ui/ItemList/LineBreakSeparatedText.ts b/ts/WoltLabSuite/Core/Ui/ItemList/LineBreakSeparatedText.ts
index 8a3d90e5bc0c02e8cbe3bf9f10738a024ada72b2..96dc4e6a060c61385fa60182b6f6598fdb773dfd 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/ItemList/LineBreakSeparatedText.ts
+++ b/ts/WoltLabSuite/Core/Ui/ItemList/LineBreakSeparatedText.ts
@@ -125,7 +125,7 @@ export class UiItemListLineBreakSeparatedText {
     this.addButton.href = "#";
     this.addButton.classList.add("button", "inputSuffix", "jsTooltip");
     this.addButton.title = Language.get("wcf.global.button.add");
-    this.addButton.innerHTML = '<span class="icon icon16 fa-plus"></span>';
+    this.addButton.innerHTML = '<fa-icon size="16" name="plus" solid></fa-icon>';
     this.addButton.addEventListener("click", (ev) => this.addItem(ev));
     inputAddon.appendChild(this.addButton);
 
@@ -133,7 +133,7 @@ export class UiItemListLineBreakSeparatedText {
     this.clearButton.href = "#";
     this.clearButton.classList.add("button", "inputSuffix", "jsTooltip");
     this.clearButton.title = Language.get("wcf.global.button.delete");
-    this.clearButton.innerHTML = '<span class="icon icon16 fa-times"></span>';
+    this.clearButton.innerHTML = '<fa-icon size="16" name="times" solid></fa-icon>';
     this.clearButton.addEventListener("click", (ev) => this.clearList(ev));
     inputAddon.appendChild(this.clearButton);
     if (this.items.size === 0) {

diff --git a/ts/WoltLabSuite/Core/Ui/Message/Reply.ts b/ts/WoltLabSuite/Core/Ui/Message/Reply.ts
index 358d2a16a532d3c719a4a074f32a570bf1c7b360..c12be3daba970fb26ee4cdaa9c76a10c9c03ae0f 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/Message/Reply.ts
+++ b/ts/WoltLabSuite/Core/Ui/Message/Reply.ts
@@ -247,7 +247,7 @@ class UiMessageReply {
     if (this._loadingOverlay === null) {
       this._loadingOverlay = document.createElement("div");
       this._loadingOverlay.className = "messageContentLoadingOverlay";
-      this._loadingOverlay.innerHTML = '<span class="icon icon96 fa-spinner"></span>';
+      this._loadingOverlay.innerHTML = '<fa-icon size="96" name="spinner" solid></fa-icon>';
     }
 
     this._content.classList.add("loading");

diff --git a/ts/WoltLabSuite/Core/Ui/Page/Action.ts b/ts/WoltLabSuite/Core/Ui/Page/Action.ts
index 710563da6def57130f912f5d10e6bba77232594c..b0a6fabcd79af78f087456fc418dac709481b953 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/Page/Action.ts
+++ b/ts/WoltLabSuite/Core/Ui/Page/Action.ts
@@ -30,7 +30,7 @@ function buildToTopButton(): HTMLAnchorElement {
   button.href = "";
   button.title = Language.get("wcf.global.scrollUp");
   button.setAttribute("aria-hidden", "true");
-  button.innerHTML = '<span class="icon icon32 fa-angle-up"></span>';
+  button.innerHTML = '<fa-icon size="32" name="angle-up" solid></fa-icon>';
 
   button.addEventListener("click", scrollToTop);
 

diff --git a/ts/WoltLabSuite/Core/Ui/Page/Header/Menu.ts b/ts/WoltLabSuite/Core/Ui/Page/Header/Menu.ts
index 4db052f8fdeb07471ab590410c5b1df77137ea65..98668271baee4e4ac9f76d82501215c35906e4d3 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/Page/Header/Menu.ts
+++ b/ts/WoltLabSuite/Core/Ui/Page/Header/Menu.ts
@@ -150,7 +150,7 @@ function initOverflowNavigation(): void {
   _buttonShowNext = document.createElement("a");
   _buttonShowNext.className = "mainMenuShowNext";
   _buttonShowNext.href = "#";
-  _buttonShowNext.innerHTML = '<span class="icon icon32 fa-angle-right"></span>';
+  _buttonShowNext.innerHTML = '<fa-icon size="32" name="angle-right" solid></fa-icon>';
   _buttonShowNext.setAttribute("aria-hidden", "true");
   _buttonShowNext.addEventListener("click", (event) => {
     event.preventDefault();
@@ -163,7 +163,7 @@ function initOverflowNavigation(): void {
   _buttonShowPrevious = document.createElement("a");
   _buttonShowPrevious.className = "mainMenuShowPrevious";
   _buttonShowPrevious.href = "#";
-  _buttonShowPrevious.innerHTML = '<span class="icon icon32 fa-angle-left"></span>';
+  _buttonShowPrevious.innerHTML = '<fa-icon size="32" name="angle-left" solid></fa-icon>';
   _buttonShowPrevious.setAttribute("aria-hidden", "true");
   _buttonShowPrevious.addEventListener("click", (event) => {
     event.preventDefault();

diff --git a/ts/WoltLabSuite/Core/Ui/Page/Search.ts b/ts/WoltLabSuite/Core/Ui/Page/Search.ts
index e326d381c2e79b72ad3d22a27d3029488e13bc69..9352c79f00175feca09163498dbc75a34a0024c1 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/Page/Search.ts
+++ b/ts/WoltLabSuite/Core/Ui/Page/Search.ts
@@ -130,7 +130,7 @@ class UiPageSearch implements AjaxCallbackObject, DialogCallbackObject {
           <dd>
             <div class="inputAddon">
               <input type="text" id="wcfUiPageSearchInput" class="long">
-              <a href="#" class="inputSuffix"><span class="icon icon16 fa-search"></span></a>
+              <a href="#" class="inputSuffix"><fa-icon size="16" name="search" solid></fa-icon></a>
             </div>
           </dd>
         </dl>

diff --git a/ts/WoltLabSuite/Core/Ui/User/Menu/Data/ModerationQueue.ts b/ts/WoltLabSuite/Core/Ui/User/Menu/Data/ModerationQueue.ts
index 99ec9e8a5a1ded4f08906eaf94501db7bd998274..fda343f89b4537a06981a0101e7b2d9c382fcdfa 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/User/Menu/Data/ModerationQueue.ts
+++ b/ts/WoltLabSuite/Core/Ui/User/Menu/Data/ModerationQueue.ts
@@ -59,7 +59,7 @@ class UserMenuDataModerationQueue implements UserMenuProvider {
   getMenuButtons(): UserMenuButton[] {
     return [
       {
-        icon: '<span class="icon icon24 fa-trash-o"></span>',
+        icon: '<fa-icon size="24" name="trash-can"></fa-icon>',
         link: this.options.deletedContentLink,
         name: "deletedContent",
         title: this.options.deletedContent,

diff --git a/ts/WoltLabSuite/Core/Ui/User/Menu/Data/Notification.ts b/ts/WoltLabSuite/Core/Ui/User/Menu/Data/Notification.ts
index 35c0134de7aa77d6a4ef95c780838a07460937ea..fb46e4c378ee5bb8fbff74e1d51f244d8f7711e8 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/User/Menu/Data/Notification.ts
+++ b/ts/WoltLabSuite/Core/Ui/User/Menu/Data/Notification.ts
@@ -169,7 +169,7 @@ class UserMenuDataNotification implements DesktopNotifications, UserMenuProvider
   getMenuButtons(): UserMenuButton[] {
     return [
       {
-        icon: '<span class="icon icon24 fa-cog"></span>',
+        icon: '<fa-icon size="24" name="cog" solid></fa-icon>',
         link: this.options.settingsLink,
         name: "settings",
         title: this.options.settingsTitle,

diff --git a/ts/WoltLabSuite/Core/Ui/User/Menu/View.ts b/ts/WoltLabSuite/Core/Ui/User/Menu/View.ts
index 5dfe2560d493318224df0e184209fc916745d8b5..ef47b47c42ee4b9e9afdf31ad0ac2248d63662a5 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/User/Menu/View.ts
+++ b/ts/WoltLabSuite/Core/Ui/User/Menu/View.ts
@@ -32,7 +32,7 @@ export class UserMenuView {
     this.buildElement();
 
     this.markAllAsReadButton = this.buildButton({
-      icon: '<span class="icon icon24 fa-check"></span>',
+      icon: '<fa-icon size="24" name="check" solid></fa-icon>',
       link: "#",
       name: "markAllAsRead",
       title: Language.get("wcf.global.button.markAllAsRead"),
@@ -210,7 +210,7 @@ export class UserMenuView {
 
   private reset(): void {
     const content = this.getContent();
-    content.innerHTML = `<span class="userMenuContentStatus"><span class="icon icon24 fa-spinner"></span></span>`;
+    content.innerHTML = `<span class="userMenuContentStatus"><fa-icon size="24" name="spinner" solid></fa-icon></span>`;
   }
 
   private buildElement(): void {

diff --git a/ts/WoltLabSuite/Core/Ui/User/Search/Input.ts b/ts/WoltLabSuite/Core/Ui/User/Search/Input.ts
index bd8dd6e53369ca70734688bf913b0df3dcde470c..56b4361770a71b2f5f1d8da4afa461c64160e826 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/User/Search/Input.ts
+++ b/ts/WoltLabSuite/Core/Ui/User/Search/Input.ts
@@ -39,7 +39,7 @@ class UiUserSearchInput extends UiSearchInput {
 
     const box = document.createElement("div");
     box.className = "box16";
-    box.innerHTML = item.type === "group" ? `<span class="icon icon16 fa-users"></span>` : item.icon;
+    box.innerHTML = item.type === "group" ? `<fa-icon size="16" name="users" solid></fa-icon>` : item.icon;
     box.appendChild(listItem.children[0]);
     listItem.appendChild(box);
 

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Devtools/Notification/Test.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Devtools/Notification/Test.js
index d583655c09a6385572a73219c3e955c383b61610..810778b29f11c524fc7e14a3c2fb2f9d687a7c57 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Devtools/Notification/Test.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Devtools/Notification/Test.js
@@ -95,7 +95,7 @@ define(["require", "exports", "tslib", "../../../../Ajax", "../../../../Language
          */
         test(event) {
             const button = event.currentTarget;
-            button.innerHTML = '<span class="icon icon16 fa-spinner"></span>';
+            button.innerHTML = '<fa-icon size="16" name="spinner" solid></fa-icon>';
             this.buttons.forEach((button) => (button.disabled = true));
             Ajax.api(this, {
                 parameters: {

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Devtools/Project/Sync.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Devtools/Project/Sync.js
index b550ad8cc20c7bb100773956f1db4129472f99cc..8b62855644647e392e81fc22724831d5f7fc0d0a 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Devtools/Project/Sync.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Devtools/Project/Sync.js
@@ -92,7 +92,7 @@ define(["require", "exports", "tslib", "../../../../Ajax", "../../../../Language
                 }
             }
             const syncAll = document.createElement("li");
-            syncAll.innerHTML = `<a href="#" class="button"><span class="icon icon16 fa-refresh"></span> ${Language.get("wcf.acp.devtools.sync.syncAll")}</a>`;
+            syncAll.innerHTML = `<a href="#" class="button"><fa-icon size="16" name="arrows-rotate" solid></fa-icon> ${Language.get("wcf.acp.devtools.sync.syncAll")}</a>`;
             this.buttonSyncAll = syncAll.children[0];
             this.buttonSyncAll.addEventListener("click", this.syncAll.bind(this));
             const list = document.querySelector(".contentHeaderNavigation > ul");
@@ -101,7 +101,7 @@ define(["require", "exports", "tslib", "../../../../Ajax", "../../../../Language
         sync(pluginName, target) {
             const identifier = this.getButtonIdentifier(pluginName, target);
             this.buttons.get(identifier).disabled = true;
-            this.buttonStatus.get(identifier).innerHTML = '<span class="icon icon16 fa-spinner"></span>';
+            this.buttonStatus.get(identifier).innerHTML = '<fa-icon size="16" name="spinner" solid></fa-icon>';
             Ajax.api(this, {
                 parameters: {
                     pluginName,

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.js
index a2c0ed65003c3fbb36700d0a9b4af475d4a1618f..07e165ad11798b4e413d37fa68d9bddb03cc109d 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.js
@@ -57,7 +57,7 @@ define(["require", "exports", "tslib", "../../../Ajax", "../../../Dom/Util", "..
         onClick(event) {
             event.preventDefault();
             this.buttonRunTest.classList.add("disabled");
-            this.buttonRunTest.innerHTML = `<span class="icon icon16 fa-spinner"></span> ${Language.get("wcf.global.loading")}`;
+            this.buttonRunTest.innerHTML = `<fa-icon size="16" name="spinner" solid></fa-icon> ${Language.get("wcf.global.loading")}`;
             Util_1.default.innerError(this.buttonRunTest, false);
             window.setTimeout(() => {
                 const startTls = document.querySelector('input[name="values[mail_smtp_starttls]"]:checked');

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Date/Picker.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Date/Picker.js
index f07e22ce58caaec5ce0a8a4fbd97c3267439e20c..79ca064ffeb8dc11d1fe0e3440a5cecae01b23bd 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Date/Picker.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Date/Picker.js
@@ -51,7 +51,7 @@ define(["require", "exports", "tslib", "../Core", "./Util", "../Dom/Change/Liste
         _dateMonthPrevious.className = "previous jsTooltip";
         _dateMonthPrevious.title = Language.get("wcf.date.datePicker.previousMonth");
         _dateMonthPrevious.setAttribute("aria-label", Language.get("wcf.date.datePicker.previousMonth"));
-        _dateMonthPrevious.innerHTML = '<span class="icon icon16 fa-arrow-left"></span>';
+        _dateMonthPrevious.innerHTML = '<fa-icon size="16" name="arrow-left" solid></fa-icon>';
         _dateMonthPrevious.addEventListener("click", () => DatePicker.previousMonth());
         header.appendChild(_dateMonthPrevious);
         const monthYearContainer = document.createElement("span");
@@ -78,7 +78,7 @@ define(["require", "exports", "tslib", "../Core", "./Util", "../Dom/Change/Liste
         _dateMonthNext.className = "next jsTooltip";
         _dateMonthNext.title = Language.get("wcf.date.datePicker.nextMonth");
         _dateMonthNext.setAttribute("aria-label", Language.get("wcf.date.datePicker.nextMonth"));
-        _dateMonthNext.innerHTML = '<span class="icon icon16 fa-arrow-right"></span>';
+        _dateMonthNext.innerHTML = '<fa-icon size="16" name="arrow-right" solid></fa-icon>';
         _dateMonthNext.addEventListener("click", () => DatePicker.nextMonth());
         header.appendChild(_dateMonthNext);
         _dateGrid = document.createElement("ul");

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Article/Search.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Article/Search.js
index 73ac1e56e1ad7c4f46813d05eb81ea0a87075a36..92cf8cd8d5330a0aa7f17a08cfd73ec8954c4bc6 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Article/Search.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Article/Search.js
@@ -109,7 +109,7 @@ define(["require", "exports", "tslib", "../../Ajax", "../../Dom/Util", "../../La
             <dd>
               <div class="inputAddon">
                 <input type="text" id="wcfUiArticleSearchInput" class="long">
-                <a href="#" class="inputSuffix"><span class="icon icon16 fa-search"></span></a>
+                <a href="#" class="inputSuffix"><fa-icon size="16" name="search" solid></fa-icon></a>
               </div>
             </dd>
           </dl>

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Comment/Add.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Comment/Add.js
index b7bfafc9d325a3ba1407a5476b71b4f8c60c1c93..8a3fbbadd06acca1627094be09672b48a24501c8 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Comment/Add.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Comment/Add.js
@@ -163,7 +163,7 @@ define(["require", "exports", "tslib", "../../Ajax", "../../Controller/Captcha",
             if (this._loadingOverlay === null) {
                 this._loadingOverlay = document.createElement("div");
                 this._loadingOverlay.className = "commentLoadingOverlay";
-                this._loadingOverlay.innerHTML = '<span class="icon icon96 fa-spinner"></span>';
+                this._loadingOverlay.innerHTML = '<fa-icon size="96" name="spinner" solid></fa-icon>';
             }
             this._content.classList.add("loading");
             this._content.appendChild(this._loadingOverlay);

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Comment/Edit.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Comment/Edit.js
index eb78a7ac2647afe52e908932b7eaa5813d38f67f..7da1118e98b8d0c34d2245e7038b82012612a89c 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Comment/Edit.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Comment/Edit.js
@@ -72,7 +72,7 @@ define(["require", "exports", "tslib", "../../Ajax", "../../Core", "../../Dom/Ch
         _prepare() {
             this._editorContainer = document.createElement("div");
             this._editorContainer.className = "commentEditorContainer";
-            this._editorContainer.innerHTML = '<span class="icon icon48 fa-spinner"></span>';
+            this._editorContainer.innerHTML = '<fa-icon size="48" name="spinner" solid></fa-icon>';
             const content = this._activeElement.querySelector(".commentContentContainer");
             content.insertBefore(this._editorContainer, content.firstChild);
         }

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Comment/Response/Edit.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Comment/Response/Edit.js
index 7898fddfb12a9349c91790255ed11822b4c6ce64..e3ac8b60836e52c4024c1163fe6579a06368cadf 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Comment/Response/Edit.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Comment/Response/Edit.js
@@ -74,7 +74,7 @@ define(["require", "exports", "tslib", "../../../Ajax", "../../../Core", "../../
         _prepare() {
             this._editorContainer = document.createElement("div");
             this._editorContainer.className = "commentEditorContainer";
-            this._editorContainer.innerHTML = '<span class="icon icon48 fa-spinner"></span>';
+            this._editorContainer.innerHTML = '<fa-icon size="48" name="spinner" solid></fa-icon>';
             const content = this._activeElement.querySelector(".commentResponseContent");
             content.insertBefore(this._editorContainer, content.firstChild);
         }

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/ItemList/Filter.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/ItemList/Filter.js
index c29f821e71d1b17af33bdea0e988c769adc017c6..4d52e34b75ddbcff1b9ddf7c286adb2acce13f6a 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/ItemList/Filter.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/ItemList/Filter.js
@@ -67,7 +67,7 @@ define(["require", "exports", "tslib", "../../Core", "../../Dom/Util", "../../La
             this._clearButton.href = "#";
             this._clearButton.className = "button inputSuffix disabled jsTooltip";
             this._clearButton.title = Language.get("wcf.global.filter.button.clear");
-            this._clearButton.innerHTML = '<span class="icon icon16 fa-times"></span>';
+            this._clearButton.innerHTML = '<fa-icon size="16" name="times" solid></fa-icon>';
             this._clearButton.addEventListener("click", (event) => {
                 event.preventDefault();
                 this.reset();
@@ -79,7 +79,7 @@ define(["require", "exports", "tslib", "../../Core", "../../Dom/Util", "../../La
                 visibilityButton.href = "#";
                 visibilityButton.className = "button inputSuffix jsTooltip";
                 visibilityButton.title = Language.get("wcf.global.filter.button.visibility");
-                visibilityButton.innerHTML = '<span class="icon icon16 fa-eye"></span>';
+                visibilityButton.innerHTML = '<fa-icon size="16" name="eye"></fa-icon>';
                 visibilityButton.addEventListener("click", (ev) => this._toggleVisibility(ev));
                 inputAddon.appendChild(visibilityButton);
             }

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/ItemList/LineBreakSeparatedText.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/ItemList/LineBreakSeparatedText.js
index 5d292511ca4623dd5b74373b35b1b363cbab9876..4d8f6d3ba84a4c7ad4e38b4c6815c5251dc90af8 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/ItemList/LineBreakSeparatedText.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/ItemList/LineBreakSeparatedText.js
@@ -103,14 +103,14 @@ define(["require", "exports", "tslib", "../Confirmation", "../../Language", "../
             this.addButton.href = "#";
             this.addButton.classList.add("button", "inputSuffix", "jsTooltip");
             this.addButton.title = Language.get("wcf.global.button.add");
-            this.addButton.innerHTML = '<span class="icon icon16 fa-plus"></span>';
+            this.addButton.innerHTML = '<fa-icon size="16" name="plus" solid></fa-icon>';
             this.addButton.addEventListener("click", (ev) => this.addItem(ev));
             inputAddon.appendChild(this.addButton);
             this.clearButton = document.createElement("a");
             this.clearButton.href = "#";
             this.clearButton.classList.add("button", "inputSuffix", "jsTooltip");
             this.clearButton.title = Language.get("wcf.global.button.delete");
-            this.clearButton.innerHTML = '<span class="icon icon16 fa-times"></span>';
+            this.clearButton.innerHTML = '<fa-icon size="16" name="times" solid></fa-icon>';
             this.clearButton.addEventListener("click", (ev) => this.clearList(ev));
             inputAddon.appendChild(this.clearButton);
             if (this.items.size === 0) {

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/Reply.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/Reply.js
index ed13bbfabf2acbab58ec2c6b5474ff20aa7ddbfd..4d18dfbf24e597c7fbf610667e1ef97ed9ded416 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/Reply.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/Reply.js
@@ -185,7 +185,7 @@ define(["require", "exports", "tslib", "../../Ajax", "../../Core", "../../Event/
             if (this._loadingOverlay === null) {
                 this._loadingOverlay = document.createElement("div");
                 this._loadingOverlay.className = "messageContentLoadingOverlay";
-                this._loadingOverlay.innerHTML = '<span class="icon icon96 fa-spinner"></span>';
+                this._loadingOverlay.innerHTML = '<fa-icon size="96" name="spinner" solid></fa-icon>';
             }
             this._content.classList.add("loading");
             this._content.appendChild(this._loadingOverlay);

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Action.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Action.js
index d111f4a27763741a945d506078f34dc15520bdd6..b35b51c4ee019f247a66ba44737e7c2447a6f1f3 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Action.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Action.js
@@ -29,7 +29,7 @@ define(["require", "exports", "tslib", "../../Core", "../../Language", "../../Ui
         button.href = "";
         button.title = Language.get("wcf.global.scrollUp");
         button.setAttribute("aria-hidden", "true");
-        button.innerHTML = '<span class="icon icon32 fa-angle-up"></span>';
+        button.innerHTML = '<fa-icon size="32" name="angle-up" solid></fa-icon>';
         button.addEventListener("click", scrollToTop);
         return button;
     }

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Header/Menu.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Header/Menu.js
index e8e6d9a823ee4bfc5f9c1570ceea437912d0b597..f0f1619df276a14bc5170df2a200f7e40cc19d69 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Header/Menu.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Header/Menu.js
@@ -131,7 +131,7 @@ define(["require", "exports", "tslib", "../../../Environment", "../../../Languag
         _buttonShowNext = document.createElement("a");
         _buttonShowNext.className = "mainMenuShowNext";
         _buttonShowNext.href = "#";
-        _buttonShowNext.innerHTML = '<span class="icon icon32 fa-angle-right"></span>';
+        _buttonShowNext.innerHTML = '<fa-icon size="32" name="angle-right" solid></fa-icon>';
         _buttonShowNext.setAttribute("aria-hidden", "true");
         _buttonShowNext.addEventListener("click", (event) => {
             event.preventDefault();
@@ -141,7 +141,7 @@ define(["require", "exports", "tslib", "../../../Environment", "../../../Languag
         _buttonShowPrevious = document.createElement("a");
         _buttonShowPrevious.className = "mainMenuShowPrevious";
         _buttonShowPrevious.href = "#";
-        _buttonShowPrevious.innerHTML = '<span class="icon icon32 fa-angle-left"></span>';
+        _buttonShowPrevious.innerHTML = '<fa-icon size="32" name="angle-left" solid></fa-icon>';
         _buttonShowPrevious.setAttribute("aria-hidden", "true");
         _buttonShowPrevious.addEventListener("click", (event) => {
             event.preventDefault();

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Search.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Search.js
index cec46abafcfaf09687295e6590766a8bf3f70ccb..ddb8d89d8ef0d7dd7d27463b6682c5fb9c9c63af 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Search.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Search.js
@@ -103,7 +103,7 @@ define(["require", "exports", "tslib", "../../Ajax", "../../Dom/Util", "../../La
           <dd>
             <div class="inputAddon">
               <input type="text" id="wcfUiPageSearchInput" class="long">
-              <a href="#" class="inputSuffix"><span class="icon icon16 fa-search"></span></a>
+              <a href="#" class="inputSuffix"><fa-icon size="16" name="search" solid></fa-icon></a>
             </div>
           </dd>
         </dl>

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Menu/Data/ModerationQueue.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Menu/Data/ModerationQueue.js
index 1860cae57f47dd5ee80961d6dcb63fbc5d8f136b..ba7da1d0487ac0f4c67038cd9f790c0ec3fecc56 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Menu/Data/ModerationQueue.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Menu/Data/ModerationQueue.js
@@ -33,7 +33,7 @@ define(["require", "exports", "tslib", "../../../../Ajax", "../View", "../Manage
         getMenuButtons() {
             return [
                 {
-                    icon: '<span class="icon icon24 fa-trash-o"></span>',
+                    icon: '<fa-icon size="24" name="trash-can"></fa-icon>',
                     link: this.options.deletedContentLink,
                     name: "deletedContent",
                     title: this.options.deletedContent,

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Menu/Data/Notification.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Menu/Data/Notification.js
index 04ca982f1b9a0d473f64210bc6279e7fe7110ad2..3d2e0f8337d9093f5b05b6bd184b987d76926b1f 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Menu/Data/Notification.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Menu/Data/Notification.js
@@ -121,7 +121,7 @@ define(["require", "exports", "tslib", "../../../../Ajax", "../View", "../Manage
         getMenuButtons() {
             return [
                 {
-                    icon: '<span class="icon icon24 fa-cog"></span>',
+                    icon: '<fa-icon size="24" name="cog" solid></fa-icon>',
                     link: this.options.settingsLink,
                     name: "settings",
                     title: this.options.settingsTitle,

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Menu/View.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Menu/View.js
index b73d3eff5a1f7cd45061b77065ada2dfadd7d9e7..c27c8af7d264024811d757513a991e90730f702f 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Menu/View.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Menu/View.js
@@ -22,7 +22,7 @@ define(["require", "exports", "tslib", "../../../Date/Util", "../../../StringUti
             this.element = document.createElement("div");
             this.buildElement();
             this.markAllAsReadButton = this.buildButton({
-                icon: '<span class="icon icon24 fa-check"></span>',
+                icon: '<fa-icon size="24" name="check" solid></fa-icon>',
                 link: "#",
                 name: "markAllAsRead",
                 title: Language.get("wcf.global.button.markAllAsRead"),
@@ -167,7 +167,7 @@ define(["require", "exports", "tslib", "../../../Date/Util", "../../../StringUti
         }
         reset() {
             const content = this.getContent();
-            content.innerHTML = `<span class="userMenuContentStatus"><span class="icon icon24 fa-spinner"></span></span>`;
+            content.innerHTML = `<span class="userMenuContentStatus"><fa-icon size="24" name="spinner" solid></fa-icon></span>`;
         }
         buildElement() {
             this.element.hidden = true;

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Search/Input.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Search/Input.js
index cdeb0dc7c50599735c0ea05d0efda245f516b548..0fd04827cf7b9440e1aa67e4cf7437df948c6154 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Search/Input.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/User/Search/Input.js
@@ -31,7 +31,7 @@ define(["require", "exports", "tslib", "../../../Core", "../../Search/Input"], f
             listItem.dataset.type = item.type;
             const box = document.createElement("div");
             box.className = "box16";
-            box.innerHTML = item.type === "group" ? `<span class="icon icon16 fa-users"></span>` : item.icon;
+            box.innerHTML = item.type === "group" ? `<fa-icon size="16" name="users" solid></fa-icon>` : item.icon;
             box.appendChild(listItem.children[0]);
             listItem.appendChild(box);
             return listItem;