diff --git a/src/plugins/userVoiceShow/components.tsx b/src/plugins/userVoiceShow/components.tsx index 792a0f314..593a3124c 100644 --- a/src/plugins/userVoiceShow/components.tsx +++ b/src/plugins/userVoiceShow/components.tsx @@ -7,7 +7,7 @@ import { classNameFactory } from "@api/Styles"; import ErrorBoundary from "@components/ErrorBoundary"; import { classes } from "@utils/misc"; -import { filters, findByCode, findComponentByCode, findProp, findStore, mapMangledModule } from "@webpack"; +import { filters, findByCode, findByProps, findComponentByCode, findProp, findStore, mapMangledModule } from "@webpack"; import { ChannelRouter, ChannelStore, GuildStore, IconUtils, match, P, PermissionsBits, PermissionStore, React, showToast, Text, Toasts, Tooltip, useMemo, UserStore, useStateFromStores } from "@webpack/common"; import { Channel } from "discord-types/general"; @@ -24,6 +24,8 @@ const UserSummaryItem = findComponentByCode("defaultRenderUser", "showDefaultAva const Avatar = findComponentByCode(".AVATAR_STATUS_TYPING_16;"); const GroupDMAvatars = findComponentByCode(".AvatarSizeSpecs[", "getAvatarURL"); +const ActionButtonClasses = findByProps("actionButton", "highlight"); + interface IconProps extends React.ComponentPropsWithoutRef<"div"> { size?: number; } @@ -182,7 +184,7 @@ export const VoiceChannelIndicator = ErrorBoundary.wrap(({ userId, isActionButto {props => { const iconProps: IconProps = { ...props, - className: classes(isActionButton ? cl("indicator-action-button") : cl("speaker-padding"), isMessageIndicator && cl("message-indicator"), shouldHighlight && cl("highlight")), + className: classes(isActionButton ? ActionButtonClasses.actionButton : cl("speaker-padding"), isMessageIndicator && cl("message-indicator"), shouldHighlight && ActionButtonClasses.highlight), size: isActionButton ? 20 : undefined, onClick }; diff --git a/src/plugins/userVoiceShow/style.css b/src/plugins/userVoiceShow/style.css index 39253f210..eba39cacb 100644 --- a/src/plugins/userVoiceShow/style.css +++ b/src/plugins/userVoiceShow/style.css @@ -23,18 +23,6 @@ position: relative; } -.vc-uvs-indicator-action-button { - background-color: var(--background-secondary); - border-radius: 100%; - height: 36px; - width: 36px; - margin-left: 10px; -} - -.vc-uvs-indicator-action-button.vc-uvs-highlight { - background-color: var(--background-tertiary); -} - .vc-uvs-tooltip-container { max-width: 300px; }