nextcloud-vue
nextcloud-vue copied to clipboard
nextcloud-libraries
Status icon has visible border instead of depending on background
The status icon border/background currently is always set to color-main-background. This means that in light theme, it is always white. On other backgrounds like in the header or in various states like hovered/focused/active/selected it looks off. Just like with other icons such as the favorite overlay in the files list, it is intended to create a slight gap between the icon and the element it overlays – not to be a visible border.
This occurs in various places, here are some examples:
Top right account menu
The status of the top right avatar. Granted this depends on the theming background, but we can at least solve it for the default installation, and possibly even for the shipped themes.
File sharing sidebar
The selected suggestion has a grey background, but is not the same for the status border. Additionally, the status icon seems to be cut off a bit, leading to the crescent shape being barely recognizable?
Talk navigation
In the default state it is a bit difficult to set a border which fits the background since we have the glass look and the variable background. But in hover/focus and active state we know what the background is.
Talk @-mention suggestions
The status icon of the active/selected person should be adjusted to get a border that matches the background of the selected entry.
Deck assignments
Similar as in other examples, the status for the selected entry would look nicer with the color adjusted. Additionally, in the input field the same issue as in Files happens where the status icon is somehow cut off:
(The concept of the issue is basically the same as for the favorite overlay icon: https://github.com/nextcloud-libraries/nextcloud-vue/issues/4872 )
This would be a nice papercut for us to fix in the components? @szaimen are you interested in looking into this?
This would be a nice papercut for us to fix in the components? @szaimen are you interested in looking into this?
I can look into it next week earliest (i am on vacation tomorrow for one day)
