Use a specific CSS class for the CSS reset mixin. (#16856)

* Use a specific CSS class for the CSS reset mixin. * List selectors individually instead. * Add selectors for the missing UI parts.
WordPress · Aug 29, 2019 · e0561b2 · e0561b2
1 parent 37c63b8
commit e0561b2
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 7 deletions.
diff --git a/assets/stylesheets/_mixins.scss b/assets/stylesheets/_mixins.scss
@@ -394,11 +394,6 @@
 		box-sizing: inherit;
 	}
 
-	select {
-		font-size: $default-font-size;
-		color: $dark-gray-500;
-	}
-
 	.input-control, // Upstream name is `.regular-text`.
 	input[type="text"],
 	input[type="search"],
@@ -440,6 +435,8 @@
 
 	select {
 		padding: 2px;
+		font-size: $default-font-size;
+		color: $dark-gray-500;
 
 		&:focus {
 			border-color: $blue-medium-600;

diff --git a/packages/edit-post/src/style.scss b/packages/edit-post/src/style.scss
@@ -61,8 +61,13 @@ body.block-editor-page {
 	@include wp-admin-reset( ".block-editor" );
 }
 
-.block-editor,
-// The modals are shown outside the .block-editor wrapper, they need these styles
+// Target the editor UI excluding the metaboxes and custom fields areas.
+.edit-post-header,
+.edit-post-visual-editor,
+.edit-post-text-editor,
+.edit-post-sidebar,
+.editor-post-publish-panel,
+.components-popover,
 .components-modal__frame {
 	@include reset;
 }

diff --git a/packages/editor/src/components/editor-notices/style.scss b/packages/editor/src/components/editor-notices/style.scss
@@ -22,6 +22,7 @@
 .components-editor-notices__dismissible,
 .components-editor-notices__pinned {
 	.components-notice {
+		box-sizing: border-box;
 		margin: 0 0 5px;
 		padding: 6px 12px;
 		min-height: $panel-header-height;