ckeditor5-full-screen
Version:
Adds a full screen support similar to the maximize plugin in ckeditor 4.
39 lines (33 loc) • 820 B
CSS
.ck-editor.ck-plugin-full-screen {
position: fixed;
top: 0;
left: 0;
z-index: 100;
width: 100%;
height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
background-color: #fff;
}
.ck-editor.ck-plugin-full-screen .ck-editor__top,
.ck-editor.ck-plugin-full-screen .ck-editor__main {
width: 100%;
max-width: 1000px;
}
.ck-editor.ck-plugin-full-screen .ck-editor__top {
margin-top: 2em;
}
.ck-editor.ck-plugin-full-screen .ck-editor__main {
/* Fill the rest of the height of the parent */
flex-grow: 1;
overflow-y: hidden;
margin-bottom: 2em;
}
/* Make source view also cover the whole viewport */
.ck-editor.ck-plugin-full-screen .ck-source-editing-area {
height: 100%;
}
.ck-editor.ck-plugin-full-screen .ck-source-editing-area textarea {
overflow-y: scroll;
}