Page MenuHomePhabricator
Create Task
Maniphest T320101

[M] Enable VectorVisualEnhancementsNext everywhere
Closed, ResolvedPublic1 Estimated Story Points
Actions

Assigned To
Jdlrobson
Authored By
Jdlrobson
Oct 6 2022, 10:18 PM
Tags
Referenced Files
F35737661: Screenshot 2022-11-09 at 7.28.11 PM.png
Nov 10 2022, 3:30 AM
F35737660: Screenshot 2022-11-09 at 7.27.50 PM.png
Nov 10 2022, 3:30 AM
F35699247: Screen Shot 2022-11-02 at 7.35.26 PM.png
Nov 2 2022, 11:36 PM
F35698861: Screen Shot 2022-11-02 at 11.45.42 AM.png
Nov 2 2022, 10:00 PM
F35553707: Screen Shot 2022-10-07 at 3.06.39 PM.png
Oct 7 2022, 10:07 PM
Subscribers
Aklapper
• alexhollender_WMF
bmartinezcalvo
bwang
• DAbad
Dereckson
Edtadros
View All 14 Subscribers

Description

The changes in T314323 are completed in wmf5 and behind a feature flag. Let's enable these! This will update the watchstar logo and bring some consistency to Vector 2022 icons including notifications.

https://en.wikipedia.org/?vectorvisualenhancementnext=1&safemode=1

TODO

  • Deploy via train by enabling it in skin.json. This will allow us to do design review on beta cluster.
  • Perform design review with Alex
  • Wait for wmf5 to be deployed (week of 17th October 2022)

Sign off steps

  • DOn't forget to close out T314323 !
  • Make sure ticket exists for removing feature flag and associated code. (T323421)

QA Results - Beta

ACStatusDetails
1✅T320101#8385298

Details

Related Changes in Gerrit:
SubjectRepoBranchLines +/-
Drop the VisualEnhancementsNext feature flagmediawiki/skins/Vectormaster+114 -366
Enable VisualEnhancementNextmediawiki/skins/Vectormaster+2 -2
Customize query in gerrit

Related Objects
Search...

Event Timeline

Jdlrobson created this task.Oct 6 2022, 10:18 PM
Jdlrobson updated the task description. (Show Details)
Jdlrobson triaged this task as High priority.Oct 6 2022, 10:21 PM
Restricted Application added a subscriber: Dereckson. · View Herald TranscriptOct 6 2022, 10:21 PM
Jdlrobson updated the task description. (Show Details)Oct 6 2022, 10:21 PM
Jdlrobson moved this task from Incoming to Not ready to estimate on the Web-Team-Backlog-Archived board.Oct 7 2022, 12:52 AM
• alexhollender_WMF added a comment.Oct 7 2022, 10:07 PM

@Jdlrobson on beta the username and create account links seems to have extra 8px of margin:

Screen Shot 2022-10-07 at 3.06.39 PM.png (1×2 px, 302 KB)

Esanders unsubscribed.Oct 8 2022, 1:23 PM
Jdlrobson added a subtask: T320907: Add to watchlist icon is not shown correctly for larger font sizes.Oct 17 2022, 5:44 PM
Jdlrobson mentioned this in T320907: Add to watchlist icon is not shown correctly for larger font sizes.
Jdlrobson moved this task from Incoming to Visual Enhancements / Layout on the Vector 2022 board.Oct 18 2022, 6:00 PM
Jdlrobson reassigned this task from Jdlrobson to • alexhollender_WMF.Oct 25 2022, 9:05 PM
Jdlrobson mentioned this in T319449: [M] Create toggle to control the fixed width of the content for Vector 2022 skin.Oct 25 2022, 11:16 PM
ovasileva edited projects, added Web-Team-Backlog-Archived (Kanbanana-2022-23-Q2); removed Web-Team-Backlog-Archived.Oct 27 2022, 8:41 AM
Jdlrobson moved this task from Needs Analysis to Upcoming on the Web-Team-Backlog-Archived (Kanbanana-2022-23-Q2) board.Oct 27 2022, 9:03 PM
Jdlrobson set the point value for this task to 1.Oct 31 2022, 5:39 PM
bwang added a comment.Oct 31 2022, 7:46 PM

I'm still seeing some weirdness with the collapsed ToC button on small viewports. I also wanted to ask @alexhollender_WMF, could we take this opportunity to make the collapsed ToC button in the page title to be consistent with all the other icon buttons? Right now it has a vertical padding of 7px instead of 5px.

• alexhollender_WMF added a comment.Oct 31 2022, 7:59 PM
In T320101#8357805, @bwang wrote:

I also wanted to ask @alexhollender_WMF, could we take this opportunity to make the collapsed ToC button in the page title to be consistent with all the other icon buttons? Right now it has a vertical padding of 7px instead of 5px.

I'm actually not familiar with 5px or 7px as padding values for icons — I thought our standard was 6px? Also I assumed that kind of fix would be part of T319070: [M] [Visual Enhancements] Correct margins of icons and arrows, is it not?

bmartinezcalvo added a comment.Nov 2 2022, 8:26 AM
In T320101#8357859, @alexhollender_WMF wrote:

I'm actually not familiar with 5px or 7px as padding values for icons — I thought our standard was 6px? Also I assumed that kind of fix would be part of T319070: [M] [Visual Enhancements] Correct margins of icons and arrows, is it not?

As @alexhollender_WMF comments our spacing&size tokens are 4px, 6px or 8px but not 5px or 7px.

Jdlrobson added a subtask: T322150: (Unplanned) Wikilove icon out of position in vector 2022.Nov 2 2022, 4:32 PM
bwang added a comment.Nov 2 2022, 10:00 PM

Sorry for the confusion, I said 5px padding because there's also a 1px border (which is used in the button active state). Overall the icon buttons have 6px of spacing, and total dimensions of 32 x 32px which I believe is correct.

On this topic though, I did notice that the normal button styles on Codex's doc site and in the core button styles make use of 12px horizontal padding, plus the 1px border. @Volker_E Is that a mistake?

Screen Shot 2022-11-02 at 11.45.42 AM.png (908×2 px, 259 KB)

• alexhollender_WMF added a comment.Nov 2 2022, 11:36 PM
In T320101#8365040, @bwang wrote:

On this topic though, I did notice that the normal button styles on Codex's doc site and in the core button styles make use of 12px horizontal padding, plus the 1px border. @Volker_E Is that a mistake?

Screen Shot 2022-11-02 at 11.45.42 AM.png (908×2 px, 259 KB)

it seems to be different for icon-only buttons, which is what we're discussing here

Screen Shot 2022-11-02 at 7.35.26 PM.png (1×2 px, 457 KB)

Jdlrobson moved this task from Upcoming to Blocked on Others on the Web-Team-Backlog-Archived (Kanbanana-2022-23-Q2) board.Nov 4 2022, 3:46 PM
Jdlrobson moved this task from Blocked on Others to Upcoming on the Web-Team-Backlog-Archived (Kanbanana-2022-23-Q2) board.
Jdlrobson added a comment.Nov 4 2022, 3:48 PM

This is blocked on fixes for T321504 and T322162 being deployed via the train (earliest possible date is 17th November)

LGoto renamed this task from Enable VectorVisualEnhancementsNext everywhere to [M] Enable VectorVisualEnhancementsNext everywhere.Nov 7 2022, 6:20 PM
LGoto moved this task from Upcoming to Ready for Development on the Web-Team-Backlog-Archived (Kanbanana-2022-23-Q2) board.
Jdlrobson renamed this task from [M] Enable VectorVisualEnhancementsNext everywhere to Enable VectorVisualEnhancementsNext everywhere.Nov 7 2022, 6:20 PM
Jdlrobson updated the task description. (Show Details)
Jdlrobson removed • alexhollender_WMF as the assignee of this task.Nov 7 2022, 6:32 PM
Jdlrobson moved this task from Ready for Development to Blocked on Others on the Web-Team-Backlog-Archived (Kanbanana-2022-23-Q2) board.Nov 7 2022, 10:49 PM
gerritbot added a comment.Nov 7 2022, 10:49 PM

Change 854129 had a related patch set uploaded (by Jdlrobson; author: Jdlrobson):

[mediawiki/skins/Vector@master] Enable VisualEnhancementNext

https://gerrit.wikimedia.org/r/854129

gerritbot added a project: Patch-For-Review.Nov 7 2022, 10:49 PM
gerritbot added a comment.Nov 7 2022, 10:57 PM

Change 854131 had a related patch set uploaded (by Jdlrobson; author: Jdlrobson):

[mediawiki/skins/Vector@master] Drop the VisualEnhancementsNext feature flag

https://gerrit.wikimedia.org/r/854131

Jdlrobson added a comment.Nov 7 2022, 11:09 PM

Marking https://gerrit.wikimedia.org/r/854129 as blocked as I believe @ovasileva said this is blocked on T322162

ovasileva mentioned this in T322162: [M] Table of contents misaligned with max width disabled.Nov 8 2022, 6:06 PM
LGoto renamed this task from Enable VectorVisualEnhancementsNext everywhere to [M] Enable VectorVisualEnhancementsNext everywhere.Nov 8 2022, 6:19 PM
• nray subscribed.Nov 8 2022, 9:05 PM

FYI I ran Pixel with the feature flag disabled and enabled at: T322673#8381222 in order to see the visual changes that this feature flag introduces

Jdlrobson moved this task from Blocked on Others to Code Review on the Web-Team-Backlog-Archived (Kanbanana-2022-23-Q2) board.Nov 9 2022, 4:14 PM
Jdlrobson moved this task from Code Review to Blocked on Others on the Web-Team-Backlog-Archived (Kanbanana-2022-23-Q2) board.
Jdlrobson moved this task from Blocked on Others to Code Review on the Web-Team-Backlog-Archived (Kanbanana-2022-23-Q2) board.Nov 9 2022, 5:46 PM
gerritbot added a comment.Nov 9 2022, 8:24 PM

Change 854129 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Enable VisualEnhancementNext

https://gerrit.wikimedia.org/r/854129

ReleaseTaggerBot added a project: MW-1.40-notes (1.40.0-wmf.10; 2022-11-14).Nov 9 2022, 9:00 PM
Jdlrobson assigned this task to Edtadros.Nov 9 2022, 9:59 PM
Jdlrobson moved this task from Code Review to QA on the Web-Team-Backlog-Archived (Kanbanana-2022-23-Q2) board.
Jdlrobson moved this task from QA to Ready for Signoff on the Web-Team-Backlog-Archived (Kanbanana-2022-23-Q2) board.
Edtadros removed Edtadros as the assignee of this task.Nov 10 2022, 3:30 AM
Edtadros subscribed.

Test Result - Beta

Status: ✅ PASS
Environment: beta
OS: macOS Ventura
Browser: Chrome
Device: MBP
Emulated Device:NA

Test Artifact(s):

QA Steps

✅ AC1: My face was on this one so I figured I'd just validate that the flag works in beta.

Screenshot 2022-11-09 at 7.27.50 PM.png (338×1 px, 69 KB)

Screenshot 2022-11-09 at 7.28.11 PM.png (345×1 px, 71 KB)

Edtadros updated the task description. (Show Details)Nov 10 2022, 3:31 AM
Jdlrobson assigned this task to • nray.Nov 14 2022, 6:17 PM
Jdlrobson updated the task description. (Show Details)Nov 15 2022, 6:46 PM
Jdlrobson updated the task description. (Show Details)
bwang mentioned this in T323172: [S] Extra spacing around personal tools icon buttons on viewports below tablet.Nov 15 2022, 10:25 PM
bwang mentioned this in T323174: Spacing between the collapsed ToC button and page title changes above 1000px.Nov 15 2022, 10:28 PM
bwang mentioned this in T323176: [S] Sticky header icon buttons are missing padding.Nov 15 2022, 10:51 PM
bwang mentioned this in T323177: Page titlebar elements are vertically centered when the page title wraps.Nov 15 2022, 10:56 PM
• alexhollender_WMF mentioned this in T323244: Remove extra spacing from username/create account link.Nov 16 2022, 10:42 PM
• nray updated the task description. (Show Details)Nov 19 2022, 12:50 AM
• nray mentioned this in T323421: [subtask] Remove VectorVisualEnhancementsNext feature flag and relevant code.Nov 19 2022, 1:00 AM
• nray updated the task description. (Show Details)
• nray added a comment.Nov 19 2022, 1:07 AM
  • DOn't forget to close out T314323 !

@ovasileva @Jdlrobson I'm happy to sign this off but wanted to double check on the above AC for closing out the epic. Are we okay to close that out given there are related tasks (e.g. T323176) that are still in progress?

• nray removed • nray as the assignee of this task.Nov 19 2022, 1:07 AM
ovasileva closed subtask T322150: (Unplanned) Wikilove icon out of position in vector 2022 as Resolved.Nov 21 2022, 3:45 PM
Jdlrobson claimed this task.Nov 21 2022, 6:35 PM
gerritbot added a comment.Nov 21 2022, 7:38 PM

Change 854131 had a related patch set uploaded (by Jdlrobson; author: Jdlrobson):

[mediawiki/skins/Vector@master] Drop the VisualEnhancementsNext feature flag

https://gerrit.wikimedia.org/r/854131

Jdlrobson added a subtask: T323421: [subtask] Remove VectorVisualEnhancementsNext feature flag and relevant code.Nov 21 2022, 7:42 PM
gerritbot added a comment.Nov 21 2022, 10:21 PM

Change 854131 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Drop the VisualEnhancementsNext feature flag

https://gerrit.wikimedia.org/r/854131

ReleaseTaggerBot edited projects, added MW-1.40-notes (1.40.0-wmf.12; 2022-11-28); removed MW-1.40-notes (1.40.0-wmf.10; 2022-11-14).Nov 21 2022, 11:01 PM
Jdlrobson closed subtask T323421: [subtask] Remove VectorVisualEnhancementsNext feature flag and relevant code as Resolved.Nov 22 2022, 6:43 PM
Jdlrobson closed this task as Resolved.Nov 23 2022, 4:00 PM
Jdlrobson updated the task description. (Show Details)
Jdlrobson closed subtask T320907: Add to watchlist icon is not shown correctly for larger font sizes as Resolved.Nov 23 2022, 4:04 PM
Jdlrobson closed subtask T321504: [M] [Technical] Vector should consistently use mw-ui-icon-flush-left and mw-ui-icon-flush-right utility classes as Resolved.Nov 23 2022, 8:18 PM
ovasileva closed subtask T322673: Test VectorVisualEnhancementsNext flag as Resolved.Nov 28 2022, 3:20 PM
Content licensed under Creative Commons Attribution-ShareAlike (CC BY-SA) 4.0 unless otherwise noted; code licensed under GNU General Public License (GPL) 2.0 or later and other open source licenses. By using this site, you agree to the Terms of Use, Privacy Policy, and Code of Conduct. · Wikimedia Foundation · Privacy Policy · Code of Conduct · Terms of Use · Disclaimer · CC-BY-SA · GPL · Credits