Revise and extend the info / help tooltip pop-up in our design component library
Closed, DuplicatePublic
Actions

Assigned To

None

Authored By

	RHo
	Apr 20 2021, 2:54 PM

Description

This task is partly improve the help/info tooltip pop-up visual style and behaviour as part of the WVUI implementation effort (see T277047), notably:

Update the size and visual style of the “i” info icon currently used on Desktop and Mobile
Reconsider the trigger behavior on Desktop (per task T88630)
Provide more detailed guidelines on the position and size of the pop-up overlay on Desktop vs Mobile

Also take into account tooltips elsewhere:

MultimediaViewer with jquery.tipsy implementation

V1 AC

Icon updated as per T311382: Update 'info' icon in OOUI and Codex
Icon color when used for the help popup to be color-subtle that is #54595D

Related Objects
Search...

		Status	Subtype	Assigned	Task
		Open		None	T277047 Design inventory of Wikiverse (Codex design system, OOUI, MediaWiki widgets) UI components
		Duplicate		None	T280677 Revise and extend the info / help tooltip pop-up in our design component library

Event Timeline

RHo created this task.Apr 20 2021, 2:54 PM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptApr 20 2021, 2:54 PM

RHo mentioned this in T277047: Design inventory of Wikiverse (Codex design system, OOUI, MediaWiki widgets) UI components.Apr 23 2021, 2:01 PM

RHo added a parent task: T277047: Design inventory of Wikiverse (Codex design system, OOUI, MediaWiki widgets) UI components.Apr 23 2021, 2:05 PM

Volker_E renamed this task from Revise and extend the info / help tooltip pop-up in our design component library for WVUI implementation to Revise and extend the info / help tooltip pop-up in our design component library.May 3 2021, 7:12 AM

Volker_E updated the task description. (Show Details)

Sgs subscribed.Jun 15 2022, 5:14 PM

adding @Prtksxna and @bmartinezcalvo as this is being worked on (?) for IP info.

• Prtksxna mentioned this in T311382: Update 'info' icon in OOUI and Codex.Jun 27 2022, 4:51 AM

Thanks for the ping @RHo. I've created the task to update the icon now.

• Prtksxna mentioned this in T280666: Extend color and size guidelines of the Wikimedia Design System icon set .Jun 29 2022, 4:53 AM

Here are some examples of how the help icon will look like after T311382: Update 'info' icon in OOUI and Codex. Noting @bmartinezcalvo`s suggestion that the color for this should be color-subtle that is #54595D

Screen Shot 2022-07-04 at 9.50.52 AM.png (374×884 px, 38 KB)

Screen Shot 2022-07-04 at 9.51.18 AM.png (568×1 px, 69 KB)

In T280677#8068353, @Prtksxna wrote:

Noting @bmartinezcalvo`s suggestion that the color for this should be color-subtle that is #54595D

For the icon color you could use both color-base #202122 or color-subtle #54595D depending on if you want to paint the icon with the base dark color or if you want to design it in a more subtle and not distracting way.

• Prtksxna updated the task description. (Show Details)Aug 4 2022, 5:14 AM

Tchanders subscribed.Aug 4 2022, 3:25 PM

• Prtksxna mentioned this in T309828: Update IP info colors based on design systems recommendations.Aug 9 2022, 5:22 AM

AnneT mentioned this in T313357: Define core components.Aug 22 2022, 8:39 PM

RHo attached a referenced file: F35301063: Screen Shot 2022-07-04 at 9.51.18 AM.png. (Show Details)Jun 21 2023, 3:43 PM

RHo attached a referenced file: F35301059: Screen Shot 2022-07-04 at 9.50.52 AM.png. (Show Details)Jun 21 2023, 3:46 PM

RHo mentioned this in T339379: Follow up work: Iterate on IP masking banner.Jun 21 2023, 4:02 PM

Added tag per https://www.mediawiki.org/wiki/Design_Systems_Team/Codex_Planned_Components

Sgs mentioned this in T340199: [Visual design bug] Vue version of tooltip pop-up header icons are misaligned with header text.Jun 23 2023, 5:26 PM

bmartinezcalvo mentioned this in T340456: Tooltip: Add Tooltip component to Codex.Jun 26 2023, 4:14 PM

CCiufo-WMF closed this task as a duplicate of T340456: Tooltip: Add Tooltip component to Codex.Jun 27 2023, 1:04 PM

	F35301063: Screen Shot 2022-07-04 at 9.51.18 AM.png
	Jul 11 2022, 5:05 AM

	F35301059: Screen Shot 2022-07-04 at 9.50.52 AM.png
	Jul 11 2022, 5:05 AM

	F34438400: image.png
	May 3 2021, 7:12 AM

Revise and extend the info / help tooltip pop-up in our design component libraryClosed, DuplicatePublicActions

Description

V1 AC

Related ObjectsSearch...

Event Timeline

Revise and extend the info / help tooltip pop-up in our design component library
Closed, DuplicatePublic
Actions

Related Objects
Search...