editor.js/src/styles/toolbar.css
George Berezhnoy cdf6d973c1
Update toolbar move as not to overlap editor`s content (#455)
* Update toolbar move as not to overlap editor`s content

* Bump version

* Add top offset to toolbox actions

* Calculate offset once
2018-09-20 16:46:40 +03:00

64 lines
996 B
CSS

.ce-toolbar {
position: absolute;
left: 0;
right: 0;
top: 0;
/*opacity: 0;*/
/*visibility: hidden;*/
transition: opacity 100ms ease;
will-change: opacity, transform;
display: none;
&--opened {
display: block;
/*opacity: 1;*/
/*visibility: visible;*/
}
&__content {
max-width: var(--content-width);
margin: 0 auto;
position: relative;
}
&__plus {
@apply --toolbox-button;
position: absolute;
left: calc(calc(var(--toolbox-buttons-size) + 10px) * -1);
&--hidden {
display: none;
}
}
&__plus,
.ce-toolbox {
top: 50%;
transform: translateY(-50%);
}
/**
* Block actions Zone
* -------------------------
*/
&__actions {
position: absolute;
right: 0;
top: 10px;
padding-right: 16px;
&-buttons {
text-align: right;
}
}
&__settings-btn {
display: inline-block;
width: 24px;
height: 24px;
color: var(--grayText);
cursor: pointer;
}
}