Introduce legends and tooltips to inline diff so that users, that are not familiar with the blue and yellow highlights, can better understand the type of edits.
Feature Summary
On the current experience, new users might not be able to understand an edit. Enhance the UI so that newcomers can better understand edits.
Acceptance Criteria
- A legend that would explain the colour highlights within a diff view.
- Tooltips are triggered that indicate the type of edit when a user hover over a yellow or blue highlighted area. The tooltip popup says "Content added" for blue highlighted area and "Content deleted" for yellow highlighted area.
- Should look and work correctly with and without the VisualEditor, RevisionSlider, and MobileFrontend extensions.
User Story
- As a user of the diff tool, I want to see a legend to explain the symbology.
- As a viewer of the Unified Inline Wikitext Diff on Desktop, I will be able to see a legend so that I can understand what visual markers mean.
- As a viewer of the Unified Inline Wikitext Diff on Desktop, I will be able to see a tooltip that indicates "Content deleted" when hovering over a yellow highlighted area.
- As a viewer of the Unified Inline Wikitext Diff on Desktop, I will be able to see a tooltip that indicates "Content added" when hovering over a blue highlighted area.