Page MenuHomePhabricator
Create Task
Maniphest T311254

On mobile header icons overlap with search bar in responsive mode
Closed, DuplicatePublic
Actions

Description

Hi!
I use following MW:
MediaWiki 1.38.1
PHP 7.3.32 (cgi-fcgi)
MySQL 5.7.34
I would suggest to the development team to improve the outlay of Mobile version of new Vector 2022 skin. I have svg logo uploaded and as you can see that the search button is very close to the logo (Google Chrome from iPhone 11):

09A32C02-4326-496E-819B-12B12A6E5CBB.jpeg (540×1 px, 235 KB)

I would line the buttons with margins as it shown like on the image below:
A262B34B-4D6F-4F25-89D7-177ADB8E560A.jpeg (540×1 px, 30 KB)

Related Objects
Search...

StatusSubtypeAssignedTask
 DuplicateNoneT311254 On mobile header icons overlap with search bar in responsive mode
 OpenNoneT106463 [EPIC] Ready responsive Vector for wider deployment
 DuplicateNoneT106464 Consider collapsing/expanding search bar in responsive Vector
 ResolvedJdlrobsonT106281 Site logo should be present on Vector's responsive design
 ResolvedJdlrobsonT106465 Figure out what to do with the personal tools in responsive Vector
 DuplicateNoneT113363 Make personal tools flexible/resilient wrt extension additions
 ResolvedJdlrobsonT106466 Figure out what to do with the footer area in responsive Vector
 ResolvedJdlrobsonT113362 Consider moving searchbar to sidebar in responsive Vector
 ResolvedJdlrobsonT119871 Remove the "Read" tab in Vector's responsive design
 ResolvedJdlrobsonT113101 Images should be responsive in Vector and restrained to a max-size.
 ResolvedBUG REPORTJdlrobsonT367463 Tables with images inside them appear at minuscule size or disappear due to responsive image CSS
 DuplicateBUG REPORTNoneT313292 Slight overflow on iPhoneSE with Vector-2022 due to header
 DuplicateNoneT319305 Consider how Vector 2022 displays on mobile devices
 DuplicateBUG REPORTNoneT323191 Alerts/notifications flyouts misaligned on mobile when width=device-width is enabled
 ResolvedJdlrobsonT361573 Make Vector 2022 support viewport widths starting from 320px
 OpenJdrewniakT314487 [Visual refinements] Decrease (or remove) min-width on Vector dropdown menus
 ResolvedBUG REPORTJdlrobsonT367462 Responsive Vector uses hatnote.less and infobox.less at all resolutions
 DuplicateBUG REPORTNoneT367486 Innecesary padding has been added to the infoboxes in Vector 2022
 DuplicateBUG REPORTNoneT367484 Height of images inside divs are not respected due to a css !important rule in Vector 2022
 In ProgressNoneT369609 Appearance menu goes off screen on smaller viewports
 OpenNoneT365631 Redesign Vector 2022 header and actions for mobile devices
 StalledBUG REPORTNoneT395624 Bookmark button breaks on Vector responsive design
 OpenBUG REPORTNoneT363674 Can't toggle responsive mode for mobile without changing the desktop skin
 OpenBUG REPORTJdlrobsonT352485 Inconsistency in skin responsive preference when $wgVectorResponsive is false.
 DuplicateNoneT395859 Vector should use search dialog at lower resolutions

Event Timeline

Fokebox created this task.Jun 23 2022, 4:14 PM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptJun 23 2022, 4:14 PM
Jdlrobson added a subtask: T106463: [EPIC] Ready responsive Vector for wider deployment.Jun 23 2022, 6:11 PM
Jdlrobson subscribed.

Do you have $wgVectorResponsive = true in your LocalSettings.php? If so, this is not production ready yet (see T106463).

Jdlrobson renamed this task from Bug at Mobile version of new Vector 2022 skin to On mobile header icons overlap with search bar in responsive mode.Jun 23 2022, 6:11 PM
Jdlrobson edited projects, added Vector 2022; removed Vector (legacy skin).
Fokebox added a comment.Jun 23 2022, 7:00 PM

@Jdlrobson yes I have $wgVectorResponsive = true;

Jdlrobson added a project: Web-Team-Backlog-Archived.Jun 24 2022, 3:06 PM
Jdlrobson moved this task from Incoming to For Iteration on the Vector 2022 board.
Jdlrobson added a comment.Jun 24 2022, 5:05 PM

Hoping to fix this for 1.39 release but can't promise that. I've updated documentation to be more clear on the state of this flag: https://www.mediawiki.org/wiki/Skin:Vector/2022#Configuration_parameters

Aklapper removed Fokebox as the assignee of this task.Jun 25 2022, 9:09 AM
ovasileva triaged this task as Low priority.Jun 27 2022, 2:50 PM
ovasileva moved this task from Incoming to Groomed on the Web-Team-Backlog-Archived board.
Jdlrobson moved this task from For Iteration to Mobile on the Vector 2022 board.Feb 8 2024, 5:31 PM
Jdlrobson closed this task as a duplicate of T361573: Make Vector 2022 support viewport widths starting from 320px.May 22 2024, 4:53 PM

Further work on the header will happen in T365631.

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