Add on hover to entity type icons on results pages, entity pages, advanced search (any place icons are used) (from 1607)

[gigamorph]

Problem description: The icons displayed alongside the results and in the entity page headers do not have visible labels displayed.

Expected Behavior: When hovering over an icon, the user should be shown text that describes the icon. There should be no hover delay. The label will be visible/invisible to the user immediately when their cursor enters/leaves the icon area. This should be implemented wherever icons are used in the UI.

Requirements

• Add hover on the icons on result pages, entity pages, and advanced search results.
• Display the correct icon label in the hover text.

Needed for promotion

• [x] Labels <-- listed below but need to be updated and reviewed
• [x] Mockup
• [x] Final list of icon designs and labels in this top block
• [x] Links/Directions for UAT Testing each

UAT Current Labels and link for UAT

1. Scores and Notation
2. Photographs
3. Furniture
4. Journals & Newspapers
5. Clothing
6. Numismatics
7. Cartography
8. Video
9. Audio
10. Software & Electronic Media
11. Visual Works
12. Textual Works
13. Objects
14. Specimens
15. Collections

Dependencies/Blocks

• Blocked By: https://github.com/project-lux/lux-frontend/issues/40

Related Issues

• https://www.bugherd.com/projects/284041/tasks/1592
• https://www.bugherd.com/projects/284041/tasks/1426

Mockup/Wireframes:

[roamye]

This is no longer blocked. Moving this to backlog and assigning @kamerynB.

note to self: update links and reformat issue.

[roamye]

inconsistent with:

• photography: listed as "photographs"
• numismatics: spelled incorrectly as "numistatics"

things to note: Under works, if a work is a digital work, it will show "digital work" when hovering over it rather than (example) Under works, textual object icons also display "linguistic object". example Set icon will appear as 'set and collection" if applicable. I think this is good that it can differentiate it, but wanted to note it.

Unsure if these are issues.

[kkdavis14]

I think we should swap the "linguistic object" hover over to "textual work" since that's what the UI uses generally.

[roamye]

uat 10/24: hot fixes:

• Photography should be changed to photograph.
• numismatics to be spelled correctly.

Quality control is needed for all the labels.

• should they be lower case or capitalized? A: can be.
• on tomorrows agenda.
• teams thread on conversation

Next steps:

• deploy to prod, but will need another ticket for re-labeling/analysis.

[clarkepeterf]

This is not in PRD, so I will deploy to lower envs

[roamye]

Approved by UAT, but as mentioned in the comment above, this will need another ticket for re-labeling.

[roamye]

Looks good in prod. closing