Polish a few broken things in the sidebar. (#20782)

There were some issues with the block sidebar: - The active style looked a bit overwhelming. - The button-group control lacked a little style. - The Width/Height controls for an image were offset.
WordPress · Mar 11, 2020 · 886b45c · 886b45c
1 parent dd0e49c
commit 886b45c
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 17 deletions.
diff --git a/packages/block-editor/src/components/block-styles/style.scss b/packages/block-editor/src/components/block-styles/style.scss
@@ -27,7 +27,13 @@
 	}
 
 	&.is-active {
-		@include block-style__is-active();
+		.block-editor-block-styles__item-label {
+			font-weight: bold;
+		}
+
+		.block-editor-block-styles__item-preview {
+			border: 2px solid $dark-gray-primary;
+		}
 	}
 }
 

diff --git a/packages/block-library/src/table/editor.scss b/packages/block-library/src/table/editor.scss
@@ -68,10 +68,6 @@
 			margin-bottom: 0;
 		}
 	}
-
-	.components-base-control + .components-base-control {
-		margin-top: 0;
-	}
 }
 
 .blocks-table__placeholder-input {

diff --git a/packages/components/src/base-control/style.scss b/packages/components/src/base-control/style.scss
@@ -20,7 +20,3 @@
 		font-style: italic;
 	}
 }
-
-.components-base-control + .components-base-control {
-	margin-top: $grid-unit-20;
-}
diff --git a/packages/components/src/button-group/style.scss b/packages/components/src/button-group/style.scss
@@ -1,22 +1,17 @@
 .components-button-group {
 	display: inline-block;
+	border-radius: $radius-block-ui;
+	border: $border-width solid $theme-color;
 
 	.components-button {
 		border-radius: 0;
 		display: inline-flex;
+		color: $theme-color;
 
 		& + .components-button {
 			margin-left: -1px;
 		}
 
-		&:first-child {
-			border-radius: 3px 0 0 3px;
-		}
-
-		&:last-child {
-			border-radius: 0 3px 3px 0;
-		}
-
 		// The focused button should be elevated so the focus ring isn't cropped,
 		// as should the active button, because it has a different border color.
 		&:focus,