diff --git a/examples/check-lists/index.js b/examples/check-lists/index.js index 6d1effc07..7f4511eeb 100644 --- a/examples/check-lists/index.js +++ b/examples/check-lists/index.js @@ -40,15 +40,21 @@ class CheckListItem extends React.Component { const { attributes, children, node } = this.props const checked = node.data.get('checked') return ( -
- +
+ - {children} + + {children} +
) } diff --git a/examples/index.css b/examples/index.css index 25679f582..803b08292 100644 --- a/examples/index.css +++ b/examples/index.css @@ -208,7 +208,19 @@ input:focus { margin-top: 0; } -.check-list-item [contenteditable="false"] { - display: inline-block; +.check-list-item { + display: flex; + flex-direction: row; +} + +.check-list-item > span:first-child { margin-right: 0.75em; } + +.check-list-item > span:last-child { + flex: 1; +} + +.check-list-item > span:last-child:focus { + outline: none; +}