Icon changes for QuickSurveys
Closed, ResolvedPublic2 Estimated Story PointsDesign
Actions

Assigned To

Authored By

	Madalina
	Nov 3 2021, 11:51 AM

Description

In order to align QS survey design to the Wikimedia design style guide we need to implement the following icon changes:

Designs

Current	Desired	Specs

Notes

Use the LinkExternal icon from the WVUI.
Set icon dimensions to 10x10px.
Icon color Accent 50 #3366cc.
Icon margin left set to 3px.

Technical info

This style is defined in MediaWiki core around here https://gerrit.wikimedia.org/g/mediawiki/core/+/efd780c31e5bee0bd083a8cc77cf9d71bfcdffcc/resources/src/mediawiki.skinning/content.externallinks.less

Related Objects
Search...

		Status	Subtype	Assigned	Task
		Resolved		AAlhazwani-WMF	T291567 Align QuickSurvey design to the Wikimedia Design Style Guide
		Resolved	Design	• Jhernandez	T294910 Icon changes for QuickSurveys

Event Timeline

Madalina triaged this task as High priority.Nov 3 2021, 11:51 AM

Madalina created this task.

Madalina moved this task from Needs triage to Pre-estimation review on the Trust and Safety Tools Team Backlog board.

• Jhernandez removed projects: Design, Epic.Nov 3 2021, 12:26 PM

• Jhernandez moved this task from Pre-estimation review to Ready for estimation on the Trust and Safety Tools Team Backlog board.

• Jhernandez removed subscribers: • alexhollender_WMF, ovasileva, Volker_E, Jdlrobson.

• Jhernandez removed AAlhazwani-WMF as the assignee of this task.Nov 3 2021, 12:30 PM

AAlhazwani-WMF updated the task description. (Show Details)Nov 3 2021, 12:41 PM

ARamirez_WMF set the point value for this task to 2.Nov 3 2021, 3:16 PM

ARamirez_WMF moved this task from Ready for estimation to Ready for development on the Trust and Safety Tools Team Backlog board.Nov 3 2021, 3:16 PM

• Jhernandez updated the task description. (Show Details)Nov 3 2021, 3:17 PM

ARamirez_WMF added a project: Design.Nov 3 2021, 3:34 PM

ARamirez_WMF moved this task from Ready for development to Kanban on the Trust and Safety Tools Team Backlog board.Nov 3 2021, 3:37 PM

ARamirez_WMF edited projects, added Trust and Safety Tools Team Backlog (Kanban); removed Trust and Safety Tools Team Backlog.

ARamirez_WMF moved this task from Kanban to Ready for development on the Trust and Safety Tools Team Backlog board.

ARamirez_WMF edited projects, added Trust and Safety Tools Team Backlog; removed Trust and Safety Tools Team Backlog (Kanban).

ARamirez_WMF moved this task from Ready for development to Design work on the Trust and Safety Tools Team Backlog board.Nov 3 2021, 3:40 PM

Now that I think about this I have a doubt, what are the criteria that classifies a link as external? As the privacy policy will be probably hosted on a Wikimedia-owned page (eg. https://foundation.wikimedia.org/wiki/Legal:2019_Editor_Gender_Survey_Privacy_Statement) will the mw-parser identify the privacy statement link as external? If that is not the case we could probably close this issue, or move it to the QuickSurvey board. What do you think @Jhernandez?

Please note, that there has been already an approach proposed to unify Vector's external link icon with the WikimediaUI collection of the style guide. This should also cover above task from my point of view.

In T294910#7479046, @aminalhazwani wrote:

Now that I think about this I have a doubt, what are the criteria that classifies a link as external? As the privacy policy will be probably hosted on a Wikimedia-owned page (eg. https://foundation.wikimedia.org/wiki/Legal:2019_Editor_Gender_Survey_Privacy_Statement) will the mw-parser identify the privacy statement link as external? If that is not the case we could probably close this issue, or move it to the QuickSurvey board. What do you think @Jhernandez?

The selector applies to any links that are written with the external link syntax in wikitext:

So like you mentioned, we could link via wiki link instead of external link and that icon wouldn't show up:

[[foundation:Legal:2019_Editor_Gender_Survey_Privacy_Statement|privacy policy]]

In T294910#7480477, @Volker_E wrote:

Please note, that there has been already an approach proposed to unify Vector's external link icon with the WikimediaUI collection of the style guide. This should also cover above task from my point of view.

@Volker_E It doesn't seem like that would fix other skins right? Just in case you didn't notice, Minerva shows the same icons as vector so if this is fixed in vector instead of in mediawiki core then I think other skins will be showing the outdated icons too.

Great, thanks for sharing @Jhernandez. Since we are going to display at least two links (and since these two links are hosted on wiki pages) we could opt for the wiki link syntax. In this way we also avoid any potential visual "noise" that might have happened with multiple icons displayed within the text.

@Jhernandez Just for completion, it seems the icon in Minerva is broken due to a specificity issue recently(?) introduced. My updated proposal in T261391 includes removing the external link styling completely from MW core and leave this up to skin territory.

My updated proposal in T261391 includes removing the external link styling completely from MW core and leave this up to skin territory.

Cool, thanks for sharing @Volker_E!

@Jhernandez I think we can close this task.

\o/

AAlhazwani-WMF mentioned this in T291567: Align QuickSurvey design to the Wikimedia Design Style Guide.Nov 5 2021, 10:45 AM

	F34729967: image.png
	Nov 4 2021, 10:10 AM

Icon changes for QuickSurveysClosed, ResolvedPublic2 Estimated Story PointsDesignActions