From c1e7e5522a38d7ddaadb3693134ffedf6c08a59e Mon Sep 17 00:00:00 2001 From: jasmussen Date: Tue, 21 Apr 2020 11:23:49 +0200 Subject: [PATCH] Allow title and button-based appender to inherit styles. MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit File under "should've probably done this sooner", this PR allows the title field and the initial appender to inherit the theme styles defined by an editor style. In the past this wasn't possible due to how things were structured. But as it is, those styles are inherited by what is applied to the `editor-styles-wrapper`, which means this works both for themes that don't register and editor style — it looks like before — but now it also works for themes that do. --- .../src/components/default-block-appender/style.scss | 2 +- packages/editor/src/components/post-title/style.scss | 11 ++++++----- 2 files changed, 7 insertions(+), 6 deletions(-) diff --git a/packages/block-editor/src/components/default-block-appender/style.scss b/packages/block-editor/src/components/default-block-appender/style.scss index 2de7799cf1dc8c..fa805cad81d0d7 100644 --- a/packages/block-editor/src/components/default-block-appender/style.scss +++ b/packages/block-editor/src/components/default-block-appender/style.scss @@ -55,7 +55,7 @@ .block-editor-block-list__empty-block-inserter.block-editor-block-list__empty-block-inserter, // Empty paragraph, needs specificity to override inherited popover styles. .block-editor-default-block-appender .block-editor-inserter { // Empty appender. position: absolute; - top: 2px; // Centers it in the default paragraph height. + top: 0; height: $button-size-small + $grid-unit-10; .block-editor-inserter__toggle { diff --git a/packages/editor/src/components/post-title/style.scss b/packages/editor/src/components/post-title/style.scss index 351423d657b235..214f68d861c1cc 100644 --- a/packages/editor/src/components/post-title/style.scss +++ b/packages/editor/src/components/post-title/style.scss @@ -1,6 +1,5 @@ .editor-post-title { position: relative; - font-size: $editor-font-size; .editor-post-title__input { display: block; @@ -8,14 +7,16 @@ margin: 0; box-shadow: none; background: transparent; - font-family: $editor-font; - line-height: $default-line-height; - color: $dark-gray-900; transition: border 0.1s ease-out, box-shadow 0.1s linear; @include reduce-motion("transition"); padding: #{ $block-padding + 5px } 0; word-break: keep-all; + // Inherit the styles set by the theme. + font-family: inherit; + line-height: inherit; + color: inherit; + // Stack borders on mobile. border: $border-width solid transparent; border-left-width: 0; @@ -31,7 +32,7 @@ // Match h1 heading. font-size: 2.44em; - font-weight: 600; + font-weight: bold; // Large text needs a 3:1 contrast ratio. &::-webkit-input-placeholder {