1

Waybar: Use colors from color HM module

This commit is contained in:
2024-10-13 17:54:03 +02:00
parent e46b774049
commit bebd70ba82
3 changed files with 78 additions and 127 deletions

View File

@ -1,37 +0,0 @@
/*
*
* Catppuccin Latte palette
* Maintainer: rubyowo
*
*/
@define-color base #eff1f5;
@define-color mantle #e6e9ef;
@define-color crust #dce0e8;
@define-color text #4c4f69;
@define-color subtext0 #6c6f85;
@define-color subtext1 #5c5f77;
@define-color surface0 #ccd0da;
@define-color surface1 #bcc0cc;
@define-color surface2 #acb0be;
@define-color overlay0 #9ca0b0;
@define-color overlay1 #8c8fa1;
@define-color overlay2 #7c7f93;
@define-color blue #1e66f5;
@define-color lavender #7287fd;
@define-color sapphire #209fb5;
@define-color sky #04a5e5;
@define-color teal #179299;
@define-color green #40a02b;
@define-color yellow #df8e1d;
@define-color peach #fe640b;
@define-color maroon #e64553;
@define-color red #d20f39;
@define-color mauve #8839ef;
@define-color pink #ea76cb;
@define-color flamingo #dd7878;
@define-color rosewater #dc8a78;

View File

@ -1,14 +0,0 @@
@define-color dark #2A231C;
@define-color light #EBEBE5;
@define-color accent-dark #463A2E;
@define-color accent-light #865E43;
@define-color pastel-a #797D62;
@define-color pastel-b #9B9B7A;
@define-color pastel-c #D9AE94;
@define-color pastel-d #E5C59E;
@define-color pastel-e #F1DCA7;
@define-color pastel-f #F8D488;
@define-color pastel-g #E4B074;
@define-color pastel-h #D08C60;
@define-color pastel-i #997B66;

View File

@ -8,6 +8,7 @@
with lib;
with mylib.modules; let
cfg = config.modules.waybar;
color = config.modules.color;
hyprcfg = config.modules.hyprland;
in {
options.modules.waybar = import ./options.nix {inherit lib mylib;};
@ -32,7 +33,8 @@ in {
"custom/launcher" = {
format = "<span font='FontAwesome'></span> ";
interval = "once";
tooltip = false;
on-click = "rofi -drun-show-actions -show drun";
tooltip-format = "<tt>Tux Alhamdulillah<tt>";
};
"hyprland/workspaces" = {
@ -84,86 +86,86 @@ in {
};
};
style =
(builtins.readFile ./colors/${hyprcfg.theme}.css)
+ ''
/*Order is Top-Right-Bottom-Left for combined properties*/
window#waybar {
font-family: JetBrainsMono Nerd Font Mono;
font-weight: bold;
color: @base;
background-color: rgba(239, 241, 245, 0.6);
}
style = ''
/*Order is Top-Right-Bottom-Left for combined properties*/
window#waybar {
font-family: ${color.font};
font-weight: bold;
color: #${color.light.base};
/*Square Widgets*/
#custom-launcher,
#workspaces button,
#tray {
padding: 0px 10px 0px 10px;
margin: 5px 5px 5px 5px;
border-radius: 6px;
color: @base;
}
/*Can't use color.light.base here because waybar doesn't support rrggbbaa*/
background-color: rgba(239, 241, 245, 0.5);
}
#workspaces button:hover {
color: @pink;
}
/*Square Widgets*/
#custom-launcher,
#workspaces button,
#tray {
padding: 0px 10px 0px 10px;
margin: 5px 5px 5px 5px;
border-radius: 6px;
color: #${color.light.base};
}
/*Tux Icon*/
#custom-launcher {
font-size: 18px;
padding-right: 0px;
}
#workspaces button:hover {
color: #${color.light.pink};
}
/*Rectangle Widgets*/
#user,
#window,
#pulseaudio,
#network,
#cpu,
#memory,
#temperature,
#clock {
padding: 0px 10px 0px 10px;
margin: 8px 5px 8px 5px;
border-radius: 6px;
}
/*Tux Icon*/
#custom-launcher {
font-size: 18px;
padding-right: 0px;
}
/*Colors*/
#custom-launcher {
background-color: @flamingo;
}
#user {
background-color: @pink;
}
#window {
background-color: @mauve;
}
#workspaces button {
background-color: @red;
}
#pulseaudio {
background-color: @maroon;
}
#network {
background-color: @peach;
}
#cpu {
background-color: @yellow;
}
#memory {
background-color: @green;
}
#temperature {
background-color: @teal;
}
#clock {
background-color: @sky;
}
#tray {
background-color: @sapphire;
}
'';
/*Rectangle Widgets*/
#user,
#window,
#pulseaudio,
#network,
#cpu,
#memory,
#temperature,
#clock {
padding: 0px 10px 0px 10px;
margin: 8px 5px 8px 5px;
border-radius: 6px;
}
/*Colors*/
#custom-launcher {
background-color: #${color.light.flamingo};
}
#user {
background-color: #${color.light.pink};
}
#window {
background-color: #${color.light.mauve};
}
#workspaces button {
background-color: #${color.light.red};
}
#pulseaudio {
background-color: #${color.light.maroon};
}
#network {
background-color: #${color.light.peach};
}
#cpu {
background-color: #${color.light.yellow};
}
#memory {
background-color: #${color.light.green};
}
#temperature {
background-color: #${color.light.teal};
}
#clock {
background-color: #${color.light.sky};
}
#tray {
background-color: #${color.light.sapphire};
}
'';
};
};
}