mirror of
https://github.com/danth/stylix
synced 2024-11-10 14:44:16 +00:00
fix waybar modules (#76)
This commit is contained in:
parent
184255d021
commit
ca8b8a58c4
5 changed files with 383 additions and 57 deletions
65
modules/waybar/base.css
Normal file
65
modules/waybar/base.css
Normal file
|
@ -0,0 +1,65 @@
|
|||
window#waybar {
|
||||
background: @base00;
|
||||
color: @base05;
|
||||
}
|
||||
|
||||
#wireplumber,
|
||||
#pulseaudio,
|
||||
#sndio {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#wireplumber.muted,
|
||||
#pulseaudio.muted,
|
||||
#sndio.muted {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#upower,
|
||||
#battery {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#upower.charging,
|
||||
#battery.Charging {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#network {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#network.disconnected {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#user {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#clock {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#backlight {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#cpu {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#disk {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#idle_inhibitor {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#temperature {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#mpd {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#language {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#keyboard-state {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#memory {
|
||||
padding: 0 5px;
|
||||
}
|
||||
#window {
|
||||
padding: 0 5px;
|
||||
}
|
88
modules/waybar/center.css
Normal file
88
modules/waybar/center.css
Normal file
|
@ -0,0 +1,88 @@
|
|||
window .modules-center #workspaces button {
|
||||
background-color: @base07;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-center #wireplumber,
|
||||
.modules-center #pulseaudio,
|
||||
.modules-center #sndio {
|
||||
background-color: @base09;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-center #workspaces button.focused,
|
||||
.modules-center #workspaces button.active {
|
||||
background: @base03;
|
||||
}
|
||||
.modules-center #workspaces button.urgent {
|
||||
background-color: @base08;
|
||||
}
|
||||
.modules-center #wireplumber.muted,
|
||||
.modules-center #pulseaudio.muted,
|
||||
.modules-center #sndio.muted {
|
||||
background-color: @base0C;
|
||||
}
|
||||
.modules-center #upower,
|
||||
.modules-center #battery {
|
||||
background-color: @base0D;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-center #upower.charging,
|
||||
.modules-center #battery.Charging {
|
||||
background-color: @base0E;
|
||||
}
|
||||
.modules-center #network {
|
||||
background-color: @base0B;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-center #network.disconnected {
|
||||
background-color: @base0C;
|
||||
}
|
||||
.modules-center #user {
|
||||
background-color: @base0F;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-center #clock {
|
||||
background-color: @base03;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-center #backlight {
|
||||
background-color: @base0E;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-center #cpu {
|
||||
background-color: @base0B;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-center #disk {
|
||||
background-color: @base02;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-center #idle_inhibitor {
|
||||
background-color: @base06;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-center #temperature {
|
||||
background-color: @base07;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-center #mpd {
|
||||
background-color: @base02;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-center #language {
|
||||
background-color: @base02;
|
||||
color: @base00;
|
||||
}
|
||||
|
||||
.modules-center #keyboard-state {
|
||||
background-color: @base03;
|
||||
color: @base00;
|
||||
}
|
||||
|
||||
.modules-center #memory {
|
||||
background-color: @base09;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-center #window {
|
||||
background-color: @base0C;
|
||||
color: @base00;
|
||||
}
|
|
@ -3,65 +3,66 @@ with config.lib.stylix.colors.withHashtag;
|
|||
with config.stylix.fonts;
|
||||
|
||||
{
|
||||
options.stylix.targets.waybar.enable = config.lib.stylix.mkEnableTarget "Waybar" true;
|
||||
options.stylix.targets.waybar = {
|
||||
enable = config.lib.stylix.mkEnableTarget "Waybar" true;
|
||||
enableLeftBackColors = lib.mkOption {
|
||||
type = lib.types.bool;
|
||||
default = false;
|
||||
description = lib.mdDoc "enables background colors on the left side of the bar";
|
||||
};
|
||||
enableCenterBackColors = lib.mkOption {
|
||||
type = lib.types.bool;
|
||||
default = false;
|
||||
description = lib.mdDoc "enables background colors on the center of the bar";
|
||||
};
|
||||
enableRightBackColors = lib.mkOption {
|
||||
type = lib.types.bool;
|
||||
default = false;
|
||||
description = lib.mdDoc "enables background colors on the right side of the bar";
|
||||
};
|
||||
};
|
||||
|
||||
config = lib.mkIf config.stylix.targets.waybar.enable {
|
||||
programs.waybar.style = ''
|
||||
@define-color base00 ${base00}; @define-color base01 ${base01}; @define-color base02 ${base02}; @define-color base03 ${base03};
|
||||
@define-color base04 ${base04}; @define-color base05 ${base05}; @define-color base06 ${base06}; @define-color base07 ${base07};
|
||||
|
||||
@define-color base08 ${base08}; @define-color base09 ${base09}; @define-color base0A ${base0A}; @define-color base0B ${base0B};
|
||||
@define-color base0C ${base0C}; @define-color base0D ${base0D}; @define-color base0E ${base0E}; @define-color base0F ${base0F};
|
||||
* {
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
font-family: ${sansSerif.name};
|
||||
font-size: ${builtins.toString sizes.desktop};
|
||||
}
|
||||
window#waybar {
|
||||
background: ${base00};
|
||||
color: ${base05};
|
||||
''
|
||||
+ (builtins.readFile ./base.css)
|
||||
+ (if config.stylix.targets.waybar.enableLeftBackColors then builtins.readFile ./left.css else ''
|
||||
.modules-left #workspaces button {
|
||||
border-bottom: 3px solid transparent;
|
||||
}
|
||||
#workspaces button {
|
||||
padding: 0 5px;
|
||||
background-color: ${base01};
|
||||
color: ${base04};
|
||||
.modules-left #workspaces button.focused,
|
||||
.modules-left #workspaces button.active {
|
||||
border-bottom: 3px solid @base05;
|
||||
}
|
||||
#workspaces button.focused, #workspaces button.active {
|
||||
background: ${base02};
|
||||
'')
|
||||
+ (if config.stylix.targets.waybar.enableCenterBackColors then builtins.readFile ./center.css else ''
|
||||
.modules-center #workspaces button {
|
||||
border-bottom: 3px solid transparent;
|
||||
}
|
||||
#workspaces button.urgent {
|
||||
background-color: ${base08};
|
||||
.modules-center #workspaces button.focused,
|
||||
.modules-center #workspaces button.active {
|
||||
border-bottom: 3px solid @base05;
|
||||
}
|
||||
#wireplumber, #pulseaudio, #sndio {
|
||||
background-color: ${base09};
|
||||
color: ${base04};
|
||||
padding: 0 5px;
|
||||
'')
|
||||
+ (if config.stylix.targets.waybar.enableRightBackColors then builtins.readFile ./right.css else ''
|
||||
.modules-right #workspaces button {
|
||||
border-bottom: 3px solid transparent;
|
||||
}
|
||||
#wireplumber.muted, #pulseaudio.muted, #sndio.muted {
|
||||
background-color: ${base0C};
|
||||
.modules-right #workspaces button.focused,
|
||||
.modules-right #workspaces button.active {
|
||||
border-bottom: 3px solid @base05;
|
||||
}
|
||||
#upower, #battery {
|
||||
background-color: ${base0D};
|
||||
color: ${base04};
|
||||
padding: 0 5px;
|
||||
}
|
||||
#upower.charging, #battery.Charging {
|
||||
background-color: ${base0E};
|
||||
}
|
||||
#network {
|
||||
background-color: ${base0B};
|
||||
color: ${base04};
|
||||
padding: 0 5px;
|
||||
}
|
||||
#network.disconnected {
|
||||
background-color: ${base0C};
|
||||
}
|
||||
#user {
|
||||
background-color: ${base0F};
|
||||
color: ${base04};
|
||||
padding: 0 5px;
|
||||
}
|
||||
#clock {
|
||||
background-color: ${base03};
|
||||
color: ${base04};
|
||||
padding: 0 5px;
|
||||
}
|
||||
'';
|
||||
'');
|
||||
};
|
||||
}
|
||||
|
|
86
modules/waybar/left.css
Normal file
86
modules/waybar/left.css
Normal file
|
@ -0,0 +1,86 @@
|
|||
window .modules-left #workspaces button {
|
||||
background-color: @base07;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-left #wireplumber,
|
||||
.modules-left #pulseaudio,
|
||||
.modules-left #sndio {
|
||||
background-color: @base09;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-left #workspaces button.focused,
|
||||
.modules-left #workspaces button.active {
|
||||
background: @base03;
|
||||
}
|
||||
.modules-left #workspaces button.urgent {
|
||||
background-color: @base08;
|
||||
}
|
||||
.modules-left #wireplumber.muted,
|
||||
.modules-left #pulseaudio.muted,
|
||||
.modules-left #sndio.muted {
|
||||
background-color: @base0C;
|
||||
}
|
||||
.modules-left #upower,
|
||||
.modules-left #battery {
|
||||
background-color: @base0D;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-left #upower.charging,
|
||||
.modules-left #battery.Charging {
|
||||
background-color: @base0E;
|
||||
}
|
||||
.modules-left #network {
|
||||
background-color: @base0B;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-left #network.disconnected {
|
||||
background-color: @base0C;
|
||||
}
|
||||
.modules-left #user {
|
||||
background-color: @base0F;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-left #clock {
|
||||
background-color: @base03;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-left #backlight {
|
||||
background-color: @base0E;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-left #cpu {
|
||||
background-color: @base0B;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-left #disk {
|
||||
background-color: @base02;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-left #idle_inhibitor {
|
||||
background-color: @base06;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-left #temperature {
|
||||
background-color: @base07;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-left #mpd {
|
||||
background-color: @base02;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-left #language {
|
||||
background-color: @base02;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-left #keyboard-state {
|
||||
background-color: @base03;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-left #memory {
|
||||
background-color: @base09;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-left #window {
|
||||
background-color: @base0C;
|
||||
color: @base00;
|
||||
}
|
86
modules/waybar/right.css
Normal file
86
modules/waybar/right.css
Normal file
|
@ -0,0 +1,86 @@
|
|||
window .modules-right #workspaces button {
|
||||
background-color: @base07;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-right #wireplumber,
|
||||
.modules-right #pulseaudio,
|
||||
.modules-right #sndio {
|
||||
background-color: @base09;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-right #workspaces button.focused,
|
||||
.modules-right #workspaces button.active {
|
||||
background: @base03;
|
||||
}
|
||||
.modules-right #workspaces button.urgent {
|
||||
background-color: @base08;
|
||||
}
|
||||
.modules-right #wireplumber.muted,
|
||||
.modules-right #pulseaudio.muted,
|
||||
.modules-right #sndio.muted {
|
||||
background-color: @base0C;
|
||||
}
|
||||
.modules-right #upower,
|
||||
.modules-right #battery {
|
||||
background-color: @base0D;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-right #upower.charging,
|
||||
.modules-right #battery.Charging {
|
||||
background-color: @base0E;
|
||||
}
|
||||
.modules-right #network {
|
||||
background-color: @base0B;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-right #network.disconnected {
|
||||
background-color: @base0C;
|
||||
}
|
||||
.modules-right #user {
|
||||
background-color: @base0F;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-right #clock {
|
||||
background-color: @base03;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-right #backlight {
|
||||
background-color: @base0E;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-right #cpu {
|
||||
background-color: @base0B;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-right #disk {
|
||||
background-color: @base02;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-right #idle_inhibitor {
|
||||
background-color: @base06;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-right #temperature {
|
||||
background-color: @base07;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-right #mpd {
|
||||
background-color: @base02;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-right #language {
|
||||
background-color: @base02;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-right #keyboard-state {
|
||||
background-color: @base03;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-right #memory {
|
||||
background-color: @base09;
|
||||
color: @base00;
|
||||
}
|
||||
.modules-right #window {
|
||||
background-color: @base0C;
|
||||
color: @base00;
|
||||
}
|
Loading…
Reference in a new issue