JakeStanger/ironbar

Fork 0

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

[GH-ISSUE #619] [Question] ChromeOS style and related problems #4422

New issue

Open

opened 2026-05-23 00:53:10 +01:00 by JakeStanger · 6 comments

JakeStanger commented

2026-05-23 00:53:10 +01:00

Owner

Originally created by @madfanat on GitHub (Jun 2, 2024).
Original GitHub issue: https://github.com/JakeStanger/ironbar/issues/619

Is your question related to a problem? Please describe.
I've tried to set specific border-radius for the edge nodules, but without success. The settings apply to the children of the children of the bar, not the children of the bar. For example, #bar #start .item:not(:first_child):not(:last_child) applies to workspace entries, but no to the workspace widget itself. Here's exactly what I tried:

#bar #end {
}

#bar #end .item:not(:first_child):not(:last_child) {
}

#bar #end > *:nth-child(1) {
}

#bar #end :not(:first_child):not(:last_child) {
}

#bar #end:not(:first_child):not(:last_child) {
}

Describe the solution you'd like

Setting specific border-radius for the first and the last modules on the right side of the bar
Hide the tray widget when there are no items so it doesn't take up space
Hide the notification widget when there are no notifications so it doesn't take up space

Describe alternatives you've considered

ChromeOS bar
https://github.com/Alexays/Waybar/issues/1746

Additional context

Originally created by @madfanat on GitHub (Jun 2, 2024). Original GitHub issue: https://github.com/JakeStanger/ironbar/issues/619 **Is your question related to a problem? Please describe.** I've tried to set specific border-radius for the edge nodules, but without success. The settings apply to the children of the children of the bar, not the children of the bar. For example, `#bar #start .item:not(:first_child):not(:last_child)` applies to workspace entries, but no to the workspace widget itself. Here's exactly what I tried: ``` #bar #end { } ``` ``` #bar #end .item:not(:first_child):not(:last_child) { } ``` ``` #bar #end > *:nth-child(1) { } ``` ``` #bar #end :not(:first_child):not(:last_child) { } ``` ``` #bar #end:not(:first_child):not(:last_child) { } ``` **Describe the solution you'd like** - Setting specific border-radius for the first and the last modules on the right side of the bar - Hide the tray widget when there are no items so it doesn't take up space - Hide the notification widget when there are no notifications so it doesn't take up space **Describe alternatives you've considered** - ChromeOS bar - https://github.com/Alexays/Waybar/issues/1746 **Additional context** ![image](https://github.com/JakeStanger/ironbar/assets/168630462/7e6c0ae7-cc78-4fc5-8110-d0b1dd3515cb)

JakeStanger added the

T:Question

label

2026-05-23 00:53:10 +01:00

JakeStanger commented

2026-05-23 00:53:10 +01:00

Author

Owner

@JakeStanger commented on GitHub (Jun 2, 2024):

Setting specific border-radius for the first and the last modules on the right side of the bar

For this you can use the .widget selector, eg .widget:first-child to select the first in any of start/center/end (or be specific with .workspace:first-child).

Hide the tray widget when there are no items so it doesn't take up space

Currently this is not possible through Ironbar itself, although I am possibly looking to change that as part of the next update or so.

You could potentially do this using show_if and an external script which checks DBus. You can look at org.kde.StatusNotifierWatcher StatusNotifierWatcher and the RegisteredStatusNotifierItems property.

Hide the notification widget when there are no notifications so it doesn't take up space

Same story as above currently. swaync exposes a pretty good DBus interface you can query to find the count:

@JakeStanger commented on GitHub (Jun 2, 2024): > Setting specific border-radius for the first and the last modules on the right side of the bar For this you can use the `.widget` selector, eg `.widget:first-child` to select the first in any of start/center/end (or be specific with `.workspace:first-child`). > Hide the tray widget when there are no items so it doesn't take up space Currently this is not possible through Ironbar itself, although I am possibly looking to change that as part of the next update or so. You could potentially do this using `show_if` and an external script which checks DBus. You can look at `org.kde.StatusNotifierWatcher StatusNotifierWatcher` and the `RegisteredStatusNotifierItems` property. ![image](https://github.com/JakeStanger/ironbar/assets/5057870/3e182b9b-4218-44b6-a847-5a03874943c2) > Hide the notification widget when there are no notifications so it doesn't take up space Same story as above currently. `swaync` exposes a pretty good DBus interface you can query to find the count: ![image](https://github.com/JakeStanger/ironbar/assets/5057870/cab4d073-2052-4aba-8550-5ab55a4f1efe)

JakeStanger commented

2026-05-23 00:53:10 +01:00

Author

Owner

@madfanat commented on GitHub (Jun 2, 2024):

For this you can use the .widget selector, eg .widget:first-child to select the first in any of start/center/end (or be specific with .workspace:first-child).

Well, I guess it applies to the first element of the module (like the first instance of a clock or volume control). But I want it to apply to the edge widgets on the right side of the bar. In this case, the first would be the volume control and the last would be the notification widget. And I want to apply border-radius to the widget itself, not to its child items. Here's what I got now:

@madfanat commented on GitHub (Jun 2, 2024): > For this you can use the `.widget` selector, eg `.widget:first-child` to select the first in any of start/center/end (or be specific with `.workspace:first-child`). Well, I guess it applies to the first element of the module (like the first instance of a clock or volume control). But I want it to apply to the edge widgets on the right side of the bar. In this case, the first would be the volume control and the last would be the notification widget. And I want to apply `border-radius` to the widget itself, not to its child items. Here's what I got now: ![image](https://github.com/JakeStanger/ironbar/assets/168630462/e9df132b-3b89-4aee-8d75-29604fe4d92d)

JakeStanger commented

2026-05-23 00:53:11 +01:00

Author

Owner

@JakeStanger commented on GitHub (Jun 2, 2024):

Well, I guess it applies to the first element of the module

Incorrect, it applies to any widget which is the first in its container. So you can do

.end .widget:first-child

.end .volume:first-child

to select it

@JakeStanger commented on GitHub (Jun 2, 2024): > Well, I guess it applies to the first element of the module Incorrect, it applies to any widget which is the first in its container. So you can do ```css .end .widget:first-child ``` or ```css .end .volume:first-child ``` to select it

JakeStanger commented

2026-05-23 00:53:11 +01:00

Author

Owner

@madfanat commented on GitHub (Jun 2, 2024):

Oh, then I'll try to explain more clearly. I want to work with the edge widgets (containers?) on the right side of the bar. In this case, I'm representing the list like this: [volume, clock, notifications]. And I want to select the first and the last items of the list and assign certain properties to them. In this case it would be volume and notification widgets.

@madfanat commented on GitHub (Jun 2, 2024): Oh, then I'll try to explain more clearly. I want to work with the edge widgets (containers?) on the right side of the bar. In this case, I'm representing the list like this: [volume, clock, notifications]. And I want to select the first and the last items of the list and assign certain properties to them. In this case it would be volume and notification widgets.

JakeStanger commented

2026-05-23 00:53:11 +01:00

Author

Owner

@JakeStanger commented on GitHub (Jun 2, 2024):

Have you tried the selectors above to see if they work for you?

@JakeStanger commented on GitHub (Jun 2, 2024): Have you tried the selectors above to see if they work for you?

JakeStanger commented

2026-05-23 00:53:11 +01:00

Author

Owner

@madfanat commented on GitHub (Jun 2, 2024):

Yeah, I've tried that and I don't see any impact for some reason.
What I want would just be a contraction of

.volume, 
.clock {
  border-radius: 0;
}

@madfanat commented on GitHub (Jun 2, 2024): Yeah, I've tried that and I don't see any impact for some reason. What I want would just be a contraction of ``` .volume, .clock { border-radius: 0; } ```