[Enhancement] Tag thumbnails

[StashAppDev]

stashapp/StashServer#32

[echo6ix]

A better interface concept #108 for the grid view of tag thumbnails (aka cover images).

• Stock tag icon for tag thumbnails missing cover image is from https://fontawesome.com/icons/tag?style=solid
• The edit icon for each card is from here https://fontawesome.com/icons/edit?style=solid
• Each card is in a container called .bp3-card. I think it would be interesting to very subtly lighten the colour of the .bp3-card container when the mouse hovers over the container.
• Tag thumbnails would be user-defined and uploaded. This would necessitate a page just for editing the tag, eg /tag/12, which brings me to the edit icon...

What does the edit icon do?

• On the mouseover event of a card, an edit icon appears on the bottom right of the card (i may have used a colour thats too dark in the concept).
• The icon is an indicator that you can click it to edit tag details
• On the mouseover/hover of the actual icon, the icon should turn a lighter colour
• The reason for directing the user to a page that edits the tag is that I'm assuming there will be more to edit than just the tag name. Such as, tag cover image/thumbnail; tag deletion, rename tag; assign tag aliases (aka subtags from the roadmap).

What do the scenes and marker buttons do?

The scenes or markers button will determine what the user will ultimately see when clicking a tag card. If scenes is depressed, as represented in the concept, then the user is set to view scenes when clicking a tag, and vice-versa with markers.

What does the side panel do?

The side panel shows a list of all the tags used in Stash, sorted alphabetically in ascending order, and with letter headings.

• Tags beginning with non-alphanumeric and numeric characters would be placed under the hashtag character.
• The input quick filter box lets user filter through the tags in the side panel with results appearing instantly.