Skip to content

Commit

Permalink
Allow title and button-based appender to inherit styles.
Browse files Browse the repository at this point in the history
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.
  • Loading branch information
jasmussen committed Apr 22, 2020
1 parent d7a1f17 commit c1e7e55
Show file tree
Hide file tree
Showing 2 changed files with 7 additions and 6 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -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 {
Expand Down
11 changes: 6 additions & 5 deletions packages/editor/src/components/post-title/style.scss
Original file line number Diff line number Diff line change
@@ -1,21 +1,22 @@
.editor-post-title {
position: relative;
font-size: $editor-font-size;

.editor-post-title__input {
display: block;
width: 100%;
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;
Expand All @@ -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 {
Expand Down

0 comments on commit c1e7e55

Please sign in to comment.