X-Git-Url: http://source.bookstackapp.com/bookstack/blobdiff_plain/2f119d3033c9543a22109c34d2b77ef99e5486af..refs/pull/5676/head:/resources/sass/_editor.scss diff --git a/resources/sass/_editor.scss b/resources/sass/_editor.scss index 3eef4c2c6..de43540a3 100644 --- a/resources/sass/_editor.scss +++ b/resources/sass/_editor.scss @@ -52,6 +52,25 @@ body.editor-is-fullscreen { flex: 1; } +// Variation specific styles +.comment-editor-container, +.basic-editor-container { + border-left: 1px solid #DDD; + border-right: 1px solid #DDD; + border-bottom: 1px solid #DDD; + border-radius: 3px; + @include mixins.lightDark(border-color, #DDD, #000); + + .editor-toolbar-main { + border-radius: 3px 3px 0 0; + justify-content: end; + } +} + +.basic-editor-container .editor-content-area { + padding-bottom: 0; +} + // Buttons .editor-button { font-size: 12px; @@ -350,6 +369,13 @@ body.editor-is-fullscreen { text-align: center; padding: 0.2em; } +.editor-external-content { + min-width: 500px; + min-height: 500px; + h4:first-child { + margin-top: 0; + } +} // In-editor elements .editor-image-wrap { @@ -363,8 +389,10 @@ body.editor-is-fullscreen { display: inline-block; outline: 2px dashed var(--editor-color-primary); direction: ltr; + pointer-events: none; } .editor-node-resizer-handle { + pointer-events: auto; position: absolute; display: block; width: 10px; @@ -413,7 +441,7 @@ body.editor-is-fullscreen { .editor-table-marker { position: fixed; background-color: var(--editor-color-primary); - z-index: 99; + z-index: 3; user-select: none; opacity: 0; &:hover, &.active { @@ -445,7 +473,7 @@ body.editor-is-fullscreen { .editor-media-wrap { display: inline-block; cursor: not-allowed; - iframe { + iframe, video { pointer-events: none; } &.align-left { @@ -642,6 +670,16 @@ textarea.editor-form-field-input { width: $inputWidth - 40px; } } +.editor-color-field-container { + position: relative; + input { + padding-left: 36px; + } + .editor-dropdown-menu-container { + position: absolute; + bottom: 0; + } +} // Editor theme styles .editor-theme-bold {