diff --git a/blocks/library/embed/index.js b/blocks/library/embed/index.js index 5c6db137717ef..9e89059da1d8e 100644 --- a/blocks/library/embed/index.js +++ b/blocks/library/embed/index.js @@ -33,10 +33,12 @@ registerBlock( 'core/embed', { { wp.i18n.__( 'Embed URL' ) } - - +
+ + +
); } diff --git a/blocks/library/embed/style.scss b/blocks/library/embed/style.scss index fc9b765f932a8..b2aa7603c435e 100644 --- a/blocks/library/embed/style.scss +++ b/blocks/library/embed/style.scss @@ -2,26 +2,32 @@ align-items: center; display: flex; flex-direction: column; - margin: -15px; padding: 6em 0; text-align: center; + font-family: $default-font; + font-size: $default-font-size; + background: $light-gray-100; } .blocks-embed__placeholder-label { display: flex; - align-items: center; justify-content: center; font-weight: bold; + margin-bottom: 1em; .dashicon { margin-right: 1ch; } } +.blocks-embed__placeholder-fieldset { + display: flex; + flex-direction: row; + width: 100%; + max-width: 280px; +} + .blocks-embed__placeholder-input { - border-radius: 4px; - margin: 1.62em 0 1em; - min-width: 280px; - padding: 0.62em; - text-align: center; + margin-right: 8px; + flex: 1 1 auto; } diff --git a/editor/assets/stylesheets/main.scss b/editor/assets/stylesheets/main.scss index 1c0dab0aa8436..a06b83d3e6816 100644 --- a/editor/assets/stylesheets/main.scss +++ b/editor/assets/stylesheets/main.scss @@ -48,4 +48,25 @@ body.toplevel_page_gutenberg { @include break-small() { padding-top: $header-height; } + + input, textarea { + border-radius: 4px; + border-color: $light-gray-500; + font-family: $default-font; + font-size: $default-font-size; + padding: 6px 10px; + + &::-webkit-input-placeholder { + color: $dark-gray-100; + } + &::-moz-placeholder { + color: $dark-gray-100; + } + &:-ms-input-placeholder { + color: $dark-gray-100; + } + &:-moz-placeholder { + color: $dark-gray-100; + } + } }