Robot icon should be shown next to difficulty indicator for link-recommendation task type.
Mobile mockup as of 2021-01-12:  |
Description
Description
Details
Details
| Status | Subtype | Assigned | Task | ||
|---|---|---|---|---|---|
| Resolved | MMiller_WMF | T252822 [EPIC] Growth: "add a link" structured task 1.0 | |||
| Resolved | kostajh | T268704 Add a link: frontend product specifications | |||
| Resolved | • mewoph | T269654 Add a link: guidance content | |||
| Resolved | • mewoph | T278577 Add a link: add robot icon to help panel header |
Event Timeline
Comment Actions
Change 675207 had a related patch set uploaded (by MewOphaswongse; author: MewOphaswongse):
[mediawiki/extensions/GrowthExperiments@master] Add a link: add robot icon to help panel header
Comment Actions
Desktop:
Mobile:
QA note: This change includes a refactoring of how icon is generated in add link mobile task card as well.
Comment Actions
Change 675207 merged by jenkins-bot:
[mediawiki/extensions/GrowthExperiments@master] Add a link: add robot icon to help panel header
Comment Actions
For @RHo review - for the quick review. The screenshots by @mewoph comment match with what I observed. Interesting that the bluish background is still present on a real device, but cannot be captured with the screenshots.
Desktop:
Mobile:
QA note: This change includes a refactoring of how icon is generated in add link mobile task card as well.
Comment Actions
Thanks @Etonkovidova and @mewoph. The overall issue with the tag background colours will be resolved when we get to T253706. However, it looks like the icon (desktop and mobile) is larger than the expected 16x16dp - this is on both the help panel, and in the SE module.
Actual mobile   | Expected  |
Apologies I only noticed now – LMK if you prefer to move as a leftovers task or to rework as part of this one?
Comment Actions
Please feel free to move back to design review if you prefer I create a leftovers task instead!
Comment Actions
Hi @RHo I wanted to confirm the icon and the difficulty label dimensions. From your screenshot it looks like the icon height should be the same as the difficulty label but here the dimensions are different (16px vs 18px).
Comment Actions
Hi @RHo I wanted to confirm the icon and the difficulty label dimensions. From your screenshot it looks like the icon height should be the same as the difficulty label but here the dimensions are different (16px vs 18px).
Hi @mewoph - ah the mobile label height is taller (18px) due to the font size on mobile being larger, but the icon is meant to be the same 16x16px for both. And actually this applies across all instances of the robot icon + easy tag:
Expected mobile  | Expected desktop  |
I did this by amending the class .suggested-edits-taskexplanation-difficulty-and-time .suggested-edits-task-explanation-icon, .suggested-edits-taskexplanation-additional-info .suggested-edits-task-explanation-icon – removing background-size:90% and adding in:
width: 16px; min-width: 16px; height: 16px;
can this also be applied to the help panel header?
Comment Actions
I see, thanks for the clarifications. Yeah, I'll update both to 16px (unfortunately the min-height & min-width have to be overridden since OOUI sets it to 20px -- that may have been why background-size: 90% is there)
Comment Actions
Change 695448 had a related patch set uploaded (by MewOphaswongse; author: MewOphaswongse):
[mediawiki/extensions/GrowthExperiments@master] Add a link: Set robot icon dimensions in task explanation
Comment Actions
Change 695448 merged by jenkins-bot:
[mediawiki/extensions/GrowthExperiments@master] Add a link: Set robot icon dimensions in task explanation
Comment Actions
The specs are in place:
.suggested-edits-taskexplanation-difficulty-and-time .suggested-edits-difficulty-time-estimate .oo-ui-icon-robot-task-type, .suggested-edits-taskexplanation-additional-info .suggested-edits-difficulty-time-estimate .oo-ui-icon-robot-task-type {
margin-right: 8px;
width: 16px;
height: 16px;
min-height: 16px;
min-width: 16px;