Skip to content

Commit

Permalink
Remove full-width trick pending better one
Browse files Browse the repository at this point in the history
This also adds a few improvements from the now deleted branch, #799, notably:

- clearing for video blocks. The responsive trickery means we have to, or we will get odd behavior otherwise
- better collapsing margins fix for the toolbar.
  • Loading branch information
jasmussen authored and mtias committed Jun 7, 2017
1 parent f7d2b3e commit 549228d
Show file tree
Hide file tree
Showing 2 changed files with 8 additions and 11 deletions.
2 changes: 2 additions & 0 deletions blocks/library/embed/style.scss
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
.blocks-embed,
.blocks-embed-video {
margin: 0;
clear: both; // necessary because we use responsive trickery to set width/height, and therefore the video doesn't intrinsically clear floats like an img does

&.is-loading {
display: flex;
flex-direction: column;
Expand Down
17 changes: 6 additions & 11 deletions editor/modes/visual-editor/style.scss
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,7 @@
}
}

/* "Hassle-free full bleed" from CSS Tricks */
.editor-visual-editor > *:not( [data-align="wide"] ) {
.editor-visual-editor {
max-width: $visual-editor-max-width;
margin-left: auto;
margin-right: auto;
Expand Down Expand Up @@ -105,16 +104,12 @@
}
}

$sticky-bottom-offset: 20px;
.editor-visual-editor__block-controls + div {
margin-top: -20px;

// prevent collapsing margins between the block and the toolbar
&:before {
content: "";
display: table;
clear: both;
}
}
// prevent collapsing margins between block and toolbar, matches the 20px bottom offset
margin-top: -$sticky-bottom-offset - 1px;
padding-top: 1px;
}

.editor-visual-editor__block-controls .components-toolbar {
display: inline-flex;
Expand Down

0 comments on commit 549228d

Please sign in to comment.