Fix Patches + Update Contrib Card

src/components/settings/DonateButton.tsx

@@ -18,6 +18,7 @@
 
 import { Button } from "@components/Button";
 import { Heart } from "@components/Heart";
+import { OpenExternalIcon } from "@components/Icons";
 import { openInviteModal } from "@utils/discord";
 import { ButtonProps } from "@vencord/discord-types";
 import { showToast } from "@webpack/common";
@@ -48,7 +49,7 @@ export function InviteButton({
     return (
         <Button
             {...props}
-            variant="link"
+            variant="none"
             size="medium"
             type="button"
             onClick={async e => {
@@ -57,9 +58,10 @@ export function InviteButton({
                     showToast("Invalid or expired invite"),
                 );
             }}
-            className="vc-donate-button"
+            className="vc-invite-button"
         >
             Invite
+            <OpenExternalIcon className="vc-invite-link" />
         </Button>
     );
 }

src/components/settings/SpecialCard.css

@@ -1,13 +1,38 @@
+.vc-contrib-button,
+.vc-invite-button,
 .vc-donate-button {
     overflow: visible !important;
+}
+
+.vc-invite-link {
+    width: 16px;
+    height: 16px;
+    margin-left: 8px;
+    flex-shrink: 0;
+}
+
+.vc-contrib-button {
+    overflow: visible !important;
+    margin-top: 1em;
     color: black;
 }
 
+.vc-contrib-github {
+    width: 24px;
+    height: 24px;
+    flex-shrink: 0;
+    transition: transform 0.3s;
+}
+
+.vc-invite-button .vc-invite-link,
+.vc-contrib-button .vc-contrib-github,
 .vc-donate-button .vc-heart-icon {
     transition: transform 0.3s;
     margin-right: 0.5em;
 }
 
+.vc-invite-button:hover .vc-invite-link,
+.vc-contrib-github:hover .vc-contrib-github,
 .vc-donate-button:hover .vc-heart-icon {
     transform: scale(1.1);
     z-index: 10;

src/components/settings/tabs/vencord/DonateButton.tsx

@@ -4,7 +4,8 @@
  * SPDX-License-Identifier: GPL-3.0-or-later
  */
 
-import { DonateButton } from "@components/settings/DonateButton";
+import { Flex } from "@components/Flex";
+import { DonateButton, InviteButton } from "@components/settings/DonateButton";
 import BadgeAPI from "@plugins/_api/badges";
 import { DONOR_ROLE_ID, VC_GUILD_ID } from "@utils/constants";
 import { GuildMemberStore } from "@webpack/common";
@@ -16,8 +17,12 @@ export const isDonor = (userId: string) => !!(
 
 export function DonateButtonComponent() {
     return (
-        <DonateButton
-            style={{ marginTop: "1em" }}
-        />
+        <Flex>
+            <DonateButton
+                equicord={true}
+                style={{ marginTop: "1em", color: "black" }} />
+            <InviteButton
+                style={{ marginTop: "1em", color: "black" }} />
+        </Flex>
     );
 }

src/components/settings/tabs/vencord/index.tsx

@@ -17,7 +17,7 @@ import { FormSwitch } from "@components/FormSwitch";
 import { Heading } from "@components/Heading";
 import { FolderIcon, GithubIcon, LogIcon, PaintbrushIcon, RestartIcon } from "@components/Icons";
 import { Paragraph } from "@components/Paragraph";
-import { DonateButton, InviteButton, openContributorModal, openPluginModal, SettingsTab, wrapTab } from "@components/settings";
+import { openContributorModal, openPluginModal, SettingsTab, wrapTab } from "@components/settings";
 import { QuickAction, QuickActionCard } from "@components/settings/QuickAction";
 import { SpecialCard } from "@components/settings/SpecialCard";
 import { gitRemote } from "@shared/vencordUserAgent";
@@ -28,6 +28,7 @@ import { relaunch } from "@utils/native";
 import { GuildMemberStore, React, Select, UserStore } from "@webpack/common";
 import BadgeAPI from "plugins/_api/badges";
 
+import { DonateButtonComponent } from "./DonateButton";
 import { openNotificationSettingsModal } from "./NotificationSettings";
 
 const DEFAULT_DONATE_IMAGE = "https://cdn.discordapp.com/emojis/1026533090627174460.png";
@@ -156,9 +157,18 @@ function EquicordSettings() {
                     cardImage={COZY_CONTRIB_IMAGE}
                     backgroundImage={CONTRIB_BACKGROUND_IMAGE}
                     backgroundColor="#EDCC87"
-                    buttonTitle="See what you've contributed to"
-                    buttonOnClick={() => openContributorModal(user)}
-                />
+                >
+                    <Button
+                        variant="none"
+                        size="medium"
+                        type="button"
+                        onClick={() => openContributorModal(user)}
+                        className="vc-contrib-button"
+                    >
+                        <GithubIcon aria-hidden fill={"#000000"} className={"vc-contrib-github"} />
+                        See what you've contributed to
+                    </Button>
+                </SpecialCard>
             )}
 
             <section>
@@ -330,18 +340,6 @@ function EquicordSettings() {
     );
 }
 
-function DonateButtonComponent() {
-    return (
-        <Flex>
-            <DonateButton
-                equicord={true}
-                style={{ marginTop: "1em" }} />
-            <InviteButton
-                style={{ marginTop: "1em" }} />
-        </Flex>
-    );
-}
-
 export default wrapTab(EquicordSettings, "Equicord Settings");
 
 export function isEquicordDonor(userId: string): boolean {

src/plugins/_api/badges/modals.tsx

@@ -57,7 +57,7 @@ export function VencordDonorModal() {
                 </ModalContent>
                 <ModalFooter>
                     <Flex justifyContent="center" style={{ width: "100%" }}>
-                        <DonateButton />
+                        <DonateButton style={{ color: "var(--text-default)" }} />
                     </Flex>
                 </ModalFooter>
             </ModalRoot>
@@ -113,7 +113,7 @@ export function EquicordDonorModal() {
                 </ModalContent>
                 <ModalFooter>
                     <Flex justifyContent="center" style={{ width: "100%" }}>
-                        <DonateButton equicord={true} />
+                        <DonateButton equicord={true} style={{ color: "var(--text-default)" }} />
                     </Flex>
                 </ModalFooter>
             </ModalRoot>

src/plugins/roleColorEverywhere/index.tsx

@@ -135,7 +135,7 @@ export default definePlugin({
         },
         // Reaction List
         {
-            find: ".reactorDefault",
+            find: ".tagFaded:null",
             replacement: {
                 match: /tag:"strong"(?=.{0,50}\i\.name)(?<=onContextMenu:.{0,15}\((\i),(\i),\i\).+?)/,
                 replace: "$&,style:$self.getColorStyle($2?.id,$1?.channel?.id)"

src/plugins/showMeYourName/index.tsx

@@ -1016,7 +1016,7 @@ export default definePlugin({
                 },
                 {
                     // Track hovering over reaction popouts.
-                    match: /(return\(0,\i.\i\)\(\i.\i,{className:\i.reactorDefault,)(onContextMenu)/,
+                    match: /(return\(0,\i.\i\)\(\i.\i,{className:\i.reactor,)(onContextMenu)/,
                     replace: "$1onMouseEnter:()=>{$self.addHoveringReactionPopout(arguments[0].user.id)},onMouseLeave:()=>{$self.removeHoveringReactionPopout(arguments[0].user.id)},$2"
                 }
             ]