Merge pull request #1035 from WordPress/fix/better-responsive

Polish responsive a bit
WordPress · Jun 7, 2017 · 5b4f5bb · 5b4f5bb
2 parents ef0d297 + d77ed4a
commit 5b4f5bb
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 4 deletions.
diff --git a/editor/block-switcher/style.scss b/editor/block-switcher/style.scss
@@ -2,10 +2,14 @@
 	border: 1px solid $light-gray-500;
 	box-shadow: $shadow-popover;
 	background-color: $white;
-	margin-right: 10px;
 	font-family: $default-font;
 	font-size: $default-font-size;
 	line-height: $default-line-height;
+	margin-right: -1px;
+
+	@include break-small() {
+		margin-right: $item-spacing;
+	}
 }
 
 .editor-block-switcher__toggle {

diff --git a/editor/header/style.scss b/editor/header/style.scss
@@ -7,11 +7,14 @@
 	flex-direction: row;
 	align-items: center;
 	z-index: z-index( '.editor-header' );
-	top: $admin-bar-height-big;
 	left: 0;
 	right: 0;
 
+	top: 0;
+	position: sticky;
+
 	@include break-small() {
+		top: $admin-bar-height-big;
 		position: fixed;
 	}
 

diff --git a/editor/modes/visual-editor/style.scss b/editor/modes/visual-editor/style.scss
@@ -90,7 +90,11 @@
 	width: 0;
 	white-space: nowrap;
 
-	top: $header-height + $admin-bar-height-big + $item-spacing;
+	top: $header-height + $item-spacing;
+
+	@include break-small() {
+		top: $header-height + $admin-bar-height-big + $item-spacing;
+	}
 
 	@include break-medium() {
 		top: $header-height + $admin-bar-height + $item-spacing;
@@ -114,7 +118,11 @@
 
 .editor-visual-editor__block-controls .components-toolbar {
 	display: inline-flex;
-	margin-right: $item-spacing;
+	margin-right: -1px;
+
+	@include break-small() {
+		margin-right: $item-spacing;
+	}
 }
 
 .editor-visual-editor__block-controls .editor-block-switcher {