Page MenuHomePhabricator

Improve fullscreen background for devices with overscroll and themeing
Closed, ResolvedPublic

Description

Mobile devices feature overscroll and rubber banding, where you can scroll beyond the boundary of the contents and you will actually see the body. When we are in full view mode for a viewer like this, we expect to have a black background.

The top of the screen is also used to determine an implicit theme-color on certain devices (to style the chrome of the user-agent itself). As the top of our page changes in color depending on the image we load, we should set a specific theme-color ourselves.

Event Timeline

Change #1050446 had a related patch set uploaded (by TheDJ; author: TheDJ):

[mediawiki/extensions/MultimediaViewer@master] MMV: Set body background and theme-color

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

Example from Safari Desktop (compact appearance), but mobile has the same behaviors.

Screenshot 2024-06-27 at 21.13.06.jpeg (1×2 px, 1 MB)

Screenshot 2024-06-27 at 21.13.46.jpeg (1×2 px, 1 MB)

Change #1050446 merged by jenkins-bot:

[mediawiki/extensions/MultimediaViewer@master] MMV: Set body background and theme-color

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

TheDJ moved this task from Backlog to Design on the MediaViewer board.