From 3366429f9c1a6984e6031256e0c97e1e627b7795 Mon Sep 17 00:00:00 2001
From: bijx <bsamiee@hotmail.com>
Date: Tue, 17 Mar 2026 02:00:23 -0400
Subject: [PATCH] Add slider for player name opacity in UserSettingModal

---
 src/client/UserSettingModal.ts | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/src/client/UserSettingModal.ts b/src/client/UserSettingModal.ts
index cb47ee320..2e54c63f9 100644
--- a/src/client/UserSettingModal.ts
+++ b/src/client/UserSettingModal.ts
@@ -366,6 +366,15 @@ export class UserSettingModal extends BaseModal {
     }
   }
 
+  private sliderPlayerNameOpacity(e: CustomEvent<{ value: number }>) {
+    const value = e.detail?.value;
+    if (typeof value !== "number") {
+      console.warn("Slider event missing detail.value", e);
+      return;
+    }
+    this.userSettings.setPlayerNameOpacity(value);
+  }
+
   private changeAttackRatioIncrement(
     e: CustomEvent<{ value: number | string }>,
   ) {
@@ -921,6 +930,16 @@ export class UserSettingModal extends BaseModal {
         @change=${this.toggleAnonymousNames}
       ></setting-toggle>
 
+      <setting-slider
+        label="${translateText("user_setting.player_name_opacity_label")}"
+        description="${translateText("user_setting.player_name_opacity_desc")}"
+        min="0"
+        max="100"
+        .value=${this.userSettings.playerNameOpacity()}
+        .zeroLabelKey=${"user_setting.hidden"}
+        @change=${this.sliderPlayerNameOpacity}
+      ></setting-slider>
+
       <!-- 👁️ Hidden Lobby IDs -->
       <setting-toggle
         label="${translateText("user_setting.lobby_id_visibility_label")}"