Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ux: add a star icon next to the "starred" nav menu item #3031

Draft
wants to merge 7 commits into
base: main
Choose a base branch
from

Conversation

thiagowfx
Copy link
Contributor

@thiagowfx thiagowfx commented Dec 21, 2024

STATUS: On Hold. Revisit:

  • move icons to the left
  • add icons to all menu items
  • update PR title

This is somewhat of a follow-up of #1371.

It looks like this:

image

And with hover:

image

Initially I added the emoji star (⭐️) but it stood out too much. I find that the unicode star blends in well with the rest of the menu.

This change is purely aesthetic.

Do you follow the guidelines?

@thiagowfx thiagowfx changed the title ux: add an star icon next to the "starred" nav menu item ux: add a star icon next to the "starred" nav menu item Dec 21, 2024
@jvoisin
Copy link
Collaborator

jvoisin commented Dec 22, 2024

What's the point of adding an icon? The (+) for feed can be used to add a feed, but the star doesn't do anything, so it's a bit confusing.

@thiagowfx
Copy link
Contributor Author

It's purely for aesthetics, I think it looks better / nicer.

Is it confusing because it's the only nav menu option with an icon? Would it be less confusing if all options had an icon? I.e. similarly to:

image

@jvoisin
Copy link
Collaborator

jvoisin commented Dec 27, 2024

Having an icon on every navigation menu option is indeed better, yes :)

@thiagowfx
Copy link
Contributor Author

Bikeshedding: add icons to the left or to the right side? If we'll add icons to all menu items, left is better IMHO for (i) consistency with the existing icons and (ii) so that "Feeds" has the icon on the left and the (+) button on the right.

Adding more icons is reasonable, will revisit this PR once I have cycles to do so.

@thiagowfx thiagowfx marked this pull request as draft December 27, 2024 22:55
@jvoisin
Copy link
Collaborator

jvoisin commented Dec 28, 2024

I don't know shit about design, so I usually look at the GNOME Human Interface Guidelines. It recommends the following:

As a general rule, controls should be identified with either a label or an icon, and not both. This helps to avoid information overload, particularly when controls are tightly packed together.

A notable execption to this rules are the header bars, which can be more or less seen as equivalent to Miniflux' horizontal navigation menu, so I guess it's ok.

In Adwaita, the building blocks for modern GNOME applications, the icons are on the left of their label:

image

@thiagowfx
Copy link
Contributor Author

thiagowfx commented Dec 28, 2024

An idea of what it could look like with a couple of emojis:
image
It's hard to map "Unread", "History" and "Logout" to emojis though.

Also, to be frank, I am not a big fan of the emojis in this context, because their color is distracting. That's why the original PR included a non-emoji star.

With that said: We could incorporate more icons from https://tabler.io/icons, like #1335. They blend in well with the existing ones and they are not distracting, as they are all monochromatic.

Some possibilities are:

@thiagowfx
Copy link
Contributor Author

...of course, whether to proceed from here is up to Frédéric.

@fguillot
Copy link
Member

I'm okay with that. New icons from tabler.io can be added to the sprite.svg file. Of course, that must be consistent with the rest of the application.

Some testing with languages other than English might be required to avoid text overflow. For example, French and German are more verbose compared to English.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

3 participants