[WIP] Improved settings UI

[clefebvre]

Requires linuxmint/python3-xapp#24

The purpose is to improve the look and feel of the settings application. Some of the ideas are inspired by what has been done in GNOME, KDE and Ubuntu and what's been observed outside of the Linux community.

Rounded sections

Rounded sections make the UI more modern and integrate nicely with the rounded nature of Cinnamon themes. In the screenshot below, the first section is rounded, the second one isn't.

The rounded section should look nice in any theme but also be themeable via newly introduced CSS style names.

Subtitles and tooltips hints

Tooltip hints make it more obvious when more info is available.

Subtitles allow us to squeeze in more information. Along with tooltips they can reduce the need for text blocks.

Disabled settings vs hidden settings

Cinnamon Settings relies on revealers to show/hide settings which depend on others. Although that's pretty nifty, it makes screenshots less consistent, it's harder to remember when a particular setting is or to find it when looking for it. In general, it's also a bad idea to hide widgets away from the user or having things suddenly pop up.

This PR goes towards showing everything and relying on sensitivity to disable settings which aren't available.

[clefebvre]

Here's a quick prototype to illustrate old vs new class structures and to troubleshoot with Glade:

settings.tar.gz

To run it with Gtk Inspector:

gsettings set org.gtk.Settings.Debug enable-inspector-keybinding true
GTK_DEBUG=interactive python3 ./settings.py

[leigh123linux]

I really dislike the shadow.

[clefebvre]

We can improve the default CSS. Experiment with it if you have the time and let me know if you find something better.

[clefebvre]

Here it is with no shadow.

Note: Ignore the bottom border, it has an extra separator which shouldn't be there.

[clefebvre]

Here's an example in GNOME

Rounded section, shadows, subtitles and tooltip hint.

[axel358]

For the Mint-Y style, I also agree that looks better with no shadow. I think subtitles should be preferred over tooltips when possible, as they expose the additional information/context right away to the user. It would also be nice to see a unified settings style between all OS components. xlets and system settings modules use the style shown above, but apps like the file manager use a completely different one

[anaximeno]

Another point that might be worth looking at, is setting a maximum width for the sections because on bigger screens the description of the option and their action button can be too far away from each other which could lead to more effort trying to understand and modify each setting option:

GNOME already has a limit for the width of the sections in settings IIRC.

[JosephMcc]

@anaximeno I'm pretty sure it was like that when we first implemented this style of settings. But people complained that it "didn't" expand to fill the window. I'm also not sure how many people maximize a settings window on a large screen. There is no reason to.

[clefebvre]

Quick note on this: It was postponed to 22.2.

[anaximeno]

@anaximeno I'm pretty sure it was like that when we first implemented this style of settings. But people complained that it "didn't" expand to fill the window.

I see.

I'm also not sure how many people maximize a settings window on a large screen. There is no reason to.

I think it's not too uncommon, generally, you maximize a window if you want to focus on it and avoid whatever is in the background taking your attention, I can see this regularly being the case when you're looking for something in settings.