From 9b5325f38a6d3360e67b9e48b4dad729f7080c3b Mon Sep 17 00:00:00 2001 From: Kjell Reigstad Date: Fri, 15 Mar 2019 08:37:23 -0400 Subject: [PATCH] Remove the left toolbar border on mobile screens. This fixes some visual bugs with themes like TwentyNineteen, which include margins on either side of the block on mobile. --- .../src/components/block-toolbar/style.scss | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/packages/block-editor/src/components/block-toolbar/style.scss b/packages/block-editor/src/components/block-toolbar/style.scss index c0d8aec4838b13..e0fbc6601ee369 100644 --- a/packages/block-editor/src/components/block-toolbar/style.scss +++ b/packages/block-editor/src/components/block-toolbar/style.scss @@ -5,19 +5,20 @@ overflow: auto; // Allow horizontal scrolling on mobile. position: relative; transition: border-color 0.1s linear, box-shadow 0.1s linear; - - // Show a left border on the parent container. - border-left: none; - box-shadow: -$block-left-border-width 0 0 0 $dark-gray-500; - - // Show a lighter version for dark themes. - .is-dark-theme & { - box-shadow: -$block-left-border-width 0 0 0 $light-gray-600; - } + border-left: $border-width solid $light-gray-800; @include break-small() { // Allow overflow on desktop. overflow: inherit; + + // Show a left border on the parent container. + border-left: none; + box-shadow: -$block-left-border-width 0 0 0 $dark-gray-500; + + // Show a lighter version for dark themes. + .is-dark-theme & { + box-shadow: -$block-left-border-width 0 0 0 $light-gray-600; + } } // The component is born with a border, but we only need some of them.