liz/wikijs-fork
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: markdown editor media button position

Browse Source
This commit is contained in:
Nicolas Giard
2019-01-25 20:00:30 -05:00
committed by Nick
parent 5f18c71ef2
commit ded1cf6261
1 changed files with 19 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
client/components/editor/editor-markdown.vue
View File

@@ -1,6 +1,6 @@
<template lang='pug'> <template lang='pug'>
.editor-code .editor-markdown
v-toolbar.editor-code-toolbar(dense, color='primary', dark) v-toolbar.editor-markdown-toolbar(dense, color='primary', dark)
v-tooltip(top) v-tooltip(top)
v-btn(icon, slot='activator').mx-0 v-btn(icon, slot='activator').mx-0
v-icon format_bold v-icon format_bold
@@ -50,17 +50,17 @@
v-icon remove v-icon remove
span Horizontal Bar span Horizontal Bar
.editor-code-main .editor-markdown-main
.editor-code-editor .editor-markdown-editor
.editor-code-editor-title(v-if='previewShown', @click='previewShown = false') Editor .editor-markdown-editor-title(v-if='previewShown', @click='previewShown = false') Editor
.editor-code-editor-title(v-else='previewShown', @click='previewShown = true'): v-icon(dark) drag_indicator .editor-markdown-editor-title(v-else='previewShown', @click='previewShown = true'): v-icon(dark) drag_indicator
codemirror(ref='cm', v-model='code', :options='cmOptions', @ready='onCmReady', @input='onCmInput') codemirror(ref='cm', v-model='code', :options='cmOptions', @ready='onCmReady', @input='onCmInput')
transition(name='editor-code-preview') transition(name='editor-markdown-preview')
.editor-code-preview(v-if='previewShown') .editor-markdown-preview(v-if='previewShown')
.editor-code-preview-title(@click='previewShown = false') Preview .editor-markdown-preview-title(@click='previewShown = false') Preview
.editor-code-preview-content.contents(ref='editorPreview', v-html='previewHTML') .editor-markdown-preview-content.contents(ref='editorPreview', v-html='previewHTML')
v-speed-dial(v-model='fabInsertMenu', :open-on-hover='true', direction='top', transition='slide-y-reverse-transition', fixed, left, bottom) v-speed-dial.editor-markdown-insert(v-model='fabInsertMenu', :open-on-hover='true', direction='top', transition='slide-y-reverse-transition', fixed, bottom, :right='!previewShown || $vuetify.breakpoint.smAndDown')
v-btn(color='blue', fab, dark, v-model='fabInsertMenu', slot='activator') v-btn(color='blue', fab, dark, v-model='fabInsertMenu', slot='activator')
v-icon add_circle v-icon add_circle
v-icon close v-icon close
@@ -262,7 +262,7 @@ export default {
</script> </script>
<style lang='scss'> <style lang='scss'>
.editor-code { .editor-markdown {
&-main { &-main {
display: flex; display: flex;
width: 100%; width: 100%;
@@ -372,6 +372,13 @@ export default {
} }
} }
&-insert:not(.v-speed-dial--right) {
@include from($tablet) {
left: 50%;
margin-left: -28px;
}
}
// ========================================== // ==========================================
// Fix FAB revealing under codemirror // Fix FAB revealing under codemirror
// ========================================== // ==========================================