From 32b463059bd2d58509b34a19ce1eeed680051d62 Mon Sep 17 00:00:00 2001
From: theo <contact@imtheo.lol>
Date: Mon, 17 Aug 2026 21:20:25 +0100
Subject: [PATCH] UserVoiceShow: fix visual issues (#4457)

---
 src/plugins/userVoiceShow/components.tsx | 5 +++--
 src/plugins/userVoiceShow/index.tsx      | 6 +++---
 src/plugins/userVoiceShow/style.css      | 3 ++-
 3 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/plugins/userVoiceShow/components.tsx b/src/plugins/userVoiceShow/components.tsx
index 71c7e9b08..3da84a7af 100644
--- a/src/plugins/userVoiceShow/components.tsx
+++ b/src/plugins/userVoiceShow/components.tsx
@@ -116,13 +116,14 @@ function VoiceChannelTooltip({ channel, isLocked }: VoiceChannelTooltipProps) {
 export interface VoiceChannelIndicatorProps {
     userId: string;
     isProfile?: boolean;
+    isMessage?: boolean;
     isActionButton?: boolean;
     shouldHighlight?: boolean;
 }
 
 const clickTimers = new Map<string, any>();
 
-export const VoiceChannelIndicator = ErrorBoundary.wrap(({ userId, isProfile, isActionButton, shouldHighlight }: VoiceChannelIndicatorProps) => {
+export const VoiceChannelIndicator = ErrorBoundary.wrap(({ userId, isProfile, isMessage, isActionButton, shouldHighlight }: VoiceChannelIndicatorProps) => {
     const channelId = useStateFromStores([VoiceStateStore], () => VoiceStateStore.getVoiceStateForUser(userId)?.channelId);
 
     const { isMuted, isDeaf } = useStateFromStores([VoiceStateStore], () => {
@@ -192,7 +193,7 @@ export const VoiceChannelIndicator = ErrorBoundary.wrap(({ userId, isProfile, is
                         isActionButton && shouldHighlight && ActionButtonClasses.highlight,
                         cl(isProfile && "profile-speaker")
                     )}
-                    size={isActionButton ? 20 : 16}
+                    size={(isActionButton || isMessage) ? 20 : 16}
                 />
             )}
         </Tooltip>
diff --git a/src/plugins/userVoiceShow/index.tsx b/src/plugins/userVoiceShow/index.tsx
index 2d05c2588..81f81ff49 100644
--- a/src/plugins/userVoiceShow/index.tsx
+++ b/src/plugins/userVoiceShow/index.tsx
@@ -60,8 +60,8 @@ export default definePlugin({
         {
             find: "#{intl::USER_PROFILE_PRONOUNS}",
             replacement: {
-                match: /(?<=children:\[\i," ",\i)(?=\])/,
-                replace: ",$self.VoiceChannelIndicator({userId:arguments[0]?.user?.id,isProfile:true})"
+                match: /(user:(\i).{0,100}onClickDisplayName:\i,trailing:)(\i)/,
+                replace: "$1[$self.VoiceChannelIndicator({userId:$2.id,isProfile:true}),$3]"
             },
             predicate: () => settings.store.showInUserProfileModal
         },
@@ -100,7 +100,7 @@ export default definePlugin({
             addMemberListDecorator("UserVoiceShow", ({ user }) => user == null ? null : <VoiceChannelIndicator userId={user.id} />);
         }
         if (settings.store.showInMessages) {
-            addMessageDecoration("UserVoiceShow", ({ message }) => message?.author == null ? null : <VoiceChannelIndicator userId={message.author.id} />);
+            addMessageDecoration("UserVoiceShow", ({ message }) => message?.author == null ? null : <VoiceChannelIndicator userId={message.author.id} isMessage={true} />);
         }
     },
 
diff --git a/src/plugins/userVoiceShow/style.css b/src/plugins/userVoiceShow/style.css
index 6ee5fd7a0..855d0c4c5 100644
--- a/src/plugins/userVoiceShow/style.css
+++ b/src/plugins/userVoiceShow/style.css
@@ -14,8 +14,9 @@
 }
 
 .vc-uvs-profile-speaker {
-    width: var(--custom-nickname-icon-size);
     height: var(--custom-nickname-icon-size);
+    margin-right: 4px;
+    transform: translateY(1.3px);
 }
 
 .vc-uvs-tooltip-container {