a lot of work on visuals, overhauled waybar config
This commit is contained in:
pagedmov
@@ -1,125 +1,98 @@
|
||||
{...}: let
|
||||
custom = {
|
||||
font_size = "15px"; # Base font size
|
||||
font_weight = "bold"; # Base font weight
|
||||
notification_font_size = "18px"; # Font size for notifications
|
||||
text_color = "#cccedb"; # Default text color
|
||||
background_color = "rgba(21, 21, 21, 0.83)";
|
||||
border_color = "rgba(255, 255, 255, 0.3)";
|
||||
notification_margin_left = "-2px";
|
||||
notification_margin_top = "-4px";
|
||||
notification_padding_bottom = "12px";
|
||||
tooltip_bg = "#1D2021";
|
||||
tooltip_color = "#FBF1C7";
|
||||
tooltip_border = "#101a24";
|
||||
};
|
||||
in {
|
||||
{
|
||||
scheme,
|
||||
...
|
||||
}:
|
||||
|
||||
let
|
||||
bg = {
|
||||
darkester = scheme.base00;
|
||||
darkest = scheme.base01;
|
||||
darker = scheme.base02;
|
||||
dark = scheme.base03;
|
||||
};
|
||||
fg = {
|
||||
lightester = scheme.base07;
|
||||
lightest = scheme.base06;
|
||||
lighter = scheme.base05;
|
||||
light = scheme.base04;
|
||||
};
|
||||
colors = {
|
||||
color0 = scheme.base08;
|
||||
color1 = scheme.base09;
|
||||
color2 = scheme.base0A;
|
||||
color3 = scheme.base0B;
|
||||
color4 = scheme.base0C;
|
||||
color5 = scheme.base0D;
|
||||
color6 = scheme.base0E;
|
||||
color7 = scheme.base0F;
|
||||
};
|
||||
in
|
||||
{
|
||||
programs.waybar.style = ''
|
||||
* {
|
||||
font-family: "JetBrains Mono Nerd Font";
|
||||
font-weight: ${custom.font_weight};
|
||||
font-size: ${custom.font_size};
|
||||
}
|
||||
|
||||
#custom-notification {
|
||||
font-family: "JetBrains Mono Nerd Font";
|
||||
font-size: ${custom.notification_font_size};
|
||||
color: ${custom.text_color};
|
||||
margin-left: ${custom.notification_margin_left};
|
||||
margin-top: ${custom.notification_margin_top};
|
||||
padding-bottom: ${custom.notification_padding_bottom};
|
||||
}
|
||||
|
||||
window#waybar {
|
||||
background: ${custom.background_color};
|
||||
border: 3px solid ${custom.border_color};
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
tooltip {
|
||||
background: ${custom.tooltip_bg};
|
||||
color: ${custom.tooltip_color};
|
||||
font-size: 13px;
|
||||
border-radius: 7px;
|
||||
border: 2px solid ${custom.tooltip_border};
|
||||
}
|
||||
|
||||
#workspaces {
|
||||
font-weight: normal;
|
||||
background: rgba(23, 23, 23, 0.0);
|
||||
color: #2F302D;
|
||||
border-radius: 9px;
|
||||
padding-left: 0px;
|
||||
padding-right: 4px;
|
||||
padding-top: 1px;
|
||||
}
|
||||
|
||||
#workspaces button {
|
||||
font-weight: normal;
|
||||
background: rgba(23, 23, 23, 0.0);
|
||||
color: #B1B2BD;
|
||||
border-radius: 9px;
|
||||
padding-left: 0px;
|
||||
padding-right: 4px;
|
||||
margin-right: -4px;
|
||||
margin-top: -10px;
|
||||
}
|
||||
|
||||
#workspaces button.active {
|
||||
color: ${custom.text_color};
|
||||
font-weight: normal;
|
||||
padding-left: 0px;
|
||||
padding-right: 4px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
#taskbar button {
|
||||
box-shadow: none;
|
||||
font-size: 4px;
|
||||
padding: 0px;
|
||||
border-radius: 9px;
|
||||
margin-top: 3px;
|
||||
margin-bottom: 3px;
|
||||
margin-left: 3px;
|
||||
margin-right: 3px;
|
||||
color: #A1BDCE;
|
||||
}
|
||||
|
||||
#taskbar button.active {
|
||||
background: #C8C8C8;
|
||||
color: #C8C8C8;
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
#tray menu * {
|
||||
font-weight: bold;
|
||||
font-size: 13px;
|
||||
color: #FBF1C7;
|
||||
}
|
||||
|
||||
#tray {
|
||||
padding: 0px;
|
||||
font-size: 14;
|
||||
}
|
||||
|
||||
#battery {
|
||||
font-weight: normal;
|
||||
font-size: 22px;
|
||||
color: #a6d189;
|
||||
background: #${bg.darkest};
|
||||
border: 2px solid #${bg.dark};
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
#clock {
|
||||
color: ${custom.text_color};
|
||||
font-size: 15px;
|
||||
font-weight: 900;
|
||||
font-family: "CaskaydiaCove Nerd Font Mono";
|
||||
background: rgba(23, 23, 23, 0.0);
|
||||
#tray menu * {
|
||||
font-weight: bold;
|
||||
font-size: 13px;
|
||||
color: #FBF1C7;
|
||||
background: #${bg.darkest};
|
||||
border: 2px solid #${bg.dark};
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
#backlight-slider slider,
|
||||
#taskbar button {
|
||||
box-shadow: none;
|
||||
font-size: 4px;
|
||||
border-radius: 9px;
|
||||
color: #A1BDCE;
|
||||
background: #${bg.darkest};
|
||||
border: 2px solid #${bg.dark};
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
tooltip {
|
||||
background: #${bg.darkester};
|
||||
color: #${fg.lighter};
|
||||
font-size: 13px;
|
||||
border-radius: 7px;
|
||||
border: 2px solid #${bg.dark};
|
||||
background: #${bg.darkest};
|
||||
}
|
||||
|
||||
window#waybar {
|
||||
opacity: 0.85;
|
||||
background: #${bg.darkester};
|
||||
border: 2px solid #${bg.dark};
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
#workspaces {
|
||||
font-weight: normal;
|
||||
color: transparent;
|
||||
margin-left: -5px;
|
||||
margin-top: 0px;
|
||||
border: 0px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#backlight-slider slider,
|
||||
#pulseaudio-slider slider {
|
||||
background: #A1BDCE;
|
||||
background: #${colors.color3};
|
||||
background-color: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
@@ -128,11 +101,8 @@ in {
|
||||
#pulseaudio-slider trough {
|
||||
min-width: 9px;
|
||||
min-height: 90px;
|
||||
margin-bottom: -4px;
|
||||
border-radius: 8px;
|
||||
background: #343434;
|
||||
margin-left: -4px;
|
||||
margin-right: -4px;
|
||||
}
|
||||
|
||||
#backlight-slider highlight,
|
||||
@@ -141,59 +111,99 @@ in {
|
||||
background-color: #2096C0;
|
||||
}
|
||||
|
||||
#custom-mouse {
|
||||
font-size: 14px;
|
||||
margin-bottom: 6px;
|
||||
background: #161320;
|
||||
#pulseaudio {
|
||||
font-weight: normal;
|
||||
font-size: 18px;
|
||||
color: #${colors.color3};
|
||||
background: #${bg.darkest};
|
||||
border: 2px solid #${bg.dark};
|
||||
margin: 4px;
|
||||
margin-bottom: 0px;
|
||||
border: 2px solid @unfocused_borders;
|
||||
border-bottom: 2px solid #151515;
|
||||
border-radius: 6px;
|
||||
border-bottom-left-radius: 0px;
|
||||
border-bottom-right-radius: 0px;
|
||||
}
|
||||
|
||||
#network {
|
||||
font-size: 19px;
|
||||
color: #${colors.color4};
|
||||
background: #${bg.darkest};
|
||||
margin: 4px;
|
||||
margin-top: 0;
|
||||
border: 2px solid @unfocused_borders;
|
||||
border-top: 2px solid #151515;
|
||||
border-radius: 6px;
|
||||
border-top-left-radius: 0px;
|
||||
border-top-right-radius: 0px;
|
||||
}
|
||||
|
||||
#clock {
|
||||
color: #${colors.color6};
|
||||
font-size: 15px;
|
||||
font-weight: 900;
|
||||
font-family: "CaskaydiaCove Nerd Font Mono";
|
||||
background: #${bg.darkest};
|
||||
margin: 4px;
|
||||
border-radius: 6px;
|
||||
border: 2px solid @unfocused_borders;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
#custom-notification {
|
||||
font-family: "JetBrains Mono Nerd Font";
|
||||
font-size: 21px;
|
||||
color: #${colors.color7};
|
||||
background: #${bg.darkest};
|
||||
margin: 4px;
|
||||
border: 2px solid @unfocused_borders;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
#custom-power {
|
||||
font-size: 15px;
|
||||
color: #FFFFFF;
|
||||
background: rgba(22, 19, 32, 0.9);
|
||||
margin: 6px 0px;
|
||||
padding-left: 4px;
|
||||
padding-right: 4px;
|
||||
background: #${bg.darkest};
|
||||
border: 2px solid #${bg.dark};
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
#backlight {
|
||||
color: ${custom.text_color};
|
||||
color: #${fg.lighter};
|
||||
font-weight: normal;
|
||||
font-size: 19px;
|
||||
margin: 0px;
|
||||
padding-left: 0px;
|
||||
background: #${bg.darkest};
|
||||
border: 2px solid #${bg.dark};
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
#custom-spacer {
|
||||
opacity: 0.0;
|
||||
padding-top: 3px;
|
||||
}
|
||||
|
||||
#tray menu separator {
|
||||
min-height: 10px;
|
||||
}
|
||||
|
||||
#pulseaudio {
|
||||
font-weight: normal;
|
||||
font-size: 18px;
|
||||
color: ${custom.text_color};
|
||||
}
|
||||
|
||||
#cpu {
|
||||
font-weight: normal;
|
||||
font-size: 22px;
|
||||
color: ${custom.text_color};
|
||||
color: #${fg.lighter};
|
||||
background: #${bg.darkest};
|
||||
border: 2px solid #${bg.dark};
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
#memory {
|
||||
font-weight: normal;
|
||||
font-size: 22px;
|
||||
color: ${custom.text_color};
|
||||
}
|
||||
|
||||
#network {
|
||||
font-size: 19px;
|
||||
color: ${custom.text_color};
|
||||
color: #${fg.lighter};
|
||||
background: #${bg.darkest};
|
||||
border: 2px solid #${bg.dark};
|
||||
border-radius: 6px;
|
||||
}
|
||||
'';
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user