Remove the `regular` flag of `<fa-icon>`

diff --git a/com.woltlab.wcf/templates/pageHeaderUser.tpl b/com.woltlab.wcf/templates/pageHeaderUser.tpl
index 35bcf8285d8925e03b5599f9329d231e31cfc113..52698ca670c8ac1274261446149cc46c6c09033f 100644 (file)
--- a/com.woltlab.wcf/templates/pageHeaderUser.tpl
+++ b/com.woltlab.wcf/templates/pageHeaderUser.tpl
@@ -109,7 +109,7 @@
                                                aria-expanded="false"
                                        >
                                                {icon size=32 name='info' type='solid'}
-                                               {icon size=32 name='bell' type='regular'}
+                                               {icon size=32 name='bell'}
                                                <span class="icon icon32 fa-bell-o"></span>
                                                {icon size=32 name='500px' type='brand'}
                                                <span>{lang}wcf.user.notification.notifications{/lang}</span>{if $__wcf->getUserNotificationHandler()->getNotificationCount()} <span class="badge badgeUpdate">{#$__wcf->getUserNotificationHandler()->getNotificationCount()}</span>{/if}

diff --git a/ts/WoltLabSuite/WebComponent/fa-icon.ts b/ts/WoltLabSuite/WebComponent/fa-icon.ts
index 69c541e37e1350108eb5d551986236c802919354..3bcfeda113109a69d9b9cabc3051780311fb929b 100644 (file)
--- a/ts/WoltLabSuite/WebComponent/fa-icon.ts
+++ b/ts/WoltLabSuite/WebComponent/fa-icon.ts
@@ -36,7 +36,7 @@
       }
     }
 
-    setIcon(name: string, type: "regular" | "solid"): void {
+    setIcon(name: string, type: "" | "solid"): void {
       const metadata = window.getFontAwesome6IconMetadata(name);
       if (metadata === undefined) {
         throw new TypeError(`The icon '${name}' is unknown or unsupported.`);
@@ -48,7 +48,6 @@
       }
 
       this.solid = type === "solid";
-      this.regular = type === "regular";
       this.name = name;
 
       const root = this.shadowRoot!;
@@ -69,18 +68,6 @@
       }
     }
 
-    get regular(): boolean {
-      return this.hasAttribute("regular");
-    }
-
-    set regular(regular: boolean) {
-      if (regular) {
-        this.setAttribute("regular", "");
-      } else {
-        this.removeAttribute("regular");
-      }
-    }
-
     get name(): string {
       return this.getAttribute("name") || "";
     }

diff --git a/wcfsetup/install/files/js/WoltLabSuite/WebComponent/fa-icon.js b/wcfsetup/install/files/js/WoltLabSuite/WebComponent/fa-icon.js
index 82e11bc684b1a73632c9ba082b558cf9d71c2fe0..32414f26fd1b403a894643afaea1190e052b0353 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/WebComponent/fa-icon.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/WebComponent/fa-icon.js
@@ -43,7 +43,6 @@
                 throw new Error(`The icon '${name}' does not support the style '${type}'.`);
             }
             this.solid = type === "solid";
-            this.regular = type === "regular";
             this.name = name;
             const root = this.shadowRoot;
             (_a = root.childNodes[0]) === null || _a === void 0 ? void 0 : _a.remove();
@@ -60,17 +59,6 @@
                 this.removeAttribute("solid");
             }
         }
-        get regular() {
-            return this.hasAttribute("regular");
-        }
-        set regular(regular) {
-            if (regular) {
-                this.setAttribute("regular", "");
-            }
-            else {
-                this.removeAttribute("regular");
-            }
-        }
         get name() {
             return this.getAttribute("name") || "";
         }

diff --git a/wcfsetup/install/files/lib/system/template/plugin/IconFunctionTemplatePlugin.class.php b/wcfsetup/install/files/lib/system/template/plugin/IconFunctionTemplatePlugin.class.php
index 2edc4803b9545ef78474afdb8a183d43e30d648d..a46911c97943bb0f9e588a72cf5b72f8c4adba18 100644 (file)
--- a/wcfsetup/install/files/lib/system/template/plugin/IconFunctionTemplatePlugin.class.php
+++ b/wcfsetup/install/files/lib/system/template/plugin/IconFunctionTemplatePlugin.class.php
@@ -21,7 +21,7 @@ final class IconFunctionTemplatePlugin implements IFunctionTemplatePlugin
 {
     private const SIZES = [16, 24, 32, 48, 64, 96, 128, 144];
 
-    private const TYPES = ['brand', 'regular', 'solid'];
+    private const TYPES = ['brand', 'solid'];
 
     /**
      * @inheritDoc
@@ -40,9 +40,7 @@ final class IconFunctionTemplatePlugin implements IFunctionTemplatePlugin
             throw new \InvalidArgumentException("The `name` attribute must be present and non-empty.");
         }
 
-        if ($type === '') {
-            throw new \InvalidArgumentException("The `type` attribute must be present and non-empty.");
-        } else if (!\in_array($type, self::TYPES)) {
+        if ($type !== '' && !\in_array($type, self::TYPES)) {
             throw new \InvalidArgumentException("An unsupported type `${type}` was specified.");
         }
 
@@ -59,8 +57,13 @@ final class IconFunctionTemplatePlugin implements IFunctionTemplatePlugin
             HTML;
         }
 
+        $modifier = '';
+        if ($type === 'solid') {
+            $modifier = ' solid';
+        }
+
         return <<<HTML
-        <fa-icon size="{$size}" name="{$name}" {$type}></fa-icon>
+        <fa-icon size="{$size}" name="{$name}"{$modifier}></fa-icon>
         HTML;
     }
 }

diff --git a/wcfsetup/install/files/style/font-awesome/000-woltlab.scss b/wcfsetup/install/files/style/font-awesome/000-woltlab.scss
index b611ff41af115b45dec0dc1c69c76786daa6de7c..437a067dbf3d192b9490bf48c79c2fa905c28f46 100644 (file)
--- a/wcfsetup/install/files/style/font-awesome/000-woltlab.scss
+++ b/wcfsetup/install/files/style/font-awesome/000-woltlab.scss
@@ -99,20 +99,17 @@ fa-icon {
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
 
-  font-family: "Font Awesome 6 Free";
+  font-family: var(--fa-font-family, "Font Awesome 6 Free");
   font-size: var(--font-size);
   font-style: normal;
   font-variant: normal;
+  font-weight: var(--fa-font-weight, 400);
   line-height: 1;
   text-rendering: auto;
 
   &[solid] {
     font-weight: 900;
   }
-
-  &[regular] {
-    font-weight: 400;
-  }
 }
 
 /* Default icon sizes */