UserScript: disable theme ui, instead recommend Stylus

This commit is contained in:
Vendicated 2025-06-07 00:06:01 +02:00
parent fae15dbdfe
commit c19827a0e5
No known key found for this signature in database
GPG key ID: D66986BAF75ECF18
7 changed files with 48 additions and 10 deletions

View file

@ -20,16 +20,13 @@
/// <reference path="../src/globals.d.ts" />
import monacoHtmlLocal from "file://monacoWin.html?minify";
import monacoHtmlCdn from "file://../src/main/monacoWin.html?minify";
import * as DataStore from "../src/api/DataStore";
import { debounce } from "../src/utils";
import { debounce, localStorage } from "../src/utils";
import { EXTENSION_BASE_URL } from "../src/utils/web-metadata";
import { getTheme, Theme } from "../src/utils/discord";
import { getThemeInfo } from "../src/main/themes";
import { Settings } from "../src/Vencord";
// Discord deletes this so need to store in variable
const { localStorage } = window;
import { getStylusWebStoreUrl } from "@utils/web";
// listeners for ipc.on
const cssListeners = new Set<(css: string) => void>();
@ -77,6 +74,14 @@ window.VencordNative = {
addThemeChangeListener: NOOP,
openFile: NOOP_ASYNC,
async openEditor() {
if (IS_USERSCRIPT) {
const shouldOpenWebStore = confirm("QuickCSS is not supported on the Userscript. You can instead use the Stylus extension.\n\nDo you want to open the Stylus web store page?");
if (shouldOpenWebStore) {
window.open(getStylusWebStoreUrl(), "_blank");
}
return;
}
const features = `popup,width=${Math.min(window.innerWidth, 1000)},height=${Math.min(window.innerHeight, 1000)}`;
const win = open("about:blank", "VencordQuickCss", features);
if (!win) {
@ -92,7 +97,7 @@ window.VencordNative = {
? "vs-light"
: "vs-dark";
win.document.write(IS_EXTENSION ? monacoHtmlLocal : monacoHtmlCdn);
win.document.write(monacoHtmlLocal);
},
},

View file

@ -31,6 +31,7 @@ const defines = stringifyValues({
IS_UPDATER_DISABLED,
IS_WEB: false,
IS_EXTENSION: false,
IS_USERSCRIPT: false,
VERSION,
BUILD_TIMESTAMP
});

View file

@ -43,6 +43,7 @@ const commonOptions = {
define: stringifyValues({
IS_WEB: true,
IS_EXTENSION: false,
IS_USERSCRIPT: false,
IS_STANDALONE: true,
IS_DEV,
IS_REPORTER,
@ -98,6 +99,7 @@ const buildConfigs = [
inject: ["browser/GMPolyfill.js", ...(commonOptions?.inject || [])],
define: {
...commonOptions.define,
IS_USERSCRIPT: "true",
window: "unsafeWindow",
},
outfile: "dist/Vencord.user.js",

View file

@ -30,6 +30,7 @@ import { Margins } from "@utils/margins";
import { classes } from "@utils/misc";
import { showItemInFolder } from "@utils/native";
import { useAwaiter } from "@utils/react";
import { getStylusWebStoreUrl } from "@utils/web";
import { findLazy } from "@webpack";
import { Card, Forms, React, showToast, TabBar, TextArea, useEffect, useRef, useState } from "@webpack/common";
import type { ComponentType, Ref, SyntheticEvent } from "react";
@ -384,4 +385,20 @@ export function CspErrorCard() {
);
}
export default wrapTab(ThemesTab, "Themes");
function UserscriptThemesTab() {
return (
<SettingsTab title="Themes">
<Card className="vc-settings-card">
<Forms.FormTitle tag="h5">Themes are not supported on the Userscript!</Forms.FormTitle>
<Forms.FormText>
You can instead install themes with the <Link href={getStylusWebStoreUrl()}>Stylus extension</Link>!
</Forms.FormText>
</Card>
</SettingsTab>
);
}
export default IS_USERSCRIPT
? wrapTab(UserscriptThemesTab, "Themes")
: wrapTab(ThemesTab, "Themes");

3
src/globals.d.ts vendored
View file

@ -29,11 +29,12 @@ declare global {
* replace: "IS_WEB?foo:bar"
* // GOOD
* replace: IS_WEB ? "foo" : "bar"
* // also good
* // also okay
* replace: `${IS_WEB}?foo:bar`
*/
export var IS_WEB: boolean;
export var IS_EXTENSION: boolean;
export var IS_USERSCRIPT: boolean;
export var IS_STANDALONE: boolean;
export var IS_UPDATER_DISABLED: boolean;
export var IS_DEV: boolean;

View file

@ -39,7 +39,7 @@ async function initSystemValues() {
createStyle("vencord-os-theme-values").textContent = `:root{${variables}}`;
}
export async function toggle(isEnabled: boolean) {
async function toggle(isEnabled: boolean) {
if (!style) {
if (isEnabled) {
style = createStyle("vencord-custom-css");
@ -91,6 +91,8 @@ async function initThemes() {
}
document.addEventListener("DOMContentLoaded", () => {
if (IS_USERSCRIPT) return;
initSystemValues();
initThemes();
@ -103,9 +105,11 @@ document.addEventListener("DOMContentLoaded", () => {
if (!IS_WEB) {
VencordNative.quickCss.addThemeChangeListener(initThemes);
}
});
}, { once: true });
export function initQuickCssThemeStore() {
if (IS_USERSCRIPT) return;
initThemes();
let currentTheme = ThemeStore.theme;

View file

@ -53,3 +53,11 @@ export function chooseFile(mimeTypes: string) {
setImmediate(() => document.body.removeChild(input));
});
}
export function getStylusWebStoreUrl() {
const isChromium = (navigator as any).userAgentData?.brands?.some(b => b.brand === "Chromium");
return isChromium
? "https://chromewebstore.google.com/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne"
: "https://addons.mozilla.org/firefox/addon/styl-us/";
}