File browser: Make Folder and file icons visually better distinct (outlined icon for file), fixes #2186

[wshoy]

Ability to easily distinguish between files and directories is essential.
It looks just like in #2186:

[harshad1]

Looks nice imo

[harshad1]

We tint icons gold to show that they are favorites. Does this interfere with that?

[gsantner]

Thank you! Humbly said, I know some people want a bit more differentiation. At same time people (including me) want to keep it simple and non-distracting. To me the blue looks quite alien to all other colors in the project.

[wshoy]

We tint icons gold to show that they are favorites. Does this interfere with that?

It does not. I have modified only the existing code. It works just like it did before.

[wshoy]

At same time people (including me) want to keep it simple and non-distracting.

I think it's still simple as there are only two things: files and folders. Above all, making the file browser easier to navigate (even when using "folder first") is more important than aesthetics (though I think it looks better).

To me the blue looks quite alien to all other colors in the project.

The colors are subject to change. The design is taken from #2186.

[harshad1]

Perhaps we can make the file icon more different instead?

Something like this:

An outline file icon makes it distinct from the folder icon without looking visually jarring

(From: https://dribbble.com/shots/4404297-Material-Icons-File-And-folder, don't know if this has an appropriate license)

[wshoy]

Perhaps we can make the file icon more different instead?

After looking at other file browsers, for me there are two options:

1. Use color (blue) and keep the icons.
2. Change the icon(s), make folders dark grey and files light grey. Changing only the icons is not enough if they look basically the same in peripheral vision.

I find the lack of color contrast very unusual. Even most minimal file managers have either colored folders or light files with dark folders.

[harshad1]

light files with dark folders.

This is effectively what I am proposing. Switching to an outline only icon will make them more distinct without changing the appearance otherwise.

[wshoy]

Switching to an outline only icon

I've modified the file SVG and it's like night and day when compared to what we have right now.

[gsantner]

Thanks for attaching the screenshot too. It looks very good to me too, while also not distracting.

[gsantner]

Need to compile and check it out but looks good code wise.

[gsantner]

Thank you, merged