feat: add splash window theming (#52)

Co-authored-by: V <vendicated@riseup.net>

src/main/mainWindow.ts

@@ -11,6 +11,7 @@ import {
     dialog,
     Menu,
     MenuItemConstructorOptions,
+    nativeTheme,
     Tray
 } from "electron";
 import { rm } from "fs/promises";
@@ -341,7 +342,9 @@ function createMainWindow() {
     removeSettingsListeners();
     removeVencordSettingsListeners();
 
-    const { staticTitle, transparencyOption, enableMenu, discordWindowsTitleBar } = Settings.store;
+    const { staticTitle, transparencyOption, splashTheming, splashBackground, enableMenu, discordWindowsTitleBar } =
+        Settings.store;
+
     const { frameless, macosTranslucency } = VencordSettings.store;
 
     const noFrame = frameless === true || (process.platform === "win32" && discordWindowsTitleBar === true);
@@ -361,7 +364,7 @@ function createMainWindow() {
         ...(transparencyOption && transparencyOption !== "none"
             ? {
                   backgroundColor: "#00000000",
-                  backgroundMaterial: Settings.store.transparencyOption,
+                  backgroundMaterial: transparencyOption,
                   transparent: true
               }
             : {}),
@@ -371,7 +374,14 @@ function createMainWindow() {
                   vibrancy: "sidebar",
                   backgroundColor: "#ffffff00"
               }
-            : {}),
+            : {
+                  backgroundColor: splashTheming
+                      ? splashBackground
+                      : nativeTheme.shouldUseDarkColors
+                      ? "#313338"
+                      : "#ffffff",
+                  transparent: false
+              }),
         ...(process.platform === "darwin" ? { titleBarStyle: "hiddenInset" } : {}),
         ...getWindowBoundsOptions(),
         autoHideMenuBar: enableMenu

src/main/splash.ts

@@ -9,6 +9,8 @@ import { join } from "path";
 import { SplashProps } from "shared/browserWinProperties";
 import { ICON_PATH, VIEW_DIR } from "shared/paths";
 
+import { Settings } from "./settings";
+
 export function createSplashWindow() {
     const splash = new BrowserWindow({
         ...SplashProps,
@@ -17,5 +19,20 @@ export function createSplashWindow() {
 
     splash.loadFile(join(VIEW_DIR, "splash.html"));
 
+    const { splashBackground, splashColor, splashTheming } = Settings.store;
+
+    if (splashTheming) {
+        if (splashColor) {
+            const semiTransparentSplashColor = splashColor.replace("rgb(", "rgba(").replace(")", ", 0.2)");
+
+            splash.webContents.insertCSS(`body { --fg: ${splashColor} !important }`);
+            splash.webContents.insertCSS(`body { --fg-semi-trans: ${semiTransparentSplashColor} !important }`);
+        }
+
+        if (splashBackground) {
+            splash.webContents.insertCSS(`body { --bg: ${splashBackground} !important }`);
+        }
+    }
+
     return splash;
 }