Merge "Set mobile width cutoff to 550px"

includes/SkinMonoBook.php

@@ -103,7 +103,7 @@ class SkinMonoBook extends SkinTemplate {
 				'targets' => [ 'desktop', 'mobile' ],
 				'scripts' => [ 'resources/mobile-echo.js' ],
 				'styles' => [ 'resources/mobile-echo.less' => [
-					'media' => 'screen and (max-width: 850px)'
+					'media' => 'screen and (max-width: 550px)'
 				] ],
 				'dependencies' => [ 'ext.echo.badgeicons', 'mediawiki.util' ],
 				'messages' => [ 'monobook-notifications-link', 'monobook-notifications-link-none' ]

resources/mobile-echo.js

@@ -1,6 +1,6 @@
 ( function ( mw, $ ) {
 	$( function () {
-		var mobileCutoffWidth = 850,
+		var mobileCutoffWidth = 550,
 			notificationIcons = $( '#pt-notifications-alert, #pt-notifications-notice' ),
 			echoHacked = false,
 			echoHackActive = false,

resources/mobile-uls.js

@@ -1,5 +1,5 @@
 $( function () {
-	var mobileCutoffWidth = 850,
+	var mobileCutoffWidth = 550,
 		ULSTrigger = $( '#pt-uls' ),
 		ULSMoved = false;
 

resources/mobile.js

@@ -1,6 +1,6 @@
 ( function ( mw, $ ) {
 	$( function () {
-		var mobileCutoffWidth = 850,
+		var mobileCutoffWidth = 550,
 			// Track if DOM has been set up for mobile fanciness yet
 			monobookMobileElements = false,
 			// Toggles and targets for popouts

skin.json

@@ -49,10 +49,10 @@
 					"media": "screen"
 				},
 				"resources/screen-desktop.css": {
-					"media": "screen and (min-width: 851px)"
+					"media": "screen and (min-width: 551px)"
 				},
 				"resources/screen-mobile.less": {
-					"media": "screen and (max-width: 850px)"
+					"media": "screen and (max-width: 550px)"
 				}
 			}
 		},
@@ -63,7 +63,7 @@
 			],
 			"styles": {
 				"resources/mobile.js.less": {
-					"media": "screen and (max-width: 850px)"
+					"media": "screen and (max-width: 550px)"
 				}
 			},
 			"dependencies": [