Implemented Wallpaper Selector and Matugen's Wallpaper based auto-theming. (#73)
* Implement matugen - WIP * Added matugen * Add types and cleanup code * Matugen implementation updates and added more options such as scheme and contrast. * Code cleanup and matugen settings renamed for clarity. * Makon maroon a primary matugen color. * Updates to handle variations of matugen colors * Finalizing matugen and wrapping up variations. * Minor styling updates of the settings dialog. * Do a swww dependency check. * Dependency logic update * Switch shouldn't double trigger notifications now when checking dependency. * Logic was inverted * Add matugen to dependency checker. * Fixed dependency checking conditional * Update dependency list in readme and check for matugen before doing matugen operations * Styling fixes * OSD Fix * Remove unused code from wallpaper service. * Color fixes for matugen. * Nix updates for new dependencies * Change default wallpaper to empty. * Added custom notification service for startup, cleaned up code and updated readme.
This commit is contained in:
148
options.ts
148
options.ts
@@ -1,5 +1,7 @@
|
||||
import { opt, mkOptions } from "lib/option"
|
||||
import { MatugenScheme, MatugenTheme, MatugenVariation } from "lib/types/options";
|
||||
|
||||
// WARN: CHANGING THESE VALUES WILL PREVENT MATUGEN COLOR GENERATION FOR THE CHANGED VALUE
|
||||
const colors = {
|
||||
"rosewater": "#f5e0dc",
|
||||
"flamingo": "#f2cdcd",
|
||||
@@ -30,26 +32,70 @@ const colors = {
|
||||
"crust": "#11111b"
|
||||
};
|
||||
|
||||
// WARN: CHANGING THESE VALUES WILL PREVENT MATUGEN COLOR GENERATION FOR THE CHANGED VALUE
|
||||
const secondary_colors = {
|
||||
text: "#cdd6f3",
|
||||
pink: "#f5c2e6",
|
||||
red: "#f38ba7",
|
||||
mantle: "#181824",
|
||||
surface1: "#454759",
|
||||
surface0: "#313243",
|
||||
overlay1: "#7f849b",
|
||||
lavender: "#b4befd",
|
||||
mauve: "#cba6f6",
|
||||
green: "#a6e3a0",
|
||||
sky: "#89dcea",
|
||||
teal: "#94e2d4",
|
||||
yellow: "#f9e2ad",
|
||||
maroon: "#eba0ab",
|
||||
crust: "#11111a",
|
||||
surface2: "#585b69",
|
||||
}
|
||||
|
||||
const tertiary_colors = {
|
||||
pink: "#f5c2e8",
|
||||
red: "#f38ba9",
|
||||
mantle: "#181826",
|
||||
surface0: "#313245",
|
||||
overlay1: "#7f849d",
|
||||
lavender: "#b4beff",
|
||||
mauve: "#cba6f8",
|
||||
green: "#a6e3a2",
|
||||
sky: "#89dcec",
|
||||
teal: "#94e2d6",
|
||||
yellow: "#f9e2ae",
|
||||
maroon: "#eba0ad",
|
||||
crust: "#11111c",
|
||||
surface2: "#585b71",
|
||||
}
|
||||
|
||||
const options = mkOptions(OPTIONS, {
|
||||
theme: {
|
||||
matugen: opt(false),
|
||||
matugen_settings: {
|
||||
mode: opt<MatugenTheme>("dark"),
|
||||
scheme_type: opt<MatugenScheme>("tonal-spot"),
|
||||
variation: opt<MatugenVariation>("standard_1"),
|
||||
contrast: opt(0.0),
|
||||
},
|
||||
font: {
|
||||
size: opt("1.2rem"),
|
||||
name: opt("Ubuntu Nerd Font"),
|
||||
weight: opt(600),
|
||||
},
|
||||
notification: {
|
||||
background: opt(colors.mantle),
|
||||
background: opt(tertiary_colors.mantle),
|
||||
actions: {
|
||||
background: opt(colors.lavender),
|
||||
background: opt(secondary_colors.lavender),
|
||||
text: opt(colors.mantle),
|
||||
},
|
||||
label: opt(colors.lavender),
|
||||
border: opt(colors.surface0),
|
||||
time: opt(colors.overlay1),
|
||||
border: opt(secondary_colors.surface0),
|
||||
time: opt(secondary_colors.overlay1),
|
||||
text: opt(colors.text),
|
||||
labelicon: opt(colors.lavender),
|
||||
close_button: {
|
||||
background: opt(colors.red),
|
||||
background: opt(secondary_colors.red),
|
||||
label: opt(colors.crust)
|
||||
}
|
||||
},
|
||||
@@ -57,12 +103,12 @@ const options = mkOptions(OPTIONS, {
|
||||
enable: opt(true),
|
||||
orientation: opt<"horizontal" | "vertical">("vertical"),
|
||||
bar_container: opt(colors.crust),
|
||||
icon_container: opt(colors.lavender),
|
||||
bar_color: opt(colors.lavender),
|
||||
icon_container: opt(tertiary_colors.lavender),
|
||||
bar_color: opt(tertiary_colors.lavender),
|
||||
bar_empty_color: opt(colors.surface0),
|
||||
bar_overflow_color: opt(colors.red),
|
||||
bar_overflow_color: opt(secondary_colors.red),
|
||||
icon: opt(colors.crust),
|
||||
label: opt(colors.lavender),
|
||||
label: opt(tertiary_colors.lavender),
|
||||
monitor: opt(0),
|
||||
active_monitor: opt(true),
|
||||
radius: opt("0.4em"),
|
||||
@@ -177,7 +223,7 @@ const options = mkOptions(OPTIONS, {
|
||||
label: opt(colors.lavender),
|
||||
listitems: {
|
||||
passive: opt(colors.text),
|
||||
active: opt(colors.lavender)
|
||||
active: opt(secondary_colors.lavender)
|
||||
},
|
||||
icons: {
|
||||
passive: opt(colors.surface2),
|
||||
@@ -185,18 +231,18 @@ const options = mkOptions(OPTIONS, {
|
||||
},
|
||||
switch: {
|
||||
enabled: opt(colors.lavender),
|
||||
disabled: opt(colors.surface0),
|
||||
puck: opt(colors.overlay0)
|
||||
disabled: opt(tertiary_colors.surface0),
|
||||
puck: opt(secondary_colors.surface1)
|
||||
},
|
||||
buttons: {
|
||||
default: opt(colors.lavender),
|
||||
active: opt(colors.pink),
|
||||
disabled: opt(colors.surface2),
|
||||
text: opt(colors.crust)
|
||||
active: opt(secondary_colors.pink),
|
||||
disabled: opt(tertiary_colors.surface2),
|
||||
text: opt(secondary_colors.mantle)
|
||||
},
|
||||
iconbuttons: {
|
||||
passive: opt(colors.text),
|
||||
active: opt(colors.lavender)
|
||||
passive: opt(secondary_colors.text),
|
||||
active: opt(tertiary_colors.lavender)
|
||||
},
|
||||
progressbar: {
|
||||
foreground: opt(colors.lavender),
|
||||
@@ -204,7 +250,7 @@ const options = mkOptions(OPTIONS, {
|
||||
},
|
||||
slider: {
|
||||
primary: opt(colors.lavender),
|
||||
background: opt(colors.surface2),
|
||||
background: opt(tertiary_colors.surface2),
|
||||
backgroundhover: opt(colors.surface1),
|
||||
puck: opt(colors.overlay0)
|
||||
},
|
||||
@@ -219,9 +265,9 @@ const options = mkOptions(OPTIONS, {
|
||||
},
|
||||
menu: {
|
||||
media: {
|
||||
song: opt(colors.lavender),
|
||||
artist: opt(colors.teal),
|
||||
album: opt(colors.pink),
|
||||
song: opt(tertiary_colors.lavender),
|
||||
artist: opt(tertiary_colors.teal),
|
||||
album: opt(tertiary_colors.pink),
|
||||
background: {
|
||||
color: opt(colors.crust),
|
||||
},
|
||||
@@ -230,13 +276,13 @@ const options = mkOptions(OPTIONS, {
|
||||
},
|
||||
buttons: {
|
||||
inactive: opt(colors.surface2),
|
||||
enabled: opt(colors.teal),
|
||||
background: opt(colors.lavender),
|
||||
enabled: opt(secondary_colors.teal),
|
||||
background: opt(tertiary_colors.lavender),
|
||||
text: opt(colors.crust),
|
||||
},
|
||||
slider: {
|
||||
primary: opt(colors.pink),
|
||||
background: opt(colors.surface2),
|
||||
background: opt(tertiary_colors.surface2),
|
||||
backgroundhover: opt(colors.surface1),
|
||||
puck: opt(colors.overlay0)
|
||||
}
|
||||
@@ -257,7 +303,7 @@ const options = mkOptions(OPTIONS, {
|
||||
text: opt(colors.text),
|
||||
listitems: {
|
||||
passive: opt(colors.text),
|
||||
active: opt(colors.maroon)
|
||||
active: opt(secondary_colors.maroon)
|
||||
},
|
||||
iconbutton: {
|
||||
passive: opt(colors.text),
|
||||
@@ -269,15 +315,15 @@ const options = mkOptions(OPTIONS, {
|
||||
},
|
||||
audio_slider: {
|
||||
primary: opt(colors.maroon),
|
||||
background: opt(colors.surface2),
|
||||
background: opt(tertiary_colors.surface2),
|
||||
backgroundhover: opt(colors.surface1),
|
||||
puck: opt(colors.overlay0)
|
||||
puck: opt(colors.surface2)
|
||||
},
|
||||
input_slider: {
|
||||
primary: opt(colors.maroon),
|
||||
background: opt(colors.surface2),
|
||||
background: opt(tertiary_colors.surface2),
|
||||
backgroundhover: opt(colors.surface1),
|
||||
puck: opt(colors.overlay0)
|
||||
puck: opt(colors.surface2)
|
||||
}
|
||||
},
|
||||
network: {
|
||||
@@ -299,7 +345,7 @@ const options = mkOptions(OPTIONS, {
|
||||
},
|
||||
listitems: {
|
||||
passive: opt(colors.text),
|
||||
active: opt(colors.mauve)
|
||||
active: opt(secondary_colors.mauve)
|
||||
},
|
||||
icons: {
|
||||
passive: opt(colors.overlay2),
|
||||
@@ -328,12 +374,12 @@ const options = mkOptions(OPTIONS, {
|
||||
switch_divider: opt(colors.surface1),
|
||||
switch: {
|
||||
enabled: opt(colors.sky),
|
||||
disabled: opt(colors.surface0),
|
||||
puck: opt(colors.overlay0)
|
||||
disabled: opt(tertiary_colors.surface0),
|
||||
puck: opt(secondary_colors.surface1)
|
||||
},
|
||||
listitems: {
|
||||
passive: opt(colors.text),
|
||||
active: opt(colors.sky)
|
||||
active: opt(secondary_colors.sky)
|
||||
},
|
||||
icons: {
|
||||
passive: opt(colors.overlay2),
|
||||
@@ -366,7 +412,7 @@ const options = mkOptions(OPTIONS, {
|
||||
},
|
||||
text: opt(colors.text),
|
||||
listitems: {
|
||||
passive: opt(colors.text),
|
||||
passive: opt(secondary_colors.text),
|
||||
active: opt(colors.yellow)
|
||||
},
|
||||
icons: {
|
||||
@@ -375,7 +421,7 @@ const options = mkOptions(OPTIONS, {
|
||||
},
|
||||
slider: {
|
||||
primary: opt(colors.yellow),
|
||||
background: opt(colors.surface2),
|
||||
background: opt(tertiary_colors.surface2),
|
||||
backgroundhover: opt(colors.surface1),
|
||||
puck: opt(colors.overlay0)
|
||||
},
|
||||
@@ -398,7 +444,7 @@ const options = mkOptions(OPTIONS, {
|
||||
calendar: {
|
||||
yearmonth: opt(colors.teal),
|
||||
weekdays: opt(colors.pink),
|
||||
paginator: opt(colors.pink),
|
||||
paginator: opt(secondary_colors.pink),
|
||||
currentday: opt(colors.pink),
|
||||
days: opt(colors.text),
|
||||
contextdays: opt(colors.surface2),
|
||||
@@ -448,35 +494,35 @@ const options = mkOptions(OPTIONS, {
|
||||
body: opt(colors.text),
|
||||
confirm: opt(colors.green),
|
||||
deny: opt(colors.red),
|
||||
button_text: opt(colors.crust),
|
||||
button_text: opt(secondary_colors.crust),
|
||||
}
|
||||
},
|
||||
shortcuts: {
|
||||
background: opt(colors.lavender),
|
||||
text: opt(colors.crust),
|
||||
text: opt(secondary_colors.mantle),
|
||||
recording: opt(colors.green)
|
||||
},
|
||||
controls: {
|
||||
disabled: opt(colors.surface2),
|
||||
wifi: {
|
||||
background: opt(colors.mauve),
|
||||
text: opt(colors.crust),
|
||||
text: opt(secondary_colors.mantle),
|
||||
},
|
||||
bluetooth: {
|
||||
background: opt(colors.sky),
|
||||
text: opt(colors.crust),
|
||||
text: opt(secondary_colors.mantle),
|
||||
},
|
||||
notifications: {
|
||||
background: opt(colors.yellow),
|
||||
text: opt(colors.crust),
|
||||
text: opt(secondary_colors.mantle),
|
||||
},
|
||||
volume: {
|
||||
background: opt(colors.maroon),
|
||||
text: opt(colors.crust),
|
||||
text: opt(secondary_colors.mantle),
|
||||
},
|
||||
input: {
|
||||
background: opt(colors.pink),
|
||||
text: opt(colors.crust),
|
||||
text: opt(secondary_colors.mantle),
|
||||
},
|
||||
},
|
||||
directories: {
|
||||
@@ -507,22 +553,22 @@ const options = mkOptions(OPTIONS, {
|
||||
bar_background: opt(colors.surface1),
|
||||
cpu: {
|
||||
icon: opt(colors.maroon),
|
||||
bar: opt(colors.maroon),
|
||||
bar: opt(tertiary_colors.maroon),
|
||||
label: opt(colors.maroon),
|
||||
},
|
||||
ram: {
|
||||
icon: opt(colors.yellow),
|
||||
bar: opt(colors.yellow),
|
||||
bar: opt(tertiary_colors.yellow),
|
||||
label: opt(colors.yellow),
|
||||
},
|
||||
gpu: {
|
||||
icon: opt(colors.green),
|
||||
bar: opt(colors.green),
|
||||
bar: opt(tertiary_colors.green),
|
||||
label: opt(colors.green),
|
||||
},
|
||||
disk: {
|
||||
icon: opt(colors.pink),
|
||||
bar: opt(colors.pink),
|
||||
bar: opt(tertiary_colors.pink),
|
||||
label: opt(colors.pink),
|
||||
},
|
||||
},
|
||||
@@ -537,8 +583,8 @@ const options = mkOptions(OPTIONS, {
|
||||
clear: opt(colors.red),
|
||||
switch: {
|
||||
enabled: opt(colors.lavender),
|
||||
disabled: opt(colors.surface0),
|
||||
puck: opt(colors.overlay0)
|
||||
disabled: opt(tertiary_colors.surface0),
|
||||
puck: opt(secondary_colors.surface1)
|
||||
},
|
||||
},
|
||||
}
|
||||
@@ -743,6 +789,10 @@ const options = mkOptions(OPTIONS, {
|
||||
|
||||
terminal: opt("kitty"),
|
||||
|
||||
wallpaper: {
|
||||
image: opt("")
|
||||
},
|
||||
|
||||
notifications: {
|
||||
position: opt<"top" | "top right" | "top left" | "bottom" | "bottom right" | "bottom left">("top right"),
|
||||
timeout: opt(7000),
|
||||
|
||||
Reference in New Issue
Block a user