Make the responsive layout behave better when the user zooms the page:

* Change the smartphone media query from 480 to 600px so it captures large screen phones in landscape mode.
* Set #wpadminbar to position: absolute at smartphone sizes so it scrolls with the page, freeing up the viewport.
* Remove the transition states on #adminmenu for better performance on mobile devices
* Make the responsive sidebar scroll with the page instead of using a fixed position
* Remove the -webkit-overflow-scrolling rule that was disabling scroll-to-top when tapping the iOS status bar.
* Remove unnecessary zoom declaration from -ms-viewport.

See #25858.


Built from https://develop.svn.wordpress.org/trunk@26373


git-svn-id: http://core.svn.wordpress.org/trunk@26273 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Matt Thomas
2013-11-26 01:38:10 +00:00
parent f9469c921d
commit e54ee86aaa
8 changed files with 30 additions and 108 deletions

View File

@@ -938,15 +938,12 @@
}
}
/* Horizontal */
@media screen and (max-width: 480px) and (orientation: landscape) {
/* Smartphone */
@media screen and (max-width: 600px) {
#wpadminbar {
position: absolute;
}
}
/* Smartphone */
@media screen and (max-width: 480px) {
#moby6-overlay {
position: fixed;
top: 0;