diff options
-rw-r--r-- | css/prosemirror.scss | 60 | ||||
-rw-r--r-- | src/components/EditorWrapper.vue | 71 | ||||
-rw-r--r-- | src/components/MenuBar.vue | 10 | ||||
-rw-r--r-- | src/files.js | 8 | ||||
-rw-r--r-- | src/views/RichWorkspace.vue | 1 |
5 files changed, 83 insertions, 67 deletions
diff --git a/css/prosemirror.scss b/css/prosemirror.scss index 3c17e4ee4..8b2dd9def 100644 --- a/css/prosemirror.scss +++ b/css/prosemirror.scss @@ -145,66 +145,6 @@ div.ProseMirror { .ProseMirror-focused .ProseMirror-gapcursor { display: block; } -&:not(.richEditor) .ProseMirror { - pre { - background-color: var(--color-main-background); - - &::before { - content: attr(data-language); - text-transform: uppercase; - display: block; - text-align: right; - font-weight: bold; - font-size: 0.6rem; - } - code { - .hljs-comment, - .hljs-quote { - color: #999999; - } - .hljs-variable, - .hljs-template-variable, - .hljs-attribute, - .hljs-tag, - .hljs-name, - .hljs-regexp, - .hljs-link, - .hljs-name, - .hljs-selector-id, - .hljs-selector-class { - color: #f2777a; - } - .hljs-number, - .hljs-meta, - .hljs-built_in, - .hljs-builtin-name, - .hljs-literal, - .hljs-type, - .hljs-params { - color: #f99157; - } - .hljs-string, - .hljs-symbol, - .hljs-bullet { - color: #99cc99; - } - .hljs-title, - .hljs-section { - color: #ffcc66; - } - .hljs-keyword, - .hljs-selector-tag { - color: #6699cc; - } - .hljs-emphasis { - font-style: italic; - } - .hljs-strong { - font-weight: 700; - } - } - } -} .editor__content p.is-empty:first-child::before { content: attr(data-empty-text); diff --git a/src/components/EditorWrapper.vue b/src/components/EditorWrapper.vue index e3395fb14..f1ab885ff 100644 --- a/src/components/EditorWrapper.vue +++ b/src/components/EditorWrapper.vue @@ -35,7 +35,8 @@ <MenuBar v-if="!syncError && !readOnly" ref="menubar" :editor="tiptap" - :is-rich-editor="isRichEditor"> + :is-rich-editor="isRichEditor" + :autohide="autohide"> <div v-if="currentSession && active" id="editor-session-list"> <div v-tooltip="lastSavedStatusTooltip" class="save-status" :class="lastSavedStatusClass"> {{ lastSavedStatus }} @@ -119,8 +120,12 @@ export default { }, mime: { type: String, - default: null - } + default: null, + }, + autohide: { + type: Boolean, + default: false, + }, }, data() { return { @@ -569,5 +574,65 @@ export default { #editor-wrapper { @import './../../css/prosemirror'; + + &:not(.richEditor) .ProseMirror { + pre { + background-color: var(--color-main-background); + + &::before { + content: attr(data-language); + text-transform: uppercase; + display: block; + text-align: right; + font-weight: bold; + font-size: 0.6rem; + } + code { + .hljs-comment, + .hljs-quote { + color: #999999; + } + .hljs-variable, + .hljs-template-variable, + .hljs-attribute, + .hljs-tag, + .hljs-name, + .hljs-regexp, + .hljs-link, + .hljs-selector-id, + .hljs-selector-class { + color: #f2777a; + } + .hljs-number, + .hljs-meta, + .hljs-built_in, + .hljs-builtin-name, + .hljs-literal, + .hljs-type, + .hljs-params { + color: #f99157; + } + .hljs-string, + .hljs-symbol, + .hljs-bullet { + color: #99cc99; + } + .hljs-title, + .hljs-section { + color: #ffcc66; + } + .hljs-keyword, + .hljs-selector-tag { + color: #6699cc; + } + .hljs-emphasis { + font-style: italic; + } + .hljs-strong { + font-weight: 700; + } + } + } + } } </style> diff --git a/src/components/MenuBar.vue b/src/components/MenuBar.vue index d8df94393..b848988e0 100644 --- a/src/components/MenuBar.vue +++ b/src/components/MenuBar.vue @@ -22,7 +22,7 @@ <template> <EditorMenuBar v-slot="{ commands, isActive, focused }" :editor="editor"> - <div class="menubar autohide" :class="{ 'is-focused': focused }"> + <div class="menubar" :class="{ 'is-focused': focused, 'autohide': autohide }"> <div v-if="isRichEditor" ref="menubar" class="menubar-icons"> <template v-for="(icon, $index) in allIcons"> <button v-if="icon.class" @@ -102,8 +102,12 @@ export default { }, isRichEditor: { type: Boolean, - default: true - } + default: true, + }, + autohide: { + type: Boolean, + default: false, + }, }, data: () => { return { diff --git a/src/files.js b/src/files.js index b2bab8c1b..8f618d762 100644 --- a/src/files.js +++ b/src/files.js @@ -34,7 +34,13 @@ document.addEventListener('DOMContentLoaded', () => { if (typeof OCA.Viewer === 'undefined') { console.error('Viewer app is not installed') registerFileActionFallback() - return + } else { + OCA.Viewer.registerHandler({ + id: 'text', + mimes: [...openMimetypesMarkdown, ...openMimetypesPlainText], + component: FilesEditor, + group: null, + }) } OCA.Viewer.registerHandler({ id: 'text', diff --git a/src/views/RichWorkspace.vue b/src/views/RichWorkspace.vue index bc3936daa..f2e5468a6 100644 --- a/src/views/RichWorkspace.vue +++ b/src/views/RichWorkspace.vue @@ -35,6 +35,7 @@ :relative-path="file.path" :share-token="shareToken" :active="true" + :autohide="true" :mime="file.mimetype" :autofocus="autofocus" @ready="ready=true" /> |