fix badge css

manifest.json

@@ -7,7 +7,7 @@
     "discordID": "499400512559382538",
     "github": "12944qwerty"
   },
-  "version": "1.0.2",
+  "version": "1.0.3",
   "updater": {
     "type": "github",
     "id": "qwerty-mods/badges-everywhere"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "badges-everywhere",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "description": "Puts a user's badges in other places.",
   "engines": {
     "node": ">=14.0.0"

scripts/build.ts

@@ -1,13 +1,13 @@
 import esbuild from "esbuild";
 import path, { join } from "path";
-import fs, { existsSync, rmSync } from "fs";
+import { cpSync, existsSync, mkdirSync, rmSync, writeFileSync } from "fs";
 import _manifest from "../manifest.json";
 import { PluginManifest } from "replugged/dist/types/addon";
 
 const manifest: PluginManifest = _manifest;
-
-const NODE_VERSION = "14";
+const watch = process.argv.includes("--watch");
 const CHROME_VERSION = "91";
+const REPLUGGED_FOLDER_NAME = "replugged";
 
 const globalModules: esbuild.Plugin = {
   name: "globalModules",
@@ -47,7 +47,6 @@ const globalModules: esbuild.Plugin = {
   },
 };
 
-const REPLUGGED_FOLDER_NAME = "replugged";
 export const CONFIG_PATH = (() => {
   switch (process.platform) {
     case "win32":
@@ -66,29 +65,27 @@ const install: esbuild.Plugin = {
   name: "install",
   setup: (build) => {
     build.onEnd(() => {
-      if (!process.env.NO_INSTALL) {
+      if (!process.argv.includes("--no-install")) {
         const dest = join(CONFIG_PATH, "plugins", manifest.id);
-        if (existsSync(dest)) {
-          rmSync(dest, { recursive: true });
-        }
-        fs.cpSync("dist", dest, { recursive: true });
+        if (existsSync(dest)) rmSync(dest, { recursive: true });
+        cpSync("dist", dest, { recursive: true });
         console.log("Installed updated version");
       }
     });
   },
 };
 
-const watch = process.argv.includes("--watch");
-
 const common: esbuild.BuildOptions = {
   absWorkingDir: path.join(__dirname, ".."),
   bundle: true,
+  format: "esm" as esbuild.Format,
+  logLevel: "info",
   minify: false,
+  platform: "browser",
+  plugins: [globalModules, install],
   sourcemap: true,
-  format: "cjs" as esbuild.Format,
-  logLevel: "info",
+  target: `chrome${CHROME_VERSION}`,
   watch,
-  plugins: [install],
 };
 
 const targets = [];
@@ -98,67 +95,27 @@ if ("renderer" in manifest) {
     esbuild.build({
       ...common,
       entryPoints: [manifest.renderer],
-      platform: "browser",
-      target: `chrome${CHROME_VERSION}`,
       outfile: "dist/renderer.js",
-      format: "esm" as esbuild.Format,
-      plugins: [globalModules, install],
     }),
   );
 
   manifest.renderer = "renderer.js";
 }
 
-if ("preload" in manifest) {
-  targets.push(
-    esbuild.build({
-      ...common,
-      entryPoints: [manifest.preload],
-      platform: "node",
-      target: [`node${NODE_VERSION}`, `chrome${CHROME_VERSION}`],
-      outfile: "dist/preload.js",
-      external: ["electron"],
-    }),
-  );
-
-  manifest.preload = "preload.js";
-}
-
-if ("main" in manifest) {
-  targets.push(
-    esbuild.build({
-      ...common,
-      entryPoints: [manifest.main],
-      platform: "node",
-      target: `node${NODE_VERSION}`,
-      outfile: "dist/main.js",
-      external: ["electron"],
-    }),
-  );
-
-  manifest.main = "main.js";
-}
-
 if ("plaintextPatches" in manifest) {
   targets.push(
     esbuild.build({
       ...common,
       entryPoints: [manifest.plaintextPatches],
-      platform: "browser",
-      target: `chrome${CHROME_VERSION}`,
       outfile: "dist/plaintextPatches.js",
-      format: "esm" as esbuild.Format,
-      plugins: [globalModules, install],
     }),
   );
 
   manifest.plaintextPatches = "plaintextPatches.js";
 }
 
-if (!fs.existsSync("dist")) {
-  fs.mkdirSync("dist");
-}
+if (!existsSync("dist")) mkdirSync("dist");
 
-fs.writeFileSync("dist/manifest.json", JSON.stringify(manifest));
+writeFileSync("dist/manifest.json", JSON.stringify(manifest));
 
 Promise.all(targets);

src/Badges.tsx

@@ -46,7 +46,7 @@ const UserFlags = webpack.getExportsForProps(constants, [
   "ACTIVE_DEVELOPER",
   "HYPESQUAD_ONLINE_HOUSE_1",
 ]) as userFlags;
-const { profileBadge18 } = webpack.getByProps("profileBadge18") as Record<string, string>;
+const { profileBadge24 } = webpack.getByProps("profileBadge24") as Record<string, string>;
 
 export function badge(
   args: { kind: string; param?: number | string },
@@ -115,7 +115,7 @@ export function badge(
   return (
     <components.Tooltip text={tooltip!}>
       <span role="button" tabIndex={0}>
-        <img alt="" src={asset!} className={profileBadge18} />
+        <img alt="" src={asset!} className={profileBadge24} />
       </span>
     </components.Tooltip>
   );
@@ -160,6 +160,18 @@ export default function Badges(Messages: {}) {
       premium && { kind: "boosting", param: premium.premiumGuildSince },
     ].filter(Boolean);
 
-    return <div className="badges">{badges.map((b) => b && badge(b, Messages))}</div>;
+    return (
+      <div
+        className="badges"
+        style={{
+          display: "inline-flex",
+          alignItems: "center",
+          verticalAlign: "top",
+          position: "relative",
+          top: "-1px",
+        }}>
+        {badges.map((b) => b && badge(b, Messages))}
+      </div>
+    );
   };
 }

src/index.ts

@@ -1,6 +1,5 @@
 import { Injector, common, webpack } from "replugged";
 import { Channel, Message, User } from "discord-types/general";
-import "./styles.css";
 const { React } = common;
 
 import badges from "./Badges";