diff --git a/blocks/editable/format-toolbar/index.js b/blocks/editable/format-toolbar/index.js
index 1d84ca97c89d8..65c24f1e7cac5 100644
--- a/blocks/editable/format-toolbar/index.js
+++ b/blocks/editable/format-toolbar/index.js
@@ -1,3 +1,8 @@
+/**
+ * External dependencies
+ */
+import { Fill } from 'react-slot-fill';
+
/**
* WordPress dependencies
*/
@@ -172,32 +177,36 @@ class FormatToolbar extends Component {
{ ( isAddingLink || isEditingLink ) &&
-
+
+
+
}
{ !! formats.link && ! isAddingLink && ! isEditingLink &&
-
+
+
+
}
);
diff --git a/blocks/editable/index.js b/blocks/editable/index.js
index b778fef6a6ce6..99fce7bec187b 100644
--- a/blocks/editable/index.js
+++ b/blocks/editable/index.js
@@ -15,7 +15,7 @@ import {
noop,
} from 'lodash';
import { nodeListToReact } from 'dom-react';
-import { Fill } from 'react-slot-fill';
+import { Fill, Slot } from 'react-slot-fill';
import 'element-closest';
/**
@@ -325,9 +325,9 @@ export default class Editable extends Component {
// is absolute positioned and it's not shown when we compute the position here
// so we compute the position about its parent relative position and adds the offset
const toolbarOffset = this.props.inlineToolbar ?
- { top: 50, left: 0 } :
- { top: 40, left: -( ( blockPadding * 2 ) + blockMoverMargin ) };
- const linkModalWidth = 250;
+ { top: 10, left: 0 } :
+ { top: 0, left: -( ( blockPadding * 2 ) + blockMoverMargin ) };
+ const linkModalWidth = 305;
return {
top: position.top - containerPosition.top + ( position.height ) + toolbarOffset.top,
@@ -709,6 +709,7 @@ export default class Editable extends Component {
{ MultilineTag ? { placeholder } : placeholder }
}
+ { focus && }
);
}