Taro Tanaka requested to merge eatsu/plasma-framework:coherent-panel-buttons into master Oct 28, 2023

This commit replaces the unrounded, edge-to-edge rectangle style with a rounded, tool button-like style.

In general, this style uses a background to indicate whether selected or not, and a bar to indicate whether opened or not.

In addition, this adds hover and pressed styles to each state, launcher (unopened one), minimized, focus and attention.

This makes our panel look cleaner and more accessible, because usually only a selected item gets a background in a panel.

The additional pressed styles require: plasma-desktop!1805

Before	After

Related merge requests and issues

@teams/vdg @teams/usability

Original title and description, for history

breeze: Make panel buttons more consistent with the rest of the styles

Currently a bar style is used for regular panel buttons and an edge-to-edge square style is used for task manager buttons. They can look out of place with other elements.

This commit replaces them with the common tool button style, so they look more consistent.

This makes our panel look cleaner and more accessible, because usually only a selected button gets a background in a panel.

Note: Updated the whole highlight style as there seems to be a consensus on removing the outline (except for the focused state). This style is not final and is subject to change through further discussion.

Screenshots

Initial version

Task manager buttons

Icon-only (from left: none, minimized, normal, hover, focus, attention, progress):

Traditional:

Regular panel buttons

Notes/TODO

The tab bar style change in popovers is not necessarily intentional, and I'm not sure if it is OK/works well. Ideally IMHO panel buttons and popover tabs should be able to have separate styles, but I'm not sure if it's possible while preserving the theme's backward compatibility. See: plasma-desktop!1830
(On the default 44px panel) 32x32 TM icons are too big compared to the new button style (and other panel icons), so I changed the vertical margins from 4 to 8 to make them smaller. The resulting 22x22 task icons look better, but a little bit too small IMO. I wonder if we could set 24x24 instead when appropriate.

32x32 22x22
Vertical 44px panels still have 32x32 task icons and wrong task button size, because it seems that we currently cannot set the margins depending on the panel orientation. (Or am I missing something?) It should really be like:
.
~~The application launcher icon is also still a bit too big compared to the new button style (and other panel icons). Maybe 22x22 or 24x24 icon should be used there IMO.~~
Initially I made Task Manager icons smaller on the default 44px panel, but reverted that for now. Sizing discussion is in: teams/vdg/issues#31
The progress now look broken when it's at around start. (This bug existed before, but was not very noticeable on the original version. If I remember correctly this didn't happen until version 5.24 or so.)
With the new button style, the extra padding at the start and end of the floating panel is not necessary.