dan/dribbblish-dynamic-theme
1
0
Fork 0
mirror of https://github.com/danbulant/dribbblish-dynamic-theme synced 2026-06-17 13:41:10 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #129 from JulienMaille/bw-themes

Browse source 
WIP: add 3 b&w themes
This commit is contained in:
Julien 2021-11-30 09:39:19 +01:00 committed by GitHub
commit 193953dc91
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 24 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
src/js/main.js
View file

@ -485,9 +485,19 @@ Dribbblish.on("ready", () => {
function toggleDark(setDark) { function toggleDark(setDark) {
if (setDark === undefined) setDark = isLight(textColorBg); if (setDark === undefined) setDark = isLight(textColorBg);
$("html").css("--is_light", setDark ? 0 : 1); $("html").css("--is_light", setDark ? 0 : 1);
textColorBg = setDark ? "#0A0A0A" : "#FAFAFA";
switch (Dribbblish.config.get("bgTheme")) {
case "bw":
textColorBg = setDark ? "#0A0A0A" : "#FAFAFA";
break;
case "nord":
textColorBg = setDark ? "#3B4252" : "#D8DEE9";
break;
case "grey":
textColorBg = setDark ? "#202020" : "#C0C0C0";
break;
}
setRootColor("main", textColorBg); setRootColor("main", textColorBg);
setRootColor("player", textColorBg); setRootColor("player", textColorBg);
@ -607,8 +617,8 @@ Dribbblish.on("ready", () => {
description: "Select Dark / Bright mode", description: "Select Dark / Bright mode",
defaultValue: "time", defaultValue: "time",
showChildren: (val) => { showChildren: (val) => {
if (val == "time") return ["darkModeOnTime", "darkModeOffTime"]; if (val == "time") return ["darkModeOnTime", "darkModeOffTime", "bgTheme"];
return false; return ["bgTheme"];
}, },
onChange: (val) => { onChange: (val) => {
switch (val) { switch (val) {
@ -641,6 +651,16 @@ Dribbblish.on("ready", () => {
defaultValue: "06:00", defaultValue: "06:00",
fireInitialChange: false, fireInitialChange: false,
onChange: checkDarkLightMode onChange: checkDarkLightMode
},
{
area: "Theme",
type: "select",
data: { bw: "Black / White", nord: "Nord", grey: "Greyish" },
key: "bgTheme",
name: "Background Theme",
description: "Select which colors should be used as main background colors",
defaultValue: "bw",
onChange: () => toggleDark($("html").css("--is_light") == "0")
} }
] ]
}); });