diff options
| -rw-r--r-- | resources/vue/components/courseware/CoursewareTextBlock.vue | 22 |
1 files changed, 19 insertions, 3 deletions
diff --git a/resources/vue/components/courseware/CoursewareTextBlock.vue b/resources/vue/components/courseware/CoursewareTextBlock.vue index e3ad69d..5a6f871 100644 --- a/resources/vue/components/courseware/CoursewareTextBlock.vue +++ b/resources/vue/components/courseware/CoursewareTextBlock.vue @@ -14,7 +14,7 @@ <section class="formatted-content" v-html="currentText" ref="content"></section> </template> <template v-if="canEdit" #edit> - <ckeditor :editor="editor" v-model="currentText" :config="editorConfig"></ckeditor> + <ckeditor :editor="editor" v-model="currentText" :config="editorConfig" @ready="onReady"></ckeditor> </template> <template #info><translate>Informationen zum Text-Block</translate></template> </courseware-default-block> @@ -51,6 +51,18 @@ export default { text() { return this.block?.attributes?.payload?.text; }, + ckeToolbarTop() { + const topBar = document.getElementById('top-bar'); + const responsiveContentbar = document.getElementById('responsive-contentbar'); + let top = topBar.clientHeight + topBar.clientTop; + if (responsiveContentbar) { + top += responsiveContentbar?.clientHeight + responsiveContentbar?.clientTop; + } else { + top += 85; + } + + return top; + }, }, mounted() { this.initCurrent(); @@ -63,6 +75,10 @@ export default { this.currentText = this.text; this.loadMathjax(); }, + onReady( editor ) { + editor.ui.viewportOffset = { top: this.ckeToolbarTop }; + editor.ui.update(); + }, async storeText() { let attributes = this.block.attributes; attributes.payload.text = this.currentText; @@ -91,7 +107,7 @@ export default { .catch(() => { console.log('Warning: Could not load MathJax.'); }); - } - }, + }, + } }; </script> |