Polish the visual styles a bit.

- Add a bg color. This will receive further love later, as this block has surfaced a problem with the initial design.
- Use the default font stack
- Normalize the input fields for gutenberg
- Rephrase ever so slightly
- Reposition input field and embed button with flex

blocks/library/embed/index.js

@@ -33,10 +33,12 @@ registerBlock( 'core/embed', {
 						<Dashicon icon="cloud" />
 						{ wp.i18n.__( 'Embed URL' ) }
 					</div>
-					<input type="url" className="blocks-embed__placeholder-input" placeholder={ wp.i18n.__( 'Enter URL to embed here.' ) } />
-					<Button isLarge>
-						{ wp.i18n.__( 'Embed the link above.' ) }
-					</Button>
+					<div className="blocks-embed__placeholder-fieldset">
+						<input type="url" className="blocks-embed__placeholder-input" placeholder={ wp.i18n.__( 'Enter URL to embed here...' ) } />
+						<Button isLarge>
+							{ wp.i18n.__( 'Embed' ) }
+						</Button>
+					</div>
 				</div>
 			);
 		}

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;
 }

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;
+		}
+	}
 }