5 files changed, 13 insertions, 9 deletions
diff --git a/src/plugins/apiBadges.tsx b/src/plugins/apiBadges.tsx
index 3fe2f6b..14b548c 100644
--- a/src/plugins/apiBadges.tsx
+++ b/src/plugins/apiBadges.tsx
@@ -24,9 +24,10 @@ import { Heart } from "@components/Heart";
 import { Devs } from "@utils/constants";
 import IpcEvents from "@utils/IpcEvents";
 import Logger from "@utils/Logger";
+import { Margins } from "@utils/margins";
 import { closeModal, Modals, openModal } from "@utils/modal";
 import definePlugin from "@utils/types";
-import { Forms, Margins } from "@webpack/common";
+import { Forms } from "@webpack/common";
 
 const CONTRIBUTOR_BADGE = "https://media.discordapp.net/stickers/1026517526106087454.webp";
 
@@ -150,7 +151,7 @@ export default definePlugin({
                                         <Forms.FormText>
                                             This Badge is a special perk for Vencord Donors
                                         </Forms.FormText>
-                                        <Forms.FormText className={Margins.marginTop20}>
+                                        <Forms.FormText className={Margins.top20}>
                                             Please consider supporting the development of Vencord by becoming a donor. It would mean a lot!!
                                         </Forms.FormText>
                                     </div>
diff --git a/src/plugins/emoteCloner.tsx b/src/plugins/emoteCloner.tsx
index 15d1358..e252fe5 100644
--- a/src/plugins/emoteCloner.tsx
+++ b/src/plugins/emoteCloner.tsx
@@ -20,11 +20,12 @@ import { migratePluginSettings, Settings } from "@api/settings";
 import { CheckedTextInput } from "@components/CheckedTextInput";
 import { Devs } from "@utils/constants";
 import Logger from "@utils/Logger";
+import { Margins } from "@utils/margins";
 import { makeLazy } from "@utils/misc";
 import { ModalContent, ModalHeader, ModalRoot, openModal } from "@utils/modal";
 import definePlugin from "@utils/types";
 import { findByCodeLazy, findByPropsLazy } from "@webpack";
-import { Forms, GuildStore, Margins, Menu, PermissionStore, React, Toasts, Tooltip, UserStore } from "@webpack/common";
+import { Forms, GuildStore, Menu, PermissionStore, React, Toasts, Tooltip, UserStore } from "@webpack/common";
 
 const MANAGE_EMOJIS_AND_STICKERS = 1n << 30n;
 
@@ -96,7 +97,7 @@ function CloneModal({ id, name: emojiName, isAnimated }: { id: string; name: str
 
     return (
         <>
-            <Forms.FormTitle className={Margins.marginTop20}>Custom Name</Forms.FormTitle>
+            <Forms.FormTitle className={Margins.top20}>Custom Name</Forms.FormTitle>
             <CheckedTextInput
                 value={name}
                 onChange={setName}
diff --git a/src/plugins/typingTweaks.tsx b/src/plugins/typingTweaks.tsx
index 47b6978..c3f8f87 100644
--- a/src/plugins/typingTweaks.tsx
+++ b/src/plugins/typingTweaks.tsx
@@ -105,7 +105,7 @@ export default definePlugin({
         }}>
             {settings.store.showAvatars && <div style={{ marginTop: "4px" }}>
                 <Avatar
-                    size={Avatar.Sizes.SIZE_16}
+                    size="SIZE_16"
                     src={user.getAvatarURL(guildId, 128)} />
             </div>}
             {GuildMemberStore.getNick(guildId!, user.id) || !guildId && RelationshipStore.getNickname(user.id) || user.username}
diff --git a/src/plugins/vcNarrator.tsx b/src/plugins/vcNarrator.tsx
index b2904ac..7a06fe9 100644
--- a/src/plugins/vcNarrator.tsx
+++ b/src/plugins/vcNarrator.tsx
@@ -20,10 +20,11 @@ import { Settings } from "@api/settings";
 import { ErrorCard } from "@components/ErrorCard";
 import { Devs } from "@utils/constants";
 import Logger from "@utils/Logger";
+import { Margins } from "@utils/margins";
 import { wordsToTitle } from "@utils/text";
 import definePlugin, { OptionType, PluginOptionsItem } from "@utils/types";
 import { findByPropsLazy } from "@webpack";
-import { Button, ChannelStore, FluxDispatcher, Forms, Margins, SelectedChannelStore, useMemo, UserStore } from "@webpack/common";
+import { Button, ChannelStore, FluxDispatcher, Forms, SelectedChannelStore, useMemo, UserStore } from "@webpack/common";
 
 interface VoiceState {
     userId: string;
@@ -304,7 +305,7 @@ export default definePlugin({
                 </Forms.FormText>
                 {hasEnglishVoices && (
                     <>
-                        <Forms.FormTitle className={Margins.marginTop20} tag="h3">Play Example Sounds</Forms.FormTitle>
+                        <Forms.FormTitle className={Margins.top20} tag="h3">Play Example Sounds</Forms.FormTitle>
                         <div
                             style={{
                                 display: "grid",
diff --git a/src/plugins/viewRaw.tsx b/src/plugins/viewRaw.tsx
index 5105203..e0e3c9b 100644
--- a/src/plugins/viewRaw.tsx
+++ b/src/plugins/viewRaw.tsx
@@ -20,10 +20,11 @@ import { addButton, removeButton } from "@api/MessagePopover";
 import ErrorBoundary from "@components/ErrorBoundary";
 import { Flex } from "@components/Flex";
 import { Devs } from "@utils/constants";
+import { Margins } from "@utils/margins";
 import { copyWithToast } from "@utils/misc";
 import { closeModal, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalRoot, ModalSize, openModal } from "@utils/modal";
 import definePlugin from "@utils/types";
-import { Button, ChannelStore, Forms, Margins, Parser, Text } from "@webpack/common";
+import { Button, ChannelStore, Forms, Parser, Text } from "@webpack/common";
 import { Message } from "discord-types/general";
 
 
@@ -98,7 +99,7 @@ function openViewRawModal(msg: Message) {
                             <>
                                 <Forms.FormTitle tag="h5">Content</Forms.FormTitle>
                                 <CodeBlock content={msg.content} lang="" />
-                                <Forms.FormDivider className={Margins.marginBottom20} />
+                                <Forms.FormDivider className={Margins.bottom20} />
                             </>
                         )}