feat: add new waybar top configuration with separate config and style files;

feat: add waybar colors.css for centralized color definitions;
experiment: change cava visual style to solid blue foreground and disable gradient;
chore: remove nwg-dock-hyprland from hyprland autostart and toggle scripts;
refactor: update waybar launch commands to use new config_top.jsonc and style_top.css;
refactor: simplify gamemode.sh by removing STATUSBAR variable and updating waybar commands;
chore: add placeholder config_bottom.jsonc and style_bottom.css for future dual-bar setup
This commit is contained in:
2025-12-23 16:55:58 +03:00
parent c9795e2514
commit 9faceb2309
11 changed files with 173 additions and 357 deletions

View File

@@ -217,7 +217,7 @@ bar_width = 1
# a terminal that can change color definitions such as Gnome-terminal or rxvt.
# default is to keep current terminal color
; background = default
; foreground = default
foreground = blue
# SDL and sdl_glsl only support hex code colors, these are the default:
; background = '#111111'
@@ -227,7 +227,7 @@ bar_width = 1
# Gradient mode, only hex defined colors are supported,
# background must also be defined in hex or remain commented out. 1 = on, 0 = off.
# You can define as many as 8 different colors. They range from bottom to top of screen
gradient = 1
gradient = 0
gradient_count = 2
gradient_color_1 = '#9E2238'
gradient_color_2 = '#9E2238'

View File

@@ -23,10 +23,9 @@ $powermodemenu = $HOME/.config/rofi/scripts/dmenu_powermodemenu.sh
$browser = env GTK_THEME=Adwaita:light zen-browser
$privateBrowser = env GTK_THEME=Adwaita:light zen-browser --private-window
$notificationCenter = pkill rofi & swaync-client -t -sw || notify-send --hint int:transient:1 "Error SwayNC is down"
$waybar = GTK_THEME="Simply_Circles_Dark" waybar
$waybar = GTK_THEME="Simply_Circles_Dark" waybar -c "$HOME/.config/waybar/config_top.jsonc" -s "$HOME/.config/waybar/style_top.css" &
$mpdpass = kapuchinamusica
$dock = nwg-dock-hyprland -i 25 -w 12 -hi -x -ico view_icon -c "$HOME/.config/rofi/launchers/type-1/launcher.sh"
#################
### AUTOSTART ###

View File

@@ -1,6 +1,4 @@
#!/usr/bin/env sh
STATUSBAR="waybar"
HYPRGAMEMODE=$(hyprctl getoption animations:enabled | awk 'NR==1{print $2}')
if [ "$HYPRGAMEMODE" = 1 ] ; then
hyprctl --batch "\
@@ -13,16 +11,17 @@ if [ "$HYPRGAMEMODE" = 1 ] ; then
keyword decoration:active_opacity 1;\
keyword plugin:hyprfocus:fade_opacity 1"
if pgrep $STATUSBAR > /dev/null; then
pkill $STATUSBAR
waybar -c "$HOME/.config/waybar/config_minimal.jsonc" &
if pgrep waybar > /dev/null; then
pkill waybar
# TODO: lite waybar version
waybar -c "$HOME/.config/waybar/config_top.jsonc" -s "$HOME/.config/waybar/style_top.css" &
fi
exit
fi
if pgrep $STATUSBAR > /dev/null; then
pkill $STATUSBAR
waybar -c "$HOME/.config/waybar/config.jsonc" &
if pgrep waybar > /dev/null; then
pkill waybar
waybar -c "$HOME/.config/waybar/config_top.jsonc" -s "$HOME/.config/waybar/style_top.css" &
fi
hyprctl reload

View File

@@ -2,8 +2,6 @@
if pgrep -x waybar > /dev/null; then
pkill -x waybar
pkill -x nwg-dock-hyprla
else
GTK_THEME="Simply_Circles_Dark" waybar &
nwg-dock-hyprland -i 25 -w 12 -hi -x -ico view_icon -c "$HOME/.config/rofi/launchers/type-1/launcher.sh" &
GTK_THEME="Simply_Circles_Dark" waybar -c "$HOME/.config/waybar/config_top.jsonc" -s "$HOME/.config/waybar/style_top.css" &
fi

View File

@@ -1,8 +0,0 @@
[window]
width=500
height=400
sinkInputType=1
sourceOutputType=1
sinkType=0
sourceType=1
showVolumeMeters=1

12
waybar/colors.css Normal file
View File

@@ -0,0 +1,12 @@
@define-color bg-panel rgba(28, 28, 28, 0.81);
@define-color text-secondary rgba(86, 86, 86, 0.81);
@define-color bg-opaque rgba(23, 28, 39, 0.8);
@define-color border-color-section rgba(0,0,0,0);
@define-color border-color rgba(90, 104, 115, 0.8); /* Matches --noti-border-color */
@define-color text-primary #ffffff;
@define-color text-secondary alpha(@text-primary,.2);
@define-color accent-color #D58399;
@define-color attention #FFFF00;
@define-color warning #FFAA00;
@define-color danger #FF0000;
@define-color success #00FF00;

View File

View File

@@ -1,193 +0,0 @@
// -*- mode: jsonc -*-
{
//"output": "eDP-1",
"output": [
"eDP-1",
"HDMI-A-1"
],
// "layer": "top", // Waybar at top layer
// "position": "bottom", // Waybar position (top|bottom|left|right)
"height": 30, // Waybar height (to be removed for auto height)
// "width": 1280, // Waybar width
"spacing": 0, // Gaps between modules (4px)
// Choose the order of the modules
"modules-left": [
"hyprland/workspaces"
// "custom/submap"
],
"modules-center": [
"mpd"
],
"modules-right": [
"pulseaudio",
"battery",
"network",
"tray",
"clock"
],
// Modules configuration
"hyprland/workspaces": {
"disable-scroll": true,
"all-outputs": false,
"active-only": true,
"warp-on-scroll": false,
"persistent-workspaces": {
// "1": [],
// "2": [],
// "3": [],
// "4": [],
// "5": [],
// "6": [],
// "7": [],
// "8": [],
// "9": [],
// "10": [],
// "11": [],
// "12": []
"eDP-1": [1,2,3,4,5,6,7,8,9],
"HDMI-A-1": [10,11,12],
"FUCKOFF": [13,14]
},
"ignore-workspaces": [
"*13",
"*14"
],
"format": "{icon}",
"format-icons": {
"1": "",
"2": "󱒔",
"3": "󰙏",
"4": "󰉋",
// "5": "5",
// "6": "6",
"7": "󰊗",
"8": "󰭹",
"9": "",
"10": "0",
"11": "-",
"12": "+",
"default": "󰽢",
"empty": "󰄰"
}
},
"mpd": {
"password": "kapuchinamusica",
"artist-len": 30,
"title-len": 65,
"unknown-tag": "n/a",
"format": "{stateIcon} {titleSmart}",
"interval": 1,
"single-icons": {
"on": "1 "
},
"state-icons": {
"paused": "",
"playing": ""
},
"tooltip-format": "MPD (connected)",
"tooltip-format-disconnected": "MPD (disconnected)",
"format-stopped": " Stopping player...",
"on-click": "mpc toggle --password kapuchinamusica"
},
"tray": {
// "icon-size": 21,
"spacing": 10,
"icons": {
"blueman": "bluetooth",
"*": "folder-symbolic"
}
},
"clock": {
// "timezone": "America/New_York",
"interval": 5,
"tooltip-format": "<big>{:%A ( %B %d )}</big>\n<tt><small>{calendar}</small></tt>",
"format": "{:%H:%M:%S}",
"format-alt": "{:%Y-%m-%d}",
"calendar": {
"mode": "year",
"mode-mon-col": 3,
"weeks-pos": "right",
"format": {
"months": "<span color='#ffead3'><b>{}</b></span>",
"days": "<span color='#ac8699'><b>{}</b></span>",
"weeks": "<span color='#BC4056'><b>W{}</b></span>",
"weekdays": "<span color='#F8B5CE'><b>{}</b></span>",
"today": "<span color='#00FFFF'><b><u>{}</u></b></span>"
}
},
"actions": {
"on-click-right": "mode"
}
},
"cpu": {
"format": "{max_frequency:1.2f}GHz 󰓅 {usage}%",
"tooltip": false,
"interval": 15,
"format-icons": [
"󰄰", "󰪞", "󰪟", "󰪠", "󰪡", "󰪢", "󰪣", "󰪤", "󰪥"
]
},
"memory": {
"format": "󰧑 {percentage}% 󰋊 {swapPercentage}%",
"interval": 10
},
"battery": {
"full-at": 98,
"states": {
"good": 85,
"warning": 30,
"critical": 18
},
"format": "{icon} {capacity}%",
"format-full": "{icon} {capacity}%",
"format-charging": "{icon}󱐋{capacity}%",
"format-plugged": "{icon} {capacity}%",
"format-alt": "{time} {icon}",
// "format-good": "", // An empty format will hide the module
"format-full": "󱈏",
"format-icons": ["󰂎", "", "", "󰁽", "", "󰁿", "", "󰂁", "󰂂", ""],
"tooltip-format": "{capacity}%, draws {power:2.1f}W, time is {time}"
},
"network": {
"format-wifi": "{icon}",
"format-ethernet": "{ipaddr}/{cidr} ",
"tooltip-format": "{essid} {ifname} via {gwaddr} ",
"format-linked": "{ifname} (No IP) ",
"format-disconnected": "󰤫",
"format-icons": [
"󰤯", "󰤟", "󰤢", "󰤥", "󰤨"
]
},
"pulseaudio": {
// "scroll-step": 1, // %, can be a float
"format": "{format_source} {volume}%",
"format-bluetooth": "{format_source}󰂰 {volume}%",
"format-bluetooth-muted": "{format_source} 󰂲",
"format-muted": "󰖁",
"format-source": "",
"format-source-muted": " ",
"on-click": "pwvucontrol"
},
"custom/submap": {
"format": "{icon} {text}",
"max-length": 10,
"format-icons": {
"default": "󰥻"
},
"interval": 1,
"exec": "state=$(hyprctl submap) && [[ $state != 'default' ]] && echo $state",
"on-click": "hyprctl dispatch submap reset"
},
"custom/pomodoro": {
"format": "{}",
"return-type": "json",
"exec": "~/.local/bin/waybar-module-pomodoro --persist -w 20 -s 5 -l 20 -i 3 --autob",
"on-click": "~/.local/bin/waybar-module-pomodoro toggle",
"on-click-right": "~/.local/bin/waybar-module-pomodoro reset"
},
"custom/goal": {
"exec": "cat $HOME/.config/waybar/goal.txt",
"format": "󱓧 {}",
"interval": 60
}
}

View File

@@ -8,26 +8,25 @@
// "layer": "top", // Waybar at top layer
// "position": "bottom", // Waybar position (top|bottom|left|right)
"height": 30, // Waybar height (to be removed for auto height)
// "width": 1280, // Waybar width
"width": 1900, // Waybar width
"spacing": 0, // Gaps between modules (4px)
"reload_style_on_change": true,
// Choose the order of the modules
"modules-left": [
"hyprland/workspaces",
"custom/separator_invisible",
"mpd",
"custom/pomodoro"
// "custom/submap"
],
"modules-center": [
"mpd"
"hyprland/workspaces"
],
"modules-right": [
"cpu",
"memory",
"pulseaudio",
"pulseaudio/slider",
"battery",
"network",
"tray",
"clock",
"custom/panel"
"custom/separator_invisible"
],
// Modules configuration
"hyprland/workspaces": {
@@ -58,18 +57,18 @@
],
"format": "{icon}",
"format-icons": {
"1": "",
"2": "󱒔",
"3": "󰙏",
"4": "󰉋",
// "5": "5",
// "6": "6",
"7": "󰊗",
"8": "󰭹",
"9": "",
"10": "0",
"11": "-",
"12": "+",
"1": "󱐡",
"2": "󰰫",
"3": "󰛿",
"4": "󱑤",
"5": "󰲨",
"6": "󰲪",
"7": "󰥱",
"8": "󰷸",
"9": "󱡝",
"10": "󰥱",
"11": "",
"12": "",
"default": "󰽢",
"empty": "󰄰"
}
@@ -77,7 +76,7 @@
"mpd": {
"password": "kapuchinamusica",
"artist-len": 30,
"title-len": 65,
"title-len": 30,
"unknown-tag": "n/a",
"format": "{stateIcon} {titleSmart}",
"interval": 1,
@@ -90,7 +89,7 @@
},
"tooltip-format": "MPD (connected)",
"tooltip-format-disconnected": "MPD (disconnected)",
"format-stopped": " Stopping player...",
"format-stopped": "",
"on-click": "mpc toggle --password kapuchinamusica"
},
"tray": {
@@ -105,8 +104,8 @@
// "timezone": "America/New_York",
"interval": 5,
"tooltip-format": "<big>{:%A ( %B %d )}</big>\n<tt><small>{calendar}</small></tt>",
"format": "{:%H:%M:%S}",
"format-alt": "{:%Y-%m-%d}",
"format": "{:%H:%M}",
"format-alt": "{:%H:%M %d.%m.%Y}",
"calendar": {
"mode": "year",
"mode-mon-col": 3,
@@ -124,7 +123,7 @@
}
},
"cpu": {
"format": "{max_frequency:1.2f}GHz 󰓅 {usage}%",
"format": "󰓅 {usage}%",
"tooltip": false,
"interval": 15,
"format-icons": [
@@ -142,13 +141,12 @@
"warning": 30,
"critical": 18
},
"format": "{icon} {capacity}%",
"format-full": "{icon} {capacity}%",
"format-charging": "{icon}󱐋{capacity}%",
"format-plugged": "{icon} {capacity}%",
"format": "{icon}",
"format-full": "󱈏",
"format-charging": "{icon}󱐋",
"format-plugged": "{icon}",
"format-alt": "{time} {icon}",
// "format-good": "", // An empty format will hide the module
"format-full": "󱈏",
"format-icons": ["󰂎", "", "", "󰁽", "", "󰁿", "", "󰂁", "󰂂", ""],
"tooltip-format": "{capacity}%, draws {power:2.1f}W, time is {time}"
},
@@ -164,28 +162,49 @@
},
"pulseaudio": {
// "scroll-step": 1, // %, can be a float
"format": "{format_source} {volume}%",
"format-bluetooth": "{format_source}󰂰 {volume}%",
"format": "{format_source} ",
"format-muted": "{format_source}",
"format-bluetooth": "{format_source} 󰂰",
"format-bluetooth-muted": "{format_source} 󰂲",
"format-muted": "󰖁",
"format-source": "",
"format-source-muted": " ",
"format-source-muted": "",
"on-click": "pwvucontrol"
},
"pulseaudio/slider": {
"min": 0,
"max": 100,
"orientation": "horizontal"
},
"custom/logo": {
"format": "",
"on-click": "swaync-client -t -sw",
"interval": "once",
"tooltip": false
},
"custom/separator": {
"format": "",
"interval": "once",
"tooltip": false
},
"custom/separator_invisible": {
"format": " ",
"interval": "once",
"tooltip": false
},
"custom/submap": {
"format": "{icon} {text}",
"format": "{icon} {text}",
"max-length": 10,
"format-icons": {
"default": "󰥻"
},
"interval": 1,
"interval": 2,
"exec": "state=$(hyprctl submap) && [[ $state != 'default' ]] && echo $state",
"on-click": "hyprctl dispatch submap reset"
},
"custom/pomodoro": {
"format": "{}",
"return-type": "json",
"exec": "~/.local/bin/waybar-module-pomodoro --persist -w 20 -s 5 -l 20 -i 3 --autob",
"exec": "~/.local/bin/waybar-module-pomodoro --persist -w 20 -s 5 -l 20 -i 3 -p '' -a '' --autob",
"on-click": "~/.local/bin/waybar-module-pomodoro toggle",
"on-click-right": "~/.local/bin/waybar-module-pomodoro reset"
},

0
waybar/style_bottom.css Normal file
View File

View File

@@ -1,29 +1,15 @@
/* GTK Color Definitions */
@define-color bg-primary rgba(28, 28, 28, 0.81);
@define-color bg-secondary rgba(28, 28, 28, 0.81);
@define-color bg-opaque rgba(23, 28, 39, 0.8);
@define-color border-color rgba(90, 104, 115, 1);
@define-color text-primary #ffffff;
@define-color text-secondary #888888;
@define-color accent-color #E96375;
@define-color accent-alt #faa7b3;
@define-color attention #FFFF00;
@define-color warning #FFAA00;
@define-color warning-alt #FFDDAA;
@define-color danger #FF0000;
@define-color success #00FF00;
@define-color success-alt #AAFFAA;
@define-color info #CCEEFF;
* {
font-family: "Iosevka Nerd Font Propo";
font-size: 15px;
}
/* Colors Definitions */
@import "colors.css";
/* Window */
window#waybar {
background-color: transparent;
font-family: "Iosevka Nerd Font Propo";
font-size: 15px;
background-color: @bg-panel;
color: @text-primary;
border-radius: 0 0 10px 10px;
border: 1px solid @border-color;
border-top: none;
transition-property: background-color;
transition-duration: 0.5s;
}
@@ -55,64 +41,62 @@ window#waybar.chromium {
#backlight,
#network,
#pulseaudio,
#pulseaudio-slider,
#wireplumber,
#custom-logo,
#custom-media,
#custom-panel,
#custom-separator,
#tray,
#mode,
#idle_inhibitor,
#scratchpad {
background: linear-gradient(to bottom, @bg-primary, @bg-secondary);
border: 1px solid @border-color;
border-top: none;
padding: 0 10px;
color: @text-primary;
transition: color 0.3s ease, border-color 0.3s ease, background 0.3s ease;
transition: color 0.3s ease, text-shadow 0.3s ease, background 0.3s ease;
}
/* Workspaces */
#workspaces {
background: linear-gradient(to bottom, @bg-primary, @bg-secondary);
border-right: 1px solid @border-color;
border-bottom: 1px solid @border-color;
border-radius: 0 0 10px 0;
margin-right: 10px;
padding-right: 5px;
font-size: 18px;
background-color: transparent;
}
#workspaces button {
padding: 0 5px;
padding: 0 6px;
min-width: 20px;
background-color: transparent;
color: @text-primary;
color: alpha(@accent-color,.5);
border: none;
border-radius: 0;
box-shadow: inset 0 -3px transparent;
}
#workspaces button.empty {
color: @text-secondary;
}
#workspaces button:hover {
background: rgba(0, 0, 0, 0.2);
box-shadow: inset 0 -3px @text-primary;
}
#workspaces button.active.hosting-monitor {
background-color: rgba(0, 0, 0, 0.32);
box-shadow: inset 0 -3px @accent-color;
/* background-color: rgba(0, 0, 0, 0.32); */
/* box-shadow: inset 0 -3px @accent-color; */
color: @accent-color;
text-shadow: 0px 0px 8px @accent-color;
animation: hover 0.8s 1;
}
#workspaces button.urgent {
color: @bg-opaque;
font-weight: 700;
background-color: @attention;
box-shadow: inset 0 -13px @attention;
color: @attention;
text-shadow: 0px 0px 8px @attention;
transition: color 0.5s, box-shadow 0.5s, background 0.5s;
}
#workspaces button:hover {
color: @foreground;
background-color: transparent;
text-shadow: 0px 0px 2px rgba(233, 99, 117, 1);
}
/* Side Module Groups */
.modules-left {
border-left: none;
@@ -132,21 +116,17 @@ window#waybar.chromium {
}
#cpu {
margin-left: 20px;
border-right: none;
border-radius: 0 0 0 10px;
}
#memory {
border-left: none;
border-radius: 0 0 10px 0;
}
/* Custom Modules */
#custom-pomodoro,
#custom-goal {
color: @warning-alt;
margin: 0 20px;
#custom-pomodoro {
color: @text-secondary;
}
#custom-pomodoro {
@@ -160,19 +140,22 @@ window#waybar.chromium {
}
#custom-submap {
color: @accent-color;
border-radius: 0 0 10px 10px;
color: @text-primary;
}
/* Pomodoro States */
#custom-pomodoro.work {
color: @accent-color;
}
#custom-pomodoro.break {
color: @success;
box-shadow: inset 0 -3px @success;
text-shadow: 0px 0px 4px rgba(0, 255, 0, 1);
}
#custom-pomodoro.pause {
color: @warning;
box-shadow: inset 0 -3px @warning;
color: @attention;
text-shadow: 0px 0px 4px @attention;
}
#custom-pomodoro.break + #custom-goal,
@@ -186,52 +169,58 @@ window#waybar.chromium {
#memory,
#memory.swap,
#disk {
color: @info;
}
/* Standard Modules - border adjustments */
#clock,
#battery,
#temperature,
#backlight,
#network,
#wireplumber,
#custom-media,
#custom-panel,
#tray,
#mode,
#idle_inhibitor,
#scratchpad {
border-left: none;
border-right: none;
}
#custom-panel {
padding: 0;
padding-right: 10px;
color: @text-primary;
}
#pulseaudio {
padding-right: 0;
}
#pulseaudio-slider slider {
min-height: 0px;
min-width: 0px;
opacity: 0;
background-image: none;
border: none;
box-shadow: none;
}
#pulseaudio-slider trough {
min-height: 10px;
min-width: 25px;
border-radius: 5px;
background: alpha(@text-primary,.2);
}
#pulseaudio-slider highlight {
min-width: 10px;
border-radius: 5px;
background: @text-primary;
}
#pulseaudio {
border-left: 1px solid @border-color;
border-right: none;
border-radius: 0 0 0 10px;
margin-left: 20px;
}
/* MPD specific styles */
#mpd {
border-radius: 0 0 10px 10px;
transition: color 2s, border-color 2s, background 2s;
font-weight: 700;
transition: color 2s, background 2s;
}
#mpd.playing {
color: @accent-alt;
color: @accent-color;
}
#mpd.stopped {
border-color: transparent;
background: transparent;
/* color: rgba(255,255,255,0.5); */
color: transparent;
background: transparent;
}
#mpd.paused {
font-weight: normal;
color: @text-secondary;
}
/* Hover Effects */
@@ -244,7 +233,11 @@ window#waybar.chromium {
#backlight:hover,
#network:hover,
#pulseaudio:hover,
#cpu:hover,
#memory:hover,
#wireplumber:hover,
#custom-logo:hover,
#custom-pomodoro:hover,
#custom-media:hover,
#custom-panel:hover,
#mode:hover,
@@ -252,37 +245,34 @@ window#waybar.chromium {
#scratchpad:hover,
#power-profiles-daemon:hover {
color: @accent-color;
text-shadow: 0px 0px 8px @accent-color;
transition: color 0.3s, box-shadow 0.3s, background 0.3s;
}
#pulseaudio-slider:hover highlight {
background: @accent-color;
box-shadow: 0px 0px 8px @accent-color;
transition: color 0.3s, box-shadow 0.3s, background 0.3s;
}
/* Battery States */
#battery.charging,
#battery.plugged {
color: @success-alt;
box-shadow: inset 0 -3px @success-alt;
color: @success;
text-shadow: 0px 0px 8px @success;
transition: color 0.3s, box-shadow 0.3s, background 0.3s;
}
#battery.warning:not(.charging) {
color: @warning;
border-bottom: 3px solid @warning;
text-shadow: 0px 0px 8px @warning;
transition: color 0.3s, box-shadow 0.3s, background 0.3s;
}
#battery.critical:not(.charging) {
color: @danger;
border-bottom: 3px solid @danger;
}
/* Power Profiles */
#power-profiles-daemon {
color: @text-primary;
font-size: 17px;
padding: 0 7px 0 12px;
}
/* Warning States */
#temperature.critical,
#idle_inhibitor.activated {
animation: blink-warning 2s infinite;
text-shadow: 0px 0px 8px @danger;
transition: color 0.3s, box-shadow 0.3s, background 0.3s;
}
/* Tray */