add support for button backgrounds
This commit is contained in:
parent
186066d791
commit
9126806628
4 changed files with 24 additions and 4 deletions
|
@ -12,7 +12,7 @@ import { ICON_PATH, VIEW_DIR } from "shared/paths";
|
||||||
import { Settings } from "./settings";
|
import { Settings } from "./settings";
|
||||||
|
|
||||||
export function patchVencordView(view: BrowserWindow) {
|
export function patchVencordView(view: BrowserWindow) {
|
||||||
const { splashBackground, splashColor, splashTheming } = Settings.store;
|
const { splashBackground, splashColor, splashTheming, splashPositive, splashDanger } = Settings.store;
|
||||||
|
|
||||||
if (splashTheming) {
|
if (splashTheming) {
|
||||||
if (splashColor) {
|
if (splashColor) {
|
||||||
|
@ -25,6 +25,13 @@ export function patchVencordView(view: BrowserWindow) {
|
||||||
if (splashBackground) {
|
if (splashBackground) {
|
||||||
view.webContents.insertCSS(`body { --bg: ${splashBackground} !important }`);
|
view.webContents.insertCSS(`body { --bg: ${splashBackground} !important }`);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (splashPositive) {
|
||||||
|
view.webContents.insertCSS(`body { --button-positive-background: ${splashPositive} !important }`);
|
||||||
|
}
|
||||||
|
if (splashDanger) {
|
||||||
|
view.webContents.insertCSS(`body { --button-danger-background: ${splashDanger} !important }`);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -27,6 +27,8 @@ const updateSplashColors = () => {
|
||||||
|
|
||||||
const color = bodyStyles.get("--text-normal");
|
const color = bodyStyles.get("--text-normal");
|
||||||
const backgroundColor = bodyStyles.get("--background-primary");
|
const backgroundColor = bodyStyles.get("--background-primary");
|
||||||
|
const positive = bodyStyles.get("--button-positive-background");
|
||||||
|
const danger = bodyStyles.get("--button-danger-background");
|
||||||
|
|
||||||
if (isValidColor(color)) {
|
if (isValidColor(color)) {
|
||||||
Settings.store.splashColor = resolveColor(color[0]);
|
Settings.store.splashColor = resolveColor(color[0]);
|
||||||
|
@ -35,6 +37,14 @@ const updateSplashColors = () => {
|
||||||
if (isValidColor(backgroundColor)) {
|
if (isValidColor(backgroundColor)) {
|
||||||
Settings.store.splashBackground = resolveColor(backgroundColor[0]);
|
Settings.store.splashBackground = resolveColor(backgroundColor[0]);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (isValidColor(positive)) {
|
||||||
|
Settings.store.splashPositive = resolveColor(positive[0]);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (isValidColor(danger)) {
|
||||||
|
Settings.store.splashDanger = resolveColor(danger[0]);
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
if (document.readyState === "complete") {
|
if (document.readyState === "complete") {
|
||||||
|
|
3
src/shared/settings.d.ts
vendored
3
src/shared/settings.d.ts
vendored
|
@ -28,6 +28,9 @@ export interface Settings {
|
||||||
firstLaunch?: boolean;
|
firstLaunch?: boolean;
|
||||||
|
|
||||||
splashTheming?: boolean;
|
splashTheming?: boolean;
|
||||||
|
|
||||||
splashColor?: string;
|
splashColor?: string;
|
||||||
splashBackground?: string;
|
splashBackground?: string;
|
||||||
|
splashPositive?: string;
|
||||||
|
splashDanger?: string;
|
||||||
}
|
}
|
||||||
|
|
|
@ -25,7 +25,7 @@
|
||||||
button {
|
button {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
padding: 0.5em;
|
padding: 0.5em;
|
||||||
color: var(--fg);
|
color: var(--bg);
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
@ -38,11 +38,11 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.green {
|
.green {
|
||||||
background-color: #248046;
|
background-color: var(--button-positive-background, #248046);
|
||||||
}
|
}
|
||||||
|
|
||||||
.red {
|
.red {
|
||||||
background-color: #ed4245;
|
background-color: var(--button-danger-background, #ed4245);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
|
Reference in a new issue