https://app.replay.io/recording/vikireestr--14b65035-08f6-4eaa-b8ee-cabec030f7e7
After upgrading from MW 1.40 to MW 1.41 the Vector-2022 skin became worse at Mobile devices (see screenshots). Now there is a gap from the right side.
Description
Description
Related Objects
Related Objects
Event Timeline
Comment Actions
@Fokebox: Thanks for reporting this. For future reference, please use the bug report form (linked from the top of the task creation page) to create a bug report, and fill in the sections in the template, instead of deleting them.
Cannot reproduce, neither desktop nor my mobile phone:
Feel free to check https://www.mediawiki.org/wiki/Communication for support venues.
Comment Actions
I see this problem at iPhone 12 at three browsers: Safari, Chrome and Yandex browser.
Moreover the previous version of my MediaWiki website (MW 1.40) - all looked good.
Comment Actions
It would be nice if someone included the links so that not everyone needs to type them from the screenshots… Here are they:
- https://ru.wikijournal.org/wiki/Заглавная_страница?safemode=1 (1.40)
- https://wikireestr.ru/index.php/Заглавная_страница?safemode=1 (1.41)
I can reproduce this in Firefox as well: the header has a minimum width of 452px, so @Aklapper your responsive design mode with 500px width was just above the size at which it breaks. (By the way, AFAIK all browsers on iOS are required to use the browser engine of Safari, so testing in three browsers tells us just as much as testing in one browser.)
I think it’s caused by 8d9b148cf (cc @bwang): previously, the min-width: @min-width-supported applied only to .mw-page-container, now it also applies to .vector-header-container. There is a rule .skin--responsive .mw-page-container { min-width: auto; }, but there is no similar rule for .vector-header-container.
Comment Actions
Some other examples of "desktop mode" on a phone (Android-based with browser Microsoft Edge).
User-Agent: Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36
In my opinion, some of the texts are just *too* small.
Comment Actions
The font size inconsistency is caused by Edge trying to guess what’s “important” and increasing the font size of that. I don’t think we have much control over that; but even if we had, it’s out of the scope of this task.
Comment Actions
The mobile view with wgResponsiveVector is still experimental and we currently do not support browsers below 500px width. I'm hoping that this will become less experimental if the adoption planned in Wikifunctions begins: T349408
Until then I suggest adding code to MediaWiki:Vector-2022.css to tweak the layout to your needs.
Patches to improve Vector 2022 at this resolution are appreciated in the mean time.