Replace framed views with single-pixel separator lines
Open, NormalPublic

Description

We already did this with sidebars in settings windows (T11279), to great effect and acclaim. Now they look fantastic:

Kirigami also uses this style for desktop apps created with it, and it looks great. For visual appeal and consistency's sake, it's time to bring this style into more of our QWidgets apps, by putting similar single-pixel lines in the following places:

  • Underneath toolbars, to separate them from content views below them
  • Separating QDockWidgets from main views beside them
  • Separating other sidebars more generally from content views beside them
  • Separating status bars from content views above them

Then we should remove the "framed" appearance from content views, since it's no longer necessary once they're framed by the these single-pixel separator lines and the window edges.

The idea is to reach something like the following for Dolphin:

ngraham created this task.Sep 15 2019, 5:19 PM
ngraham triaged this task as Normal priority.
ngraham updated the task description. (Show Details)Sep 15 2019, 5:22 PM
ngraham added a project: Goal: Consistency.
ngraham added a subscriber: Goal: Consistency.
ndavis added a subscriber: ndavis.Sep 26 2019, 7:38 AM

How much of this is up to breeze and how much is up to the application? This looks pretty, but if too much of it depends on breeze, it may fall apart when 3rd party apps are thrown into the mix.

mmustac added a subscriber: mmustac.EditedSep 26 2019, 9:43 AM

With sidebar ?

  • Looks fantastic!!!

    One way we could get views next to other views to look right is to use the alternate view background color for sidebars

    One way we could get views next to other views to look right is to use the alternate view background color for sidebars

    In general that only makes sense for multi-column tables, because the alternating backgrounds are a visual aid to help your eye line up the data in each row. When there's only one column--like in these kinds of sidebars--it's just extra visual noise IMO.

    What I'm saying is that doing something like what VS Code does could work for making views next to views look good, like a sidebar next to a list view.

    Oh I see what you mean: an alternate background color, not alternating background colors.

    I agree, that could work, as long as the alternate color isn't too different. macOS does this too, using a subtle light blue background color for sidebars.