Revert "Meta Boxes: Give #poststuff div a broader scope; remove unuse…

…d #postbox-container-2 (#4697)" This reverts commit e25a2a5.
WordPress · Feb 9, 2018 · 77dd2a8 · 77dd2a8
1 parent a451ffb
commit 77dd2a8
Show file tree

Hide file tree

Showing 3 changed files with 90 additions and 92 deletions.
diff --git a/edit-post/components/layout/index.js b/edit-post/components/layout/index.js
@@ -54,7 +54,7 @@ function Layout( {
 			<UnsavedChangesWarning />
 			<AutosaveMonitor />
 			<Header />
-			<div id="poststuff" className="edit-post-layout__content" role="region" aria-label={ __( 'Editor content' ) } tabIndex="-1">
+			<div className="edit-post-layout__content" role="region" aria-label={ __( 'Editor content' ) } tabIndex="-1">
 				<EditorNotices />
 				<div className="edit-post-layout__editor">
 					<EditorModeKeyboardShortcuts />

diff --git a/editor/components/meta-boxes/meta-boxes-area/style.scss b/editor/components/meta-boxes/meta-boxes-area/style.scss
@@ -1,93 +1,93 @@
 
-/* Include #poststuff to override the css rules found in core. */
-#poststuff .editor-meta-boxes-area {
+.editor-meta-boxes-area {
 	position: relative;
 
-	/* Match width and positioning of the meta boxes. Override default styles. */
-	.postbox-container {
+		/* Match width and positioning of the meta boxes. Override default styles. */
+	#poststuff {
 		margin: 0 auto;
 		padding-top: 0;
-		width: 100%;
+		min-width: auto;
+	}
 
-		#post {
-			margin: 0;
-		}
+	#post {
+		margin: 0;
+	}
 
-		/* Override Default meta box stylings */
+	/* Override Default meta box stylings */
 
-		.postbox h3.hndle,
-		.postbox .stuffbox > h3,
-		.postbox h2.hndle { /* WordPress selectors yolo */
-			border-bottom: 1px solid $light-gray-500;
-			box-sizing: border-box;
-			color: $dark-gray-500;
-			font-weight: 600;
-			font-size: 14px;
-			line-height: 1.4;
-			margin: 0;
-			outline: none;
-			padding: 15px;
-			position: relative;
-			width: 100%;
-		}
+	#poststuff h3.hndle,
+	#poststuff .stuffbox > h3,
+	#poststuff h2.hndle { /* WordPress selectors yolo */
+		border-bottom: 1px solid $light-gray-500;
+		box-sizing: border-box;
+		color: $dark-gray-500;
+		font-weight: 600;
+		outline: none;
+		padding: 15px;
+		position: relative;
+		width: 100%;
+	}
 
-		.postbox {
-			border: 0;
-			color: $dark-gray-500;
-			margin-bottom: 0;
-		}
+	.postbox {
+		border: 0;
+		color: $dark-gray-500;
+		margin-bottom: 0;
+	}
 
-		.postbox > .inside {
-			border-bottom: 1px solid $light-gray-500;
-			color: $dark-gray-500;
-			padding: 15px;
-			margin: 0;
-		}
+	.postbox > .inside {
+		border-bottom: 1px solid $light-gray-500;
+		color: $dark-gray-500;
+		padding: 15px;
+		margin: 0;
+	}
 
-		input,
-		select,
-		textarea {
-			background: inherit;
-			border: 1px solid $light-gray-500;
-			border-radius: 4px;
-			box-shadow: none;
-			color: $dark-gray-800;
-			display: inline-block;
-			font-family: inherit;
-			font-size: 13px;
-			line-height: 24px;
-			outline: none;
-			padding: 4px;
-		}
+	input {
+		max-width: 300px;
+	}
+
+	input,
+	select,
+	textarea {
+		background: inherit;
+		border: 1px solid $light-gray-500;
+		border-radius: 4px;
+		box-shadow: none;
+		color: $dark-gray-800;
+		display: inline-block;
+		font-family: inherit;
+		font-size: 13px;
+		line-height: 24px;
+		outline: none;
+		padding: 4px;
+	}
 
-		input:hover,
-		select:hover,
-		textarea:hover {
-			border: 1px solid $light-gray-700;
-		}
+	input:hover,
+	select:hover,
+	textarea:hover {
+		border: 1px solid $light-gray-700;
+	}
 
-		.postbox .handlediv {
-			height: 44px;
-			width: 44px;
-		}
+	.postbox .handlediv {
+		height: 44px;
+		width: 44px;
+	}
 
-		&.is-loading:before {
-			position: absolute;
-			top: 0;
-			left: 0;
-			right: 0;
-			bottom: 0;
-			content: '';
-			background: transparent;
-			z-index: z-index( '.editor-meta-boxes-area.is-loading:before');
-		}
+	&.is-loading:before {
+		position: absolute;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		content: '';
+		background: transparent;
+		z-index: z-index( '.editor-meta-boxes-area.is-loading:before');
+	}
 
-		.spinner {
-			position: absolute;
-			top: 10px;
-			right: 20px;
-			z-index: z-index( '.editor-meta-boxes-area .spinner');
-		}
+	.spinner {
+		position: absolute;
+		top: 10px;
+		right: 20px;
+		z-index: z-index( '.editor-meta-boxes-area .spinner');
 	}
 }
 

diff --git a/lib/meta-box-partial-page.php b/lib/meta-box-partial-page.php
@@ -310,23 +310,21 @@ function the_gutenberg_metaboxes() {
 	<form class="metabox-base-form">
 	<?php gutenberg_meta_box_post_form_hidden_fields( $post ); ?>
 	</form>
-	<div class="metabox-location-container">
-		<?php foreach ( $locations as $location ) : ?>
-			<form class="metabox-location-<?php echo esc_attr( $location ); ?>">
-				<div class="sidebar-open">
-					<div class="postbox-container">
-						<?php
-						do_meta_boxes(
-							$current_screen,
-							$location,
-							$post
-						);
-						?>
-					</div>
+	<?php foreach ( $locations as $location ) : ?>
+		<form class="metabox-location-<?php echo esc_attr( $location ); ?>">
+			<div id="poststuff" class="sidebar-open">
+				<div id="postbox-container-2" class="postbox-container">
+					<?php
+					do_meta_boxes(
+						$current_screen,
+						$location,
+						$post
+					);
+					?>
 				</div>
-			</form>
-		<?php endforeach; ?>
-	</div>
+			</div>
+		</form>
+	<?php endforeach; ?>
 	<?php
 
 	// Reset meta box data.