Different focus borders used in menubar

[juliusknorr]

Some of the menu icons use a primary color outline while most of them use the text colored one:

Screen.Recording.2022-07-20.at.08.19.18.mov

[susnux]

Or like the emoji picker: No outline.
For me it looks even weirder (Firefox 102):

[juliusknorr]

The white background should be fixed with latest server nextcloud/server#33246

[susnux]

The white background should be fixed with latest server nextcloud/server#33246

@juliushaertl Only if you have selected the dark theme, when using the system default theme and use a dark color theme, as I do, this still shows the white background.

[juliusknorr]

Weird, I'm using exactly the same constellation. The DarkTheme class is being pulled in depending on the prefers-color-scheme value. Maybe still in the browser cache?

[susnux]

I thought I refreshed the cache... but you are right.

Looks like Buttons use the text color, while ActionButtons (sub menus) use the primary color, and the emoji picker is special.
The emoji picker uses a button, but sets the class to entry-action__button, so there is a clash between the styling rules of Button and ActionButton leading to no outline on focus at all.

[juliusknorr]

Related upstream issue for button component

[juliusknorr]

This is fixed with 26.