diff --git a/scripts/build/buildWeb.mjs b/scripts/build/buildWeb.mjs
index deab86610..4602661d0 100644
--- a/scripts/build/buildWeb.mjs
+++ b/scripts/build/buildWeb.mjs
@@ -187,11 +187,9 @@ async function buildExtension(target, files) {
const appendCssRuntime = readFile("dist/Vencord.user.css", "utf-8").then(content => {
const cssRuntime = `
-;document.addEventListener("DOMContentLoaded", () => document.documentElement.appendChild(
- Object.assign(document.createElement("style"), {
- textContent: \`${content.replaceAll("`", "\\`")}\`,
- id: "vencord-css-core"
- })
+;document.addEventListener("DOMContentLoaded", () => Vencord.Api.Styles.createStyle(
+ "vencord-css-core",
+ \`${content.replaceAll("`", "\\`")}\`
), { once: true });
`;
diff --git a/src/Vencord.ts b/src/Vencord.ts
index c4c6d4705..304394974 100644
--- a/src/Vencord.ts
+++ b/src/Vencord.ts
@@ -28,6 +28,7 @@ export { PlainSettings, Settings };
import "./utils/quickCss";
import "./webpack/patchWebpack";
+import { createStyle } from "@api/Styles";
import { openUpdaterModal } from "@components/VencordSettings/UpdaterTab";
import { StartAt } from "@utils/types";
@@ -142,9 +143,6 @@ document.addEventListener("DOMContentLoaded", () => {
startAllPlugins(StartAt.DOMContentLoaded);
if (IS_DISCORD_DESKTOP && Settings.winNativeTitleBar && navigator.platform.toLowerCase().startsWith("win")) {
- document.head.append(Object.assign(document.createElement("style"), {
- id: "vencord-native-titlebar-style",
- textContent: "[class*=titleBar]{display: none!important}"
- }));
+ createStyle("vencord-native-titlebar-style", "[class*=titleBar]{display: none!important}");
}
}, { once: true });
diff --git a/src/preload.ts b/src/preload.ts
index e79eb02cc..23ccd3fbc 100644
--- a/src/preload.ts
+++ b/src/preload.ts
@@ -16,6 +16,7 @@
* along with this program. If not, see .
*/
+import { createStyle } from "@api/Styles";
import { debounce } from "@shared/debounce";
import { contextBridge, webFrame } from "electron";
import { readFileSync, watch } from "fs";
@@ -30,14 +31,12 @@ if (location.protocol !== "data:") {
// #region cssInsert
const rendererCss = join(__dirname, IS_VESKTOP ? "vencordDesktopRenderer.css" : "renderer.css");
- const style = document.createElement("style");
- style.id = "vencord-css-core";
- style.textContent = readFileSync(rendererCss, "utf-8");
+ const injectStyle = () => createStyle("vencord-css-core", readFileSync(rendererCss, "utf-8"));
if (document.readyState === "complete") {
- document.documentElement.appendChild(style);
+ injectStyle();
} else {
- document.addEventListener("DOMContentLoaded", () => document.documentElement.appendChild(style), {
+ document.addEventListener("DOMContentLoaded", injectStyle, {
once: true
});
}
@@ -45,9 +44,7 @@ if (location.protocol !== "data:") {
if (IS_DEV) {
// persistent means keep process running if watcher is the only thing still running
// which we obviously don't want
- watch(rendererCss, { persistent: false }, () => {
- document.getElementById("vencord-css-core")!.textContent = readFileSync(rendererCss, "utf-8");
- });
+ watch(rendererCss, { persistent: false }, injectStyle);
}
// #endregion
diff --git a/src/webpack/common/stores.ts b/src/webpack/common/stores.ts
index 8579f8b92..82a1ab608 100644
--- a/src/webpack/common/stores.ts
+++ b/src/webpack/common/stores.ts
@@ -56,6 +56,7 @@ export let EmojiStore: t.EmojiStore;
export let ThemeStore: t.ThemeStore;
export let WindowStore: t.WindowStore;
export let DraftStore: t.DraftStore;
+export let PopoutWindowStore: t.PopoutWindowStore;
/**
* React hook that returns stateful data for one or more stores
@@ -86,3 +87,4 @@ waitForStore("MessageStore", m => MessageStore = m);
waitForStore("WindowStore", m => WindowStore = m);
waitForStore("EmojiStore", m => EmojiStore = m);
waitForStore("ThemeStore", m => ThemeStore = m);
+waitForStore("PopoutWindowStore", m => PopoutWindowStore = m);
diff --git a/src/webpack/common/types/stores.d.ts b/src/webpack/common/types/stores.d.ts
index 9ca7dfc94..90c08aca0 100644
--- a/src/webpack/common/types/stores.d.ts
+++ b/src/webpack/common/types/stores.d.ts
@@ -228,6 +228,11 @@ export class ThemeStore extends FluxStore {
systemTheme: null;
}
+export class PopoutWindowStore extends FluxStore {
+ getWindow(windowKey: string): Window;
+ getWindowKeys(): string[];
+}
+
export type useStateFromStores = (
stores: t.FluxStore[],
mapper: () => T,