Page MenuHomePhabricator

Buttons in sticky header should never wrap
Closed, ResolvedPublic2 Estimated Story Points

Description

Description

After T311103 the language button and/or "Add topic" button are wrapping if the page has a long title:

example article

currentexpected/correct
image.png (1×2 px, 588 KB)
image.png (1×2 px, 587 KB)

QA

Expected;
No wrapping

Actual:

Screen Shot 2022-08-31 at 9.59.10 AM.png (626×2 px, 859 KB)

To-do

  • Ensure the language button never wraps in the sticky header

Developer notes

Add white-space: nowrap; to #p-lang-btn-sticky-header

QA Results - Beta

ACStatusDetails
1T316609#8252242

QA Results - Prod

ACStatusDetails
1T316609#8262731

Event Timeline

Discussed with Alex and this one would be a potential blocker or a nice-to-have at least

@alexhollender_WMF : can you change the privacy on the images?

@alexhollender_WMF : can you change the privacy on the images?

sorry, fixed

@bwang I'm not seeing a patch on this one. Feel free to add me to it when it's ready for review.

Change 832516 had a related patch set uploaded (by Bernard Wang; author: Bernard Wang):

[mediawiki/skins/Vector@master] Prevent language button in sticky header from work breaking

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

Change 832516 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Prevent language button in sticky header from word breaking

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

Change 831126 had a related patch set uploaded (by Bernard Wang; author: Bernard Wang):

[mediawiki/skins/Vector@master] Update collapsed TOC menu width

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

bwang renamed this task from Language button should never wrap in sticky header to Buttons in sticky header should never wrap.Sep 15 2022, 5:49 PM
bwang updated the task description. (Show Details)

Change 831126 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Update collapsed TOC menu width

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

Change 832551 had a related patch set uploaded (by Jdlrobson; author: Bernard Wang):

[mediawiki/skins/Vector@wmf/1.40.0-wmf.1] Update collapsed TOC menu width

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

Test Result - Beta

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

Test Artifact(s):

QA Steps

Go to a page with multiple languages
Resize browser to 1019px
Scrolldown
AC1: Language should not wrap in sticky header.

Screen Shot 2022-09-21 at 7.24.43 PM.png (214×1 px, 86 KB)

Edtadros added a subscriber: Edtadros.

Test Result - Prod

Status: ✅ PASS
Environment: dewiki
OS: macOS Monterey
Browser: Chrome
Device: MBP
Emulated Device:NA

Test Artifact(s):

QA Steps

Go to a page with multiple languages
Resize browser to 1019px
Scrolldown
AC1: Language should not wrap in sticky header.

Screen Shot 2022-09-26 at 3.42.37 PM.png (573×1 px, 269 KB)

Screen Shot 2022-09-26 at 3.44.01 PM.png (330×1 px, 98 KB)

Screen Shot 2022-09-26 at 3.43.54 PM.png (393×1 px, 299 KB)