Server: app settings dialog visibility should be increased

[j-ed]

Expected behavior

If an app provides a settings dialog, its visibility should be increased by using a different color or by separating the dialog with a small line etc.

Mookup 1:

Mookup 2:

Current behavior

If an app provides a setting dialog, it is only indicated by a gear symbol and the word 'settings' which make difficult to see for many people. Additionally an opened dialog is not separated clear enough from underlying information which makes it also difficult to see where the dialog exactly begins.

Example 1:

Example 2:

Steps to reproduce

1. Open the files, calender or contacts app
2. Check how the settings dialog is displayed.

Environment

Server Configuration

OS: Linux 3.2.82
Web server: Apache2 2.4.25
Database: MariaDB 5.5.53
PHP version: 5.6.23
Nextcloud version: 10.0.2

Client Configuration

Browser: Mozilla Firefox 50.1.0
Operating system: Windows 7

[MorrisJobke]

cc @jancborchardt

[skjnldsv]

For reference, primary on the button:

[MorrisJobke]

I don't like it, because it draws too much attention. Sorry @skjnldsv

[skjnldsv]

Don't like it either! :p
Was for reference in case of someone wanted to try it too ^^

[skjnldsv]

If we just put a border top we get a slightly difference, and the blue border automatically gets set on hover/open :)

[skjnldsv]

Can we implement this, this is a simple fix.
Top border is okay for you? @nextcloud/designers

[eppfel]

Feels a bit out of place...

[skjnldsv]

@eppfel, fair enough. An idea? :)

[eppfel]

Nope, the issue is only when it the sidebar is full, maybe there is a way to address that in particular. A shadow would be a fitting, but that's not the Nextcloud style.

[jancborchardt]

What's the root cause here? It seems that importing is not really visible, and that is an issue which should be solved by a better empty content view. The first run experience should of course also offer import. :)

[j-ed]

@jancborchardt From my point of view the problem is not only connected to the import function but the settings dialog in general. If it is difficult to differentiate between the normal dialog and the settings dialog for normal people, how does disabled people feel if they want to work with this color in color dialogs?

[jancborchardt]

@skjnldsv good job on the simple fix with adding the left blue border. :)