Open LunarTwilight opened 2 years ago
Thanks for reporting!
I was able to reproduce this in both Chrome and Firefox with short systemd service names. It's important to note that at least on Fedora, none of the default services have names this short to see this problem.
The menu would be cut off on the right for long names and/or mobile mode if we changed the alignment.
Here's a screenshot in mobile, with a standard name:
I do have a test service and it does happen in mobile also, as the name is so short:
We could fix this for mobile, by always aligning the menu icon to the right. For desktop, it's trickier. A simple, but not correct, approach would be to add a min-width for the text, but then it's going to break like the top screenshot in various languages.
If we combine this with breakpoint alignment in the <Dropdown>
component, we could have the position the same on desktop modes and right-aligned in mobile, then have
<Dropdown
alignments={{
default: 'right',
sm: 'left'
}}
...
>
To align it, we would add some CSS, like this, for a mobile-only breakpoint:
.service-top-panel .pf-c-dropdown {
flex: auto;
justify-content: end;
}
I think this can be done with PatternFly utilities:
pf-u-flex-grow-on-sm pf-u-justify-content-flex-end-on-sm
End result would look like this in mobile:
And like this on desktop:
Oh yeah, I forgot that cockpit has a mobile UI whoops. Your solution looks great.
See it here too:
Just create: ~/.config/systemd/user/a.service
[Unit]
Description=a
[Service]
ExecStart=/usr/bin/true
[Install]
WantedBy=default.target
And:
systemctl --user daemon-reload
Note that, the Dropdown component has position=right
but that does nothing good for us. Removing that seems to do the right thing for me:
Desktop:
Mobile:
Explain what happens
/system/services#/test.service
)Version of Cockpit
264-1~bpo20.04.1
Where is the problem in Cockpit?
Services
Server operating system
Ubuntu
Server operating system version
20.04.4 LTS
What browsers are you using?
Chrome
System log
No response