Maniphest T420724

Vector 2022 responsive shows long titles very poorly on small screens, especially with Discussion Tools' "add topic" button"
Closed, ResolvedPublicBUG REPORT
Actions

Assigned To

Authored By

	DSmit-WMF
	Mar 20 2026, 12:36 PM

Description

Steps to replicate the issue (include links if applicable):

Go to https://abstract.wikipedia.org/wiki/Abstract_Wikipedia:Project_chat on a mobile phone with a small screen (iphone 12/14)
See how the title is hardly readable and element should stack

Screenshot 2026-03-20 at 13.34.30.png (1×678 px, 159 KB)

What happens?:

title unreadable responsiveness not ok

What should have happened instead?:

title should be readable and there for elements like language selector should stack underneath or so

Software version (on Special:Version page; skip for WMF-hosted wikis like Wikipedia):
Ios safari on iphone 14

Other information (browser name/version, screenshots, etc.):

Details

Related Changes in Gerrit:

	Subject	Repo	Branch	Lines +/-
	PageTitlebar: make title at least 70% width so language and buttons stack underneath	mediawiki/skins/Vector	master	+8 -0

Customize query in gerrit

Related Objects
Search...

Status	Subtype	Assigned	Task
Duplicate		None	T311254 On mobile header icons overlap with search bar in responsive mode
Stalled	Feature	None	T395948 Change viewport for Vector-2022 from hardcoded width to "width=device-width, initial-scale=1"
Open		None	T106463 [EPIC] Ready responsive Vector for wider deployment
Open		None	T365631 Redesign Vector 2022 header and actions for mobile devices
Resolved	BUG REPORT	DSmit-WMF	T420724 Vector 2022 responsive shows long titles very poorly on small screens, especially with Discussion Tools' "add topic" button"

Event Timeline

DSmit-WMF created this task.Mar 20 2026, 12:36 PM

DSmit-WMF moved this task from Bugs to investigate to To Triage on the Abstract Wikipedia team board.Mar 20 2026, 12:51 PM

Th example above is vector2022 skin.

Minerva skin has other issues....

Screenshot 2026-03-20 at 14.00.16.png (1×1 px, 172 KB)

On vector we could probably touch: https://abstract.wikipedia.org/wiki/MediaWiki:Vector.css but not allowed but maybe reader team should fix it

and add:

@media (max-width: 719px) {
    .vector-page-titlebar .firstHeading {
        flex-basis: 70%;
    }
    .vector-page-titlebar {
        flex-wrap: wrap;
    }
}

DSmit-WMF renamed this task from Multiple pages not correct response and heading/page-title unreadable to Multiple pages not correct responsive and heading/page-title unreadable.Mar 20 2026, 2:16 PM

DSmit-WMF added projects: Upstream, Vector 2022.

In T420724#11732083, @DSmit-WMF wrote:

Th example above is vector2022 skin.

Minerva skin has other issues....

Let's keep tasks specific to one issue at a time. I think that's a Discussion Tools issue?

For reference upstream task:https://phabricator.wikimedia.org/T365631

Change #1256419 had a related patch set uploaded (by Daphne Smit; author: Daphne Smit):

[mediawiki/skins/Vector@master] PageTitlebar: make title at least 70% width so language and buttons stack underneath

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

gerritbot added a project: Patch-For-Review.Mar 20 2026, 4:03 PM

Jdlrobson-WMF added a parent task: T365631: Redesign Vector 2022 header and actions for mobile devices.Mar 20 2026, 5:39 PM

Jdlrobson-WMF added a project: Readers Essential Work.

Jdlrobson-WMF moved this task from For triage to Unused on the Readers Essential Work board.

Jdlrobson-WMF moved this task from Unused to Vector 2022 is responsive on wikifunctions.org on the Readers Essential Work board.

Jdlrobson-WMF edited projects, added Readers Essential Work (Vector 2022 is responsive on wikifunctions.org); removed Readers Essential Work.

Change #1256419 merged by jenkins-bot:

[mediawiki/skins/Vector@master] PageTitlebar: make title at least 70% width so language and buttons stack underneath

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

ReleaseTaggerBot added a project: MW-1.46-notes (1.46.0-wmf.21; 2026-03-24).Mar 20 2026, 6:00 PM

Maintenance_bot removed a project: Patch-For-Review.Mar 20 2026, 6:31 PM

Jdforrester-WMF edited projects, added Abstract Wikipedia team (26Q3 (Jan–Mar)); removed Abstract Wikipedia team.Mar 23 2026, 3:24 PM

Jdforrester-WMF moved this task from Incoming to Ready to deploy on the Abstract Wikipedia team (26Q3 (Jan–Mar)) board.

Jdforrester-WMF moved this task from Ready to deploy to Needs Sign-off on the Abstract Wikipedia team (26Q3 (Jan–Mar)) board.Mar 25 2026, 1:42 PM

View with the fix:

DSantamaria added a project: Essential-Work.Apr 7 2026, 1:46 PM

	F73282456: Screenshot 2026-03-20 at 14.00.16.png
	Mar 20 2026, 1:00 PM

	F73276315: Screenshot 2026-03-20 at 13.34.30.png
	Mar 20 2026, 12:36 PM

Vector 2022 responsive shows long titles very poorly on small screens, especially with Discussion Tools' "add topic" button"Closed, ResolvedPublicBUG REPORTActions

Description

Details

Related ObjectsSearch...

Event Timeline

Vector 2022 responsive shows long titles very poorly on small screens, especially with Discussion Tools' "add topic" button"
Closed, ResolvedPublicBUG REPORT
Actions

Related Objects
Search...