Customize: Increase width of controls pane on large monitors to give more room.

Props celloexpressions, timmydcrawford.
Fixes #32296.

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


git-svn-id: http://core.svn.wordpress.org/trunk@40387 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-admin/css/customize-controls-rtl.css

@@ -1189,20 +1189,18 @@ p.customize-section-description {
 .customize-section-description-container + #customize-control-custom_css:last-child {
 	margin-right: -12px;
 	width: 299px;
+	width: -webkit-calc( 100% + 24px );
+	width: calc( 100% + 24px );
 	margin-bottom: -12px;
 }
 
 @media screen and ( max-width: 640px ) {
 	.customize-section-description-container + #customize-control-custom_css:last-child {
-		margin-right: 0;
 		margin-left: 0;
-		width: 100%;
 	}
 	.customize-section-description-container + #customize-control-custom_css:last-child textarea {
 		height: -webkit-calc( 100vh - 140px );
 		height: calc( 100vh - 140px );
-		width: 100%;
-		border: solid 1px #ddd;
 	}
 }
 

wp-admin/css/customize-controls.css

@@ -1189,20 +1189,18 @@ p.customize-section-description {
 .customize-section-description-container + #customize-control-custom_css:last-child {
 	margin-left: -12px;
 	width: 299px;
+	width: -webkit-calc( 100% + 24px );
+	width: calc( 100% + 24px );
 	margin-bottom: -12px;
 }
 
 @media screen and ( max-width: 640px ) {
 	.customize-section-description-container + #customize-control-custom_css:last-child {
-		margin-left: 0;
 		margin-right: 0;
-		width: 100%;
 	}
 	.customize-section-description-container + #customize-control-custom_css:last-child textarea {
 		height: -webkit-calc( 100vh - 140px );
 		height: calc( 100vh - 140px );
-		width: 100%;
-		border: solid 1px #ddd;
 	}
 }
 

wp-admin/css/themes-rtl.css

@@ -1332,7 +1332,9 @@ body.full-overlay-active {
 	-moz-box-sizing: border-box;
 	box-sizing: border-box;
 	position: fixed;
-	width: 300px;
+	min-width: 300px;
+	max-width: 600px;
+	width: 18%;
 	height: 100%;
 	top: 0;
 	bottom: 0;
@@ -1361,6 +1363,26 @@ body.full-overlay-active {
 	margin-right: -300px;
 }
 
+@media screen and (min-width: 1667px) {
+	.wp-full-overlay.expanded {
+		margin-right: 18%;
+	}
+
+	.wp-full-overlay.collapsed .wp-full-overlay-sidebar {
+		margin-right: -18%;
+	}
+}
+
+@media screen and (min-width: 3333px) {
+	.wp-full-overlay.expanded {
+		margin-right: 600px;
+	}
+
+	.wp-full-overlay.collapsed .wp-full-overlay-sidebar {
+		margin-right: -600px;
+	}
+}
+
 .wp-full-overlay-sidebar:after {
 	content: "";
 	display: block;
@@ -1615,7 +1637,9 @@ body.full-overlay-active {
 	position: fixed;
 	bottom: 0;
 	right: 0;
-	width: 299px;
+	min-width: 299px;
+	max-width: 599px;
+	width: 18%;
 	height: 45px;
 	border-top: 1px solid #ddd;
 	background: #eee;

wp-admin/css/themes.css

@@ -1332,7 +1332,9 @@ body.full-overlay-active {
 	-moz-box-sizing: border-box;
 	box-sizing: border-box;
 	position: fixed;
-	width: 300px;
+	min-width: 300px;
+	max-width: 600px;
+	width: 18%;
 	height: 100%;
 	top: 0;
 	bottom: 0;
@@ -1361,6 +1363,26 @@ body.full-overlay-active {
 	margin-left: -300px;
 }
 
+@media screen and (min-width: 1667px) {
+	.wp-full-overlay.expanded {
+		margin-left: 18%;
+	}
+
+	.wp-full-overlay.collapsed .wp-full-overlay-sidebar {
+		margin-left: -18%;
+	}
+}
+
+@media screen and (min-width: 3333px) {
+	.wp-full-overlay.expanded {
+		margin-left: 600px;
+	}
+
+	.wp-full-overlay.collapsed .wp-full-overlay-sidebar {
+		margin-left: -600px;
+	}
+}
+
 .wp-full-overlay-sidebar:after {
 	content: "";
 	display: block;
@@ -1615,7 +1637,9 @@ body.full-overlay-active {
 	position: fixed;
 	bottom: 0;
 	left: 0;
-	width: 299px;
+	min-width: 299px;
+	max-width: 599px;
+	width: 18%;
 	height: 45px;
 	border-top: 1px solid #ddd;
 	background: #eee;

wp-includes/version.php

@@ -4,7 +4,7 @@
  *
  * @global string $wp_version
  */
-$wp_version = '4.8-alpha-40510';
+$wp_version = '4.8-alpha-40511';
 
 /**
  * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.