JakeStanger/ironbar

Fork 0

mirror of https://github.com/JakeStanger/ironbar.git synced 2026-07-11 08:15:21 +01:00

[GH-ISSUE #1110] Tray Module css styling question. #8773

New issue

Closed

opened 2026-05-23 03:54:15 +01:00 by JakeStanger · 6 comments

JakeStanger commented

2026-05-23 03:54:15 +01:00

Owner

Originally created by @Guardian9978 on GitHub (Aug 8, 2025).
Original GitHub issue: https://github.com/JakeStanger/ironbar/issues/1110

I have not seen anywhere in the wiki about styling the menu that appears when you right click one of the Tray Module's app icons.

I have had some success by styling .popup like so:

.popup {
  background-color: #FF0000;
}

But I wanted to style the tray right click menu directly so i tried: (But this does not work.)

.popup-tray {
  background-color: #FF0000;
}

I was also wanting to style the on hover so I tried all of these: (no success here either.)

.popup:hover, .popup .item:hover, .popup-tray:hover, .popup-tray .item:hover {
  background-color: #FF0000;
}

Originally created by @Guardian9978 on GitHub (Aug 8, 2025). Original GitHub issue: https://github.com/JakeStanger/ironbar/issues/1110 I have not seen anywhere in the wiki about styling the menu that appears when you right click one of the Tray Module's app icons. I have had some success by styling .popup like so: ``` .popup { background-color: #FF0000; } ``` But I wanted to style the tray right click menu directly so i tried: (But this does not work.) ``` .popup-tray { background-color: #FF0000; } ``` I was also wanting to style the on hover so I tried all of these: (no success here either.) ``` .popup:hover, .popup .item:hover, .popup-tray:hover, .popup-tray .item:hover { background-color: #FF0000; } ```

JakeStanger

2026-05-23 03:54:15 +01:00

closed this issue
added the
T:Question

A:Config

M:Tray
labels

JakeStanger commented

2026-05-23 03:54:15 +01:00

Author

Owner

@BBFifield commented on GitHub (Aug 22, 2025):

I managed to style the right-click menu in the past. Iirc, you need to target the "decoration" element rather than any .popup class.

And I don't think the tray exposes any hover states in the current implementation, unfortunately.

@BBFifield commented on GitHub (Aug 22, 2025): I managed to style the right-click menu in the past. Iirc, you need to target the "decoration" element rather than any .popup class. And I don't think the tray exposes any hover states in the current implementation, unfortunately.

JakeStanger commented

2026-05-23 03:54:15 +01:00

Author

Owner

@JakeStanger commented on GitHub (Aug 22, 2025):

The tray currently uses an external library (libdbusmenu-gtk3) for rendering the menu, which somewhat sits outside the regular widget tree. It should be made of Menu and MenuItem widgets that you can style directly, but there's little I can do with it at the moment.

The GTK 4 version (#1043) includes a custom UI that will fully integrate as a popup and should provide more control

@JakeStanger commented on GitHub (Aug 22, 2025): The tray currently uses an external library (`libdbusmenu-gtk3`) for rendering the menu, which somewhat sits outside the regular widget tree. It should be made of `Menu` and `MenuItem` widgets that you can style directly, but there's little I can do with it at the moment. The GTK 4 version (#1043) includes a custom UI that will fully integrate as a popup and should provide more control

JakeStanger commented

2026-05-23 03:54:15 +01:00

Author

Owner

@BBFifield commented on GitHub (Aug 22, 2025):

Just looked at my own css. Turns out I only targeted decoration to apply a box-shadow to the menus, so it's useful if you ever need to do that.

The contents of the menu itself are themed by targeting menu, menuitem, menuitem label and menuitem cellview.

@BBFifield commented on GitHub (Aug 22, 2025): Just looked at my own css. Turns out I only targeted `decoration` to apply a box-shadow to the menus, so it's useful if you ever need to do that. The contents of the menu itself are themed by targeting `menu`, `menuitem`, `menuitem label` and `menuitem cellview`.

JakeStanger commented

2026-05-23 03:54:15 +01:00

Author

Owner

@JakeStanger commented on GitHub (Sep 7, 2025):

Closing as resolved due to lack of response - any further issues let me know and we can re-open

@JakeStanger commented on GitHub (Sep 7, 2025): Closing as resolved due to lack of response - any further issues let me know and we can re-open

JakeStanger commented

2026-05-23 03:54:15 +01:00

Author

Owner

@freijon commented on GitHub (Dec 25, 2025):

Now after the migration to GTK4, how would I style the hover color of the new GTK4 popover?

@freijon commented on GitHub (Dec 25, 2025): Now after the migration to GTK4, how would I style the hover color of the new GTK4 popover?

JakeStanger commented

2026-05-23 03:54:15 +01:00

Author

Owner

@JakeStanger commented on GitHub (Dec 28, 2025):

I'm assuming you mean the colour of the menu buttons for the tray module specifically? If so you can target as follows:

.tray popover modelbutton:hover {
    background-color: red;
}

@JakeStanger commented on GitHub (Dec 28, 2025): I'm assuming you mean the colour of the menu buttons for the tray module specifically? If so you can target as follows: ```css .tray popover modelbutton:hover { background-color: red; } ```