Sources icon difficult to decypher

[davidoskky]

The sources icon doesn't suggest that by clicking it to it you will enter the sources configuration page to me. It is a cloud with an up arrow; the cloud is generally associated to a remote server and the up arrow to uploading a document, thus I would expect this icon to describe something such as upload a document to selfoss and not edit sources.

It would be better to use a more clear icon to describe the actions "edit sources", "add sources" and "remove sources". I'm not sure what is the best choice. I propose the rss feed icon with a small wrench either in the top right or in the lower left. The information I wish to convey is: edit, modify through the wrench, which is commonly accepted as a symbol of change, modification, configuration and this is applied to the rss feed by the standard image of the rss feed that can be easily recognized by an rss reader. I would advise against using just the rss feed icon, since this could be interpreted as "subscribe to the selfoss rss feed".

If you wish, I can try to produce such an icon in the same style of the other ones.

[jtojnar]

We are using FontAwesome for icons. It should be possible to compose them https://fontawesome.com/docs/apis/javascript/methods#layer-assembler-params

[davidoskky]

Alright, I played a little bit with it... Not too sure how I've done it is the right way, but I was able to make these two icons: The first one is a little bit more square, which might be better. Unfortunately I wasn't able to find a way to place the icons relative to an enclosing square...

This is the code to obtain them:

<span class="fa-stack fa-2x">
  <i class="fa-solid fa-rss"></i>
  <i class="fa-solid fa-wrench fa-stack-1x" data-fa-transform="shrink-8 left-5 up-6 rotate-270"></i>
</span>

<span class="fa-stack fa-2x">
  <i class="fa-solid fa-wrench" data-fa-transform="shrink-8 left-4 down-4 rotate-270"></i>
  <i class="fa-solid fa-rss" data-fa-transform="left-12 up-4"></i>
</span>

[jtojnar]

Ugh, the rss icons have incorrect spacing between the source and the waves. Not sure why, when they are correct for the square-rss icons https://fontawesome.com/search?q=rss&o=r

Actually, seeing it, I am not sure about including the RSS icon. After all we support many other types of sources. But maybe it is fine as a representation of source.

Or maybe we could just have one of the tools on their own. But then it might be confusing if we introduce configuration editor.

Or maybe we could just remove the toolbar with buttons altogether and use a hamburger menu containing text items instead. Most of the buttons are probably not pressed very often so one extra click once in a while for a cleaner interface is probably acceptable trade-off.

[davidoskky]

I guess maybe just the screwdriver and wrench or the gear icon could work fine. It is true that this is not just about rss feed, thus it might be misleading. It is also true that the page doesn't really contain the configuration of selfoss (which is in the config.ini) but only the configuration of the sources, if the configuration editor is introduced this would definitely be misleading. I'm not really sure how you could represent the sources with an image, I have quickly looked through some other rss readers but didn't find any convincing representation...

I have looked through the available icons and quickly selected some that picked my attention; let me know if there is one of these that you find appropriate, I will later provide a description of each icon to explain why it might apply.

Icons

 book-open-cover  arrows-to-circle  copy  network-wired  timeline-arrow  list-tree  globe  newspaper  mailbox  tower-broadcast  satellite-dish  notes  merge  manat-sign  faucet-drip  chart-network  envelopes