From: Tim Düsterhus <duesterhus@woltlab.com>
Date: Mon, 8 Mar 2021 11:54:01 +0000 (+0100)
Subject: Swap icons used in password toggle
X-Git-Tag: 5.4.0_Alpha_1~187^2
X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=d3af9bc817b8c39b42df6639cdde69d87143be2a;p=GitHub%2FWoltLab%2FWCF.git

Swap icons used in password toggle

Icons in buttons in WoltLab Suite usually indicate what happens when the button
is clicked and do not represent the current state.
---

diff --git a/ts/WoltLabSuite/Core/Ui/Password.ts b/ts/WoltLabSuite/Core/Ui/Password.ts
index 5c73e44415..b9ef3e4882 100644
--- a/ts/WoltLabSuite/Core/Ui/Password.ts
+++ b/ts/WoltLabSuite/Core/Ui/Password.ts
@@ -42,7 +42,7 @@ function initElement(input: HTMLInputElement): void {
   inputAddon.appendChild(button);
 
   const icon = document.createElement("span");
-  icon.classList.add("icon", "icon16", "fa-eye-slash");
+  icon.classList.add("icon", "icon16", "fa-eye");
   button.appendChild(icon);
 
   button.addEventListener("click", () => {
@@ -58,13 +58,13 @@ function initElement(input: HTMLInputElement): void {
 
 function toggle(input: HTMLInputElement, button: HTMLElement, icon: HTMLElement): void {
   if (input.type === "password") {
-    icon.classList.add("fa-eye");
-    icon.classList.remove("fa-eye-slash");
+    icon.classList.remove("fa-eye");
+    icon.classList.add("fa-eye-slash");
     button.dataset.tooltip = Language.get("wcf.global.form.password.button.hide");
     input.type = "text";
   } else {
-    icon.classList.remove("fa-eye");
-    icon.classList.add("fa-eye-slash");
+    icon.classList.add("fa-eye");
+    icon.classList.remove("fa-eye-slash");
     button.dataset.tooltip = Language.get("wcf.global.form.password.button.show");
     input.type = "password";
   }
diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Password.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Password.js
index 816e2fe419..f1f503a9da 100644
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Password.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Password.js
@@ -39,7 +39,7 @@ define(["require", "exports", "tslib", "../Dom/Change/Listener", "../Language"],
         button.setAttribute("aria-hidden", "true");
         inputAddon.appendChild(button);
         const icon = document.createElement("span");
-        icon.classList.add("icon", "icon16", "fa-eye-slash");
+        icon.classList.add("icon", "icon16", "fa-eye");
         button.appendChild(icon);
         button.addEventListener("click", () => {
             toggle(input, button, icon);
@@ -53,14 +53,14 @@ define(["require", "exports", "tslib", "../Dom/Change/Listener", "../Language"],
     }
     function toggle(input, button, icon) {
         if (input.type === "password") {
-            icon.classList.add("fa-eye");
-            icon.classList.remove("fa-eye-slash");
+            icon.classList.remove("fa-eye");
+            icon.classList.add("fa-eye-slash");
             button.dataset.tooltip = Language.get("wcf.global.form.password.button.hide");
             input.type = "text";
         }
         else {
-            icon.classList.remove("fa-eye");
-            icon.classList.add("fa-eye-slash");
+            icon.classList.add("fa-eye");
+            icon.classList.remove("fa-eye-slash");
             button.dataset.tooltip = Language.get("wcf.global.form.password.button.show");
             input.type = "password";
         }