@import "/customize/src/less/variables.less"; @import "/customize/src/less/mixins.less"; @import "/common/markdown.less"; @import "/common/file-dialog.less"; html, body{ height: 100%; width: 100%; padding: 0px; margin: 0px; overflow: hidden; box-sizing: border-box; position: relative; } body { display: flex; flex-flow: column; max-height: 100%; min-height: auto; } @slideTime: 500ms; .CodeMirror { display: inline-block; height: 100%; width: 50%; &.transition { transition: width @slideTime, min-width @slideTime, max-width @slideTime; } min-width: 20%; max-width: 80%; resize: horizontal; } .CodeMirror.fullPage { //min-width: 100%; max-width: 100%; resize: none; flex: 1; } .CodeMirror-focused .cm-matchhighlight { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAFklEQVQI12NgYGBgkKzc8x9CMDAwAAAmhwSbidEoSQAAAABJRU5ErkJggg==); background-position: bottom; background-repeat: repeat-x; } #editorContainer { flex: 1; display: flex; flex-flow: row; height: 100%; overflow: hidden; } #previewContainer { flex: 1; padding: 5px 20px; overflow: auto; display: inline-block; height: 100%; border-left: 1px solid black; box-sizing: border-box; font-family: Calibri,Ubuntu,sans-serif; word-wrap: break-word; position: relative; media-tag { * { max-width:100%; } iframe[type="application/pdf"] { max-height:50vh; } } } #preview { max-width: 40vw; margin: auto; .markdown_preformatted-code; .markdown_gfm-table(black); } .cp-splitter { position: absolute; height: 100%; width: 8px; top: 0; left: 0; z-index: 9999; cursor: col-resize; } @media (max-width: @media-medium-screen) { .CodeMirror { flex: 1; max-width: 100%; resize: none; } #previewContainer { display: none !important; } }