From b61952fb680d07f45a7af05ca537f6f7a67e5c1e Mon Sep 17 00:00:00 2001
From: Timmy Crawford <timmyc@users.noreply.github.com>
Date: Wed, 15 Mar 2017 13:04:27 -0700
Subject: [PATCH] Editor: Fix footer styling issues (#12078)

* Editor: Fix footer styling issues.

* More footer updates.

* Updates per feedback.
---
 .../shared/functions/_z-index.scss            |  2 ++
 .../post-editor/editor-action-bar/style.scss  | 26 +++++++++++++++++--
 .../post-editor/editor-word-count/style.scss  | 11 +++++---
 3 files changed, 33 insertions(+), 6 deletions(-)

diff --git a/assets/stylesheets/shared/functions/_z-index.scss b/assets/stylesheets/shared/functions/_z-index.scss
index 8dd419ae3c349..88b04e3e8b5f1 100644
--- a/assets/stylesheets/shared/functions/_z-index.scss
+++ b/assets/stylesheets/shared/functions/_z-index.scss
@@ -75,6 +75,7 @@ $z-layers: (
 		'.domain-suggestion.is-clickable:hover': 1,
 		'.editor-html-toolbar': 1,
 		'.thank-you-card__header': 1,
+		'.editor-action-bar .editor-status-label': 2,
 		'.is-installing .theme': 2,
 		'.reader-update-notice': 2,
 		'.people-list-item .card__link-indicator': 2,
@@ -88,6 +89,7 @@ $z-layers: (
 		'.stats-module.is-loading .module-header-title::after': 2,
 		'ul.module-content-list-item-action-submenu': 2,
 		'ul.module-content-list-item-actions': 2,
+		'.editor-word-count': 3,
 		'.site-indicator__button': 3,
 		'ul.module-content-list-item-actions.collapsed': 3,
 		'.auth__input-wrapper .gridicon': 3,
diff --git a/client/post-editor/editor-action-bar/style.scss b/client/post-editor/editor-action-bar/style.scss
index 1a34b0236f2bd..04aa3d2490979 100644
--- a/client/post-editor/editor-action-bar/style.scss
+++ b/client/post-editor/editor-action-bar/style.scss
@@ -11,9 +11,31 @@
 	}
 
 	.editor-status-label {
+		line-height: 1;
 		position: fixed;
-		bottom: 12px;
-		left: 16px;
+			bottom: 0px;
+			left: 8px;
+		padding: 8px;
+		margin-right: 2px;
+		background-color: rgba( $white, 0.92 );
+		text-transform: uppercase;
+		font-size: 11px;
+		line-height: 1;
+		color: lighten( $gray, 10% );
+		pointer-events: none;
+		z-index: z-index( 'root', '.editor-action-bar .editor-status-label' );
+
+		@include breakpoint( "<480px" ) {
+			display: none;
+		}
+
+		.focus-sidebar & {
+			right: 228px;
+
+			@include breakpoint( ">960px" ) {
+				right: 273px;
+			}
+		}
 	}
 }
 
diff --git a/client/post-editor/editor-word-count/style.scss b/client/post-editor/editor-word-count/style.scss
index 2149893c8fd75..b127413966d40 100644
--- a/client/post-editor/editor-word-count/style.scss
+++ b/client/post-editor/editor-word-count/style.scss
@@ -2,19 +2,22 @@
 	position: fixed;
 		right: 0;
 		bottom: 0;
-	padding: 8px;
+	padding: 6px 8px 8px;
 	background-color: rgba( $white, 0.92 );
 	text-transform: uppercase;
 	font-size: 11px;
 	line-height: 1;
 	color: lighten( $gray, 10% );
 	pointer-events: none;
+	z-index: z-index( 'root', '.editor-word-count' );
 
 	.focus-sidebar & {
-		right: 272px;
+		right: 273px;
 	}
 
-	@include breakpoint( ">960px" ) {
-		padding: 16px;
+	@include breakpoint( "<960px" ) {
+		.focus-sidebar & {
+			right: 229px;
+		}
 	}
 }