Maniphest T361573

Make Vector 2022 support viewport widths starting from 320px
Closed, ResolvedPublic
Actions

Assigned To

Authored By

	AAlhazwani-WMF
	Apr 2 2024, 10:35 AM

Tags

Referenced Files

	F43434536: image.png
	Apr 2 2024, 10:35 AM

Subscribers

UndercoverClassicist

Description

On Wikifunctions is currently possible to use Vector 2022 as a skin on mobile and smaller devices. The skin works great for devices no smaller than 500px, but as soon as we go under this value the layout breaks.

image.png (2×1 px, 382 KB)

Would it be possible to make Vector 2022 work for devices starting from 320px viewport width?

Details

	Subject	Repo	Branch	Lines +/-
	[Visual change] Limits two row header to mobile devices	mediawiki/skins/Vector	master	+5 -3
	Support Vector 2022 at > 320px	mediawiki/skins/Vector	master	+21 -8

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
		Open		None	T106463 [EPIC] Ready responsive Vector for wider deployment
		In Progress		Jdforrester-WMF	T349408 Use responsive Vector-2022 instead of Minerva for Wikifunctions Mobile and drop the secondary domain/MobileFrontend part
		Resolved		Jdlrobson	T361573 Make Vector 2022 support viewport widths starting from 320px

Event Timeline

AAlhazwani-WMF created this task.Apr 2 2024, 10:35 AM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptApr 2 2024, 10:35 AM

ovasileva triaged this task as Medium priority.Apr 4 2024, 8:11 AM

ovasileva edited projects, added Web-Team-Backlog (FY2023-24 Q4 Sprint 2); removed Web-Team-Backlog.

AAlhazwani-WMF attached a referenced file: F43434536: image.png. (Show Details)Apr 4 2024, 9:15 AM

Jdlrobson edited projects, added Web-Team-Backlog; removed Web-Team-Backlog (FY2023-24 Q4 Sprint 2).Apr 23 2024, 5:25 PM

Jdlrobson added a parent task: T106463: [EPIC] Ready responsive Vector for wider deployment.May 1 2024, 3:32 PM

Jdlrobson mentioned this in T313292: Slight overflow on iPhoneSE with Vector-2022 due to header.

Izno subscribed.May 1 2024, 4:50 PM

Jdlrobson moved this task from Incoming to Needs Prioritization (Tech) on the Web-Team-Backlog board.May 15 2024, 12:25 AM

Jdlrobson edited projects, added Web-Team-Backlog (Needs Prioritization (Tech)); removed Web-Team-Backlog.

Jdlrobson moved this task from Backlog to Wikifunctions responsie Vector 2022 on the Web-Team-Backlog (Needs Prioritization (Tech)) board.May 15 2024, 3:05 PM

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

[mediawiki/skins/Vector@master] Support Vector 2022 at > 320px

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

gerritbot added a project: Patch-For-Review.May 17 2024, 11:30 PM

Jdlrobson added a project: Wikifunctions.May 17 2024, 11:30 PM

Maintenance_bot added a project: Abstract Wikipedia team.May 18 2024, 12:30 AM

Jdforrester-WMF added a parent task: T349408: Use responsive Vector-2022 instead of Minerva for Wikifunctions Mobile and drop the secondary domain/MobileFrontend part.Mon, May 20, 2:45 PM

Jdforrester-WMF removed projects: Abstract Wikipedia team, Wikifunctions.

Change #1032897 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Support Vector 2022 at > 320px

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

Maintenance_bot removed a project: Patch-For-Review.Tue, May 21, 2:31 PM

ReleaseTaggerBot added a project: MW-1.43-notes (1.43.0-wmf.7; 2024-05-28).Tue, May 21, 3:00 PM

Jdforrester-WMF mentioned this in T349408: Use responsive Vector-2022 instead of Minerva for Wikifunctions Mobile and drop the secondary domain/MobileFrontend part.Tue, May 21, 5:35 PM

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

[mediawiki/skins/Vector@master] [Visual change] Limits two row header to mobile devices

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

gerritbot added a project: Patch-For-Review.Tue, May 21, 6:53 PM

Change #1034556 merged by jenkins-bot:

[mediawiki/skins/Vector@master] [Visual change] Limits two row header to mobile devices

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

Maintenance_bot removed a project: Patch-For-Review.Tue, May 21, 7:30 PM

Jdlrobson merged a task: T313292: Slight overflow on iPhoneSE with Vector-2022 due to header.Wed, May 22, 4:48 PM

Jdlrobson added subscribers: TheDJ, Buovjaga, Jdlrobson.

Jdlrobson mentioned this in T365631: Redesign Vector 2022 header and actions for mobile devices.Wed, May 22, 4:52 PM

Jdlrobson merged a task: T311254: On mobile header icons overlap with search bar in responsive mode.

Jdlrobson added a subscriber: Fokebox.

GMikesell-WMF mentioned this in T365384: Verify 1.43.0-wmf.7 deployment.Thu, May 30, 8:14 PM

Jdlrobson closed this task as Resolved.Wed, Jun 12, 8:15 PM

Jdlrobson claimed this task.

I am pretty sure this task caused T367462: Responsive Vector uses hatnote.less and infobox.less at all resolutions.

UndercoverClassicist subscribed.Thu, Jun 13, 8:18 PM

(For completeness T367462 was a side effect of T113101. Please follow T367468 for updates).

(^^ Last link in previous comment should have been T367468 instead)