You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
System info:
Distro: Fresh (almost) install of Arch linux
WM: Hyprland
By default GTK_THEME variable is unset
I'll include only the part of my style.css related to centering modules.)
I just want to change the text color of a button when I hover over it. I don't want the background of the button to be affected.
But no matter what I try, nothing seems to work. So far, I've tried tweaking the background-color property in every possible way (even using non-transparent variants), removing any definition for the button's background color entirely, etc.
Also, I noticed that when I temporarily set the button's background color to red (for debugging), it flickers red on hover, but then quickly and smoothly transitions (when transition is not set to none) to that strange dark background I'm trying to get rid of.
Interestingly, when I launch Waybar with GTK_THEME=Adwaita, that dark background is replaced with a light one instead.
code (sorry for not using `` for code, it doesn't works here for some reason):
.modules-center {
background-color: rgba(69, 71, 90, 0.7);
border-radius: 10px;
padding: 0px 25px;
border: 1px solid rgba(148, 226, 213, 0.7);
margin: 0px 5px;
}
window#waybar .modules-center #workspaces button:nth-child(1):hover {
color: @ peach;
background-color: red;
}
#workspaces button:nth-child(2):hover {
color: @ sapphire;
}
#workspaces button:nth-child(3):hover {
color: @ green;
}
#workspaces button:nth-child(4):hover {
color: @ blue;
}
#workspaces button:nth-child(5):hover {
color: @ mauve;
}
I'll attach the file itself: style.txt
but it's hard to navigate and has a lot of unused parts so
P.S. I had to put spaces in between @ and color definition, because github was pinging users with these names
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
System info:
Distro: Fresh (almost) install of Arch linux
WM: Hyprland
By default GTK_THEME variable is unset
I'll include only the part of my style.css related to centering modules.)
I just want to change the text color of a button when I hover over it. I don't want the background of the button to be affected.
But no matter what I try, nothing seems to work. So far, I've tried tweaking the background-color property in every possible way (even using non-transparent variants), removing any definition for the button's background color entirely, etc.
Also, I noticed that when I temporarily set the button's background color to red (for debugging), it flickers red on hover, but then quickly and smoothly transitions (when transition is not set to none) to that strange dark background I'm trying to get rid of.
Interestingly, when I launch Waybar with GTK_THEME=Adwaita, that dark background is replaced with a light one instead.
code (sorry for not using `` for code, it doesn't works here for some reason):
.modules-center {
background-color: rgba(69, 71, 90, 0.7);
border-radius: 10px;
padding: 0px 25px;
border: 1px solid rgba(148, 226, 213, 0.7);
margin: 0px 5px;
}
button {
font-size: 5px;
border: none;
border-radius: 0;
}
#workspaces button {
padding: 0 5px;
background-color: transparent;
color: @ mantle;
/transition: none;/
}
#workspaces button:nth-child(1).active {
color: @ peach;
}
#workspaces button:nth-child(2).active {
color: @ sapphire;
}
#workspaces button:nth-child(3).active {
color: @ green;
}
#workspaces button:nth-child(4).active {
color: @ blue;
}
#workspaces button:nth-child(5).active {
color: @ mauve;
}
window#waybar .modules-center #workspaces button:nth-child(1):hover {
color: @ peach;
background-color: red;
}
#workspaces button:nth-child(2):hover {
color: @ sapphire;
}
#workspaces button:nth-child(3):hover {
color: @ green;
}
#workspaces button:nth-child(4):hover {
color: @ blue;
}
#workspaces button:nth-child(5):hover {
color: @ mauve;
}
I'll attach the file itself:
style.txt
but it's hard to navigate and has a lot of unused parts so
P.S. I had to put spaces in between @ and color definition, because github was pinging users with these names
Beta Was this translation helpful? Give feedback.
All reactions