diff options
| -rw-r--r-- | css/prosemirror.scss | 1 | ||||
| -rw-r--r-- | src/EditorFactory.js | 2 | ||||
| -rw-r--r-- | src/files.js | 35 | ||||
| -rw-r--r-- | src/views/RichWorkspace.vue | 20 |
4 files changed, 25 insertions, 33 deletions
diff --git a/css/prosemirror.scss b/css/prosemirror.scss index b9e58a7af..3c17e4ee4 100644 --- a/css/prosemirror.scss +++ b/css/prosemirror.scss @@ -212,5 +212,4 @@ div.ProseMirror { color: var(--color-text-maxcontrast); pointer-events: none; height: 0; - font-style: italic; } diff --git a/src/EditorFactory.js b/src/EditorFactory.js index 4f778fbf0..4d43f3015 100644 --- a/src/EditorFactory.js +++ b/src/EditorFactory.js @@ -79,7 +79,7 @@ const createEditor = ({ content, onInit, onUpdate, extensions, enableRichEditing new Image(), new Placeholder({ emptyNodeClass: 'is-empty', - emptyNodeText: 'Write something …', + emptyNodeText: 'Add notes, lists or links …', showOnlyWhenEditable: true }) ] diff --git a/src/files.js b/src/files.js index 82b688743..3f4bbbb04 100644 --- a/src/files.js +++ b/src/files.js @@ -22,10 +22,11 @@ import FilesEditor from './components/FilesEditor' import PreviewPlugin from './files/PreviewPlugin' +import RichWorkspace from './views/RichWorkspace' + import { registerFileActionFallback, registerFileCreate } from './helpers/files' import { openMimetypesMarkdown, openMimetypesPlainText } from './helpers/mime' - __webpack_nonce__ = btoa(OC.requestToken) // eslint-disable-line __webpack_public_path__ = OC.linkTo('text', 'js/') // eslint-disable-line @@ -67,26 +68,22 @@ const FilesPlugin = { render: (fileList) => { - const RichWorkspace = import(/* webpackChunkName: "richworkspace" */'./views/RichWorkspace') - const Vue = import('vue') - FilesPlugin.el.id = 'files-workspace-wrapper' - Vue.prototype.t = window.t - Vue.prototype.n = window.n - Vue.prototype.OCA = window.OCA - const View = Vue.extend(RichWorkspace) - const vm = new View({ - propsData: { - path: fileList.getCurrentDirectory() - } - }).$mount(FilesPlugin.el) + import('vue').then((module) => { + const Vue = module.default + FilesPlugin.el.id = 'files-workspace-wrapper' + Vue.prototype.t = window.t + Vue.prototype.n = window.n + Vue.prototype.OCA = window.OCA + const View = Vue.extend(RichWorkspace) + const vm = new View({ + propsData: { + path: fileList.getCurrentDirectory() + } + }).$mount(FilesPlugin.el) - fileList.$el.on('changeDirectory', data => { - vm.path = data.dir.toString() - vm.changeDirectory({ - dir: data.dir, - fileList + fileList.$el.on('changeDirectory', data => { + vm.path = data.dir.toString() }) - // TODO Switch to path/README.md }) } } diff --git a/src/views/RichWorkspace.vue b/src/views/RichWorkspace.vue index c164ad661..31527a1bb 100644 --- a/src/views/RichWorkspace.vue +++ b/src/views/RichWorkspace.vue @@ -23,10 +23,9 @@ <template> <div id="rich-workspace" :class="{'icon-loading': !loaded || !ready }"> <div v-if="!file || (autofocus && !ready)" class="empty-workspace" @click="createNew"> - <i>{{ t('text', 'Click to enter notes, lists or links …') }}</i> - </div> - <div v-if="(file && !ready)" class="empty-workspace"> - <i>{{ t('text', 'Write something …') }}</i> + <p class="placeholder"> + {{ t('text', 'Add notes, lists or links …') }} + </p> </div> <EditorWrapper v-if="file" @@ -44,7 +43,7 @@ export default { name: 'RichWorkspace', components: { - EditorWrapper: () => import(/* webpackChunkName: "editor" */'./EditorWrapper') + EditorWrapper: () => import(/* webpackChunkName: "editor" */'./../components/EditorWrapper') }, props: { path: { @@ -69,9 +68,6 @@ export default { this.getFileInfo() }, methods: { - changeDirectory({ dir, fileList }) { - console.log('vue cchangeDirectory', dir, fileList) - }, getFileInfo() { this.loaded = false this.autofocus = false @@ -87,7 +83,7 @@ export default { }) }, createNew() { - window.FileList.createFile('README.md', { scrollTo: false }).then((status, data) => { + window.FileList.createFile('README.md', { scrollTo: false, animate: false }).then((status, data) => { this.getFileInfo() this.autofocus = true }) @@ -98,15 +94,16 @@ export default { <style scoped> #rich-workspace { - padding: 0 20px; + padding: 0 60px; min-height: 90px; } + .empty-workspace { margin-top: 54px; color: var(--color-text-maxcontrast); height: 0; - font-style: italic; } + #rich-workspace::v-deep div[contenteditable=false] { width: 100%; padding: 0px; @@ -135,6 +132,5 @@ export default { #rich-workspace::v-deep .editor__content { margin: 0; - max-width: 100%; } </style> |