search

Alexays / Waybar

Highly customizable Wayland bar for Sway and Wlroots based compositors. :v: :tada:
MIT License
6.39k stars 696 forks source link

icon in dark mode? #3328

Open Nambers opened 3 months ago

Nambers commented 3 months ago

I'm using waybar with Hyprland in Arch. My waybar background is in dark and I bearly can see my network and input-keyboard icons. Is there a way to change my icon into dark mode or etc to make them have light edge? What I tried:

  1. changing KDE theme and KDE icon theme
  2. using waybar CSS: but it doesn't support those technics that can make it light

e.g.: image

apiraino commented 3 months ago

Can you show your style.css for waybar?

Did you try changing colors and transparency with window#waybar? (I am not familiar with hyprland nor kde)

Nambers commented 3 months ago

Can you show your style.css for waybar?

it is actually this one: https://github.com/Alexays/Waybar/wiki/Examples#cjbassis-configuration but this is what mine looks: image

Did you try changing colors and transparency with window#waybar? (I am not familiar with hyprland nor kde)

yes changing bg color to white will help. But what I though is to change the edge of trays icons into white?

apiraino commented 3 months ago

yes changing bg color to white will help. But what I though is to change the edge of trays icons into white?

Hmm I'm not sure Waybar can interfere with the style of icons of other applications. Maybe you can apply style to the tray Waybar group using the #tray CSS ID selector?

Nambers commented 3 months ago

yes changing bg color to white will help. But what I though is to change the edge of trays icons into white?

Hmm I'm not sure Waybar can interfere with the style of icons of other applications. Maybe you can apply style to the tray Waybar group using the #tray CSS ID selector?

Sure I can just set bg color into white for #tray , but the visual looks bad... So I'm here to find some potential better solution for that.

RobertMueller2 commented 2 months ago

There's probably better styles for this, but GTK_DEBUG=interactive told me this can be used to style the icons:

#tray widget image {
    border: 1px solid #ffffff;
}

satty-20240722-16:49:54

909oce commented 1 month ago

I've tried messing around with this a little bit too and I'm getting nowhere. I've tried messing with the CSS and renaming/adding icons in my GTK icon theme, neither of which seem to affect it. It would be cool to see some kind of way to atleast even use the CSS filter property to greyscale the icons. I'm not sure how feasible it is, but unfortunately in the current state traybar icons are just super ugly and out of place. It's weird because some things like Network Manager use the icon provided in my theme and look great, but then there's apps like Discord and Steam which don't. I'm not really sure if I'm doing something wrong with my icon theme which causes this.