diff options
author | Max <max@nextcloud.com> | 2022-07-08 22:15:48 +0300 |
---|---|---|
committer | Max <max@nextcloud.com> | 2022-07-29 15:15:12 +0300 |
commit | 6cd8aa1f8ed420907eafd58c140e66c44f6db430 (patch) | |
tree | 57e79e8b01c3d8bda8abf3ac425691698daad393 /src/components/Editor | |
parent | 8f7160dbcb438c76c46890f91ad3e73be650695c (diff) |
refactor: add Content component for editor content
This injects the `$editor` to display the content.
One reason less to have the `$editor` in the `EditorWrapper`.
Signed-off-by: Max <max@nextcloud.com>
Diffstat (limited to 'src/components/Editor')
-rw-r--r-- | src/components/Editor/Content.vue | 60 |
1 files changed, 60 insertions, 0 deletions
diff --git a/src/components/Editor/Content.vue b/src/components/Editor/Content.vue new file mode 100644 index 000000000..7ecf9d0a8 --- /dev/null +++ b/src/components/Editor/Content.vue @@ -0,0 +1,60 @@ +<!-- + - @copyright Copyright (c) 2022 Max <max@nextcloud.com> + - + - @author Max <max@nextcloud.com> + - + - @license GNU AGPL version 3 or any later version + - + - This program is free software: you can redistribute it and/or modify + - it under the terms of the GNU Affero General Public License as + - published by the Free Software Foundation, either version 3 of the + - License, or (at your option) any later version. + - + - This program is distributed in the hope that it will be useful, + - but WITHOUT ANY WARRANTY; without even the implied warranty of + - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + - GNU Affero General Public License for more details. + - + - You should have received a copy of the GNU Affero General Public License + - along with this program. If not, see <http://www.gnu.org/licenses/>. + - + --> + +<template> + <div data-text-el="editor-content-wrapper" + class="content-wrapper text-editor__content-wrapper"> + <slot /> + <EditorContent tabindex="0" + role="document" + class="editor__content text-editor__content" + :editor="$editor" /> + </div> +</template> + +<script> +import { EditorContent } from '@tiptap/vue-2' +import { useEditorMixin } from './../EditorWrapper.provider.js' + +export default { + name: 'Content', + components: { + EditorContent, + }, + mixins: [useEditorMixin], +} +</script> + +<style scoped lang="scss"> + .editor__content { + max-width: var(--text-editor-max-width); + margin: auto; + position: relative; + } + + .ie { + .editor__content::v-deep(.ProseMirror) { + padding-top: 50px; + } + } + +</style> |