diff --git a/assets/stylesheets/shared/functions/_z-index.scss b/assets/stylesheets/shared/functions/_z-index.scss index 097e7493e5771..4dba0602f02a3 100644 --- a/assets/stylesheets/shared/functions/_z-index.scss +++ b/assets/stylesheets/shared/functions/_z-index.scss @@ -89,11 +89,11 @@ $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, '.auth__self-hosted-instructions': 4, - '.editor-word-count': 4, '.auth__form .form-password-input__toggle-visibility': 4, '.site-selector': 10, '.editor-featured-image__preview.is-transient::after': 10, diff --git a/client/post-editor/editor-action-bar/style.scss b/client/post-editor/editor-action-bar/style.scss index 14f28094c5132..d192d3e7663af 100644 --- a/client/post-editor/editor-action-bar/style.scss +++ b/client/post-editor/editor-action-bar/style.scss @@ -11,7 +11,7 @@ } } -.editor-action-bar__saved-status { +.editor-status-label.editor-action-bar__saved-status { line-height: 1; position: fixed; bottom: 0px; @@ -24,10 +24,18 @@ line-height: 1; color: lighten( $gray, 10% ); pointer-events: none; - z-index: 2; + z-index: z-index( 'root', '.editor-action-bar__saved-status' ); + + @include breakpoint( "<480px" ) { + display: none; + } .focus-sidebar & { - right: 273px; + 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 f419a3608e9b1..b127413966d40 100644 --- a/client/post-editor/editor-word-count/style.scss +++ b/client/post-editor/editor-word-count/style.scss @@ -1,17 +1,23 @@ .editor-word-count { position: fixed; right: 0; - bottom: 3px; - padding: 8px; + bottom: 0; + 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: 3; + z-index: z-index( 'root', '.editor-word-count' ); .focus-sidebar & { right: 273px; } + + @include breakpoint( "<960px" ) { + .focus-sidebar & { + right: 229px; + } + } }