fix: editor-code UI fixes
This commit is contained in:
parent
ce7063ea91
commit
8830835340
@ -1,7 +1,7 @@
|
||||
<template lang='pug'>
|
||||
.editor-code
|
||||
v-toolbar(color='blue', flat, dense, dark)
|
||||
v-icon(color='blue lighten-5') border_color
|
||||
v-icon(color='blue lighten-5') edit
|
||||
v-toolbar-title.white--text Sample Page
|
||||
.editor-code-toolbar
|
||||
.editor-code-toolbar-group
|
||||
@ -126,15 +126,7 @@ export default {
|
||||
highlightSelectionMatches: {
|
||||
annotateScrollbar: true
|
||||
},
|
||||
viewportMargin: 50,
|
||||
extraKeys: {
|
||||
'F11'(cm) {
|
||||
cm.setOption('fullScreen', !cm.getOption('fullScreen'))
|
||||
},
|
||||
'Esc'(cm) {
|
||||
if (cm.getOption('fullScreen')) cm.setOption('fullScreen', false)
|
||||
}
|
||||
}
|
||||
viewportMargin: 50
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -151,14 +143,19 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
onCmReady(cm) {
|
||||
cm.setSize(null, 'calc(100vh - 50px)')
|
||||
},
|
||||
onCmFocus(cm) {
|
||||
console.log('the editor is focus!', cm)
|
||||
},
|
||||
onCmCodeChange(newCode) {
|
||||
console.log('this is new code', newCode)
|
||||
this.code = newCode
|
||||
let self = this
|
||||
cm.setSize(null, 'calc(100vh - 100px)')
|
||||
cm.setOption('extraKeys', {
|
||||
'F11'(cm) {
|
||||
cm.setOption('fullScreen', !cm.getOption('fullScreen'))
|
||||
},
|
||||
'Esc'(cm) {
|
||||
if (cm.getOption('fullScreen')) cm.setOption('fullScreen', false)
|
||||
},
|
||||
'Ctrl-S'(cm) {
|
||||
self.$parent.save()
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -174,7 +171,7 @@ export default {
|
||||
&-editor {
|
||||
flex: 1 1 50%;
|
||||
display: block;
|
||||
min-height: calc(100vh - 50px);
|
||||
min-height: calc(100vh - 100px);
|
||||
position: relative;
|
||||
|
||||
&-title {
|
||||
|
@ -15,14 +15,14 @@
|
||||
v-flex(xs6)
|
||||
v-menu(ref='menuPublishStart', lazy='', :close-on-content-click='false', v-model='isPublishStartShown', transition='scale-transition', offset-y='', full-width='', :nudge-right='40', min-width='290px', :return-value.sync='publishStartDate')
|
||||
v-text-field(slot='activator', label='Publish starting on...', v-model='publishStartDate', prepend-icon='event', readonly)
|
||||
v-date-picker(v-model='date', :min='(new Date()).toISOString().substring(0, 10)', reactive)
|
||||
v-date-picker(v-model='publishStartDate', :min='(new Date()).toISOString().substring(0, 10)', reactive)
|
||||
v-spacer
|
||||
v-btn(flat='', color='primary', @click='isPublishStartShown = false') Cancel
|
||||
v-btn(flat='', color='primary', @click='$refs.menuPublishStart.save(date)') OK
|
||||
v-flex(xs6)
|
||||
v-menu(ref='menuPublishEnd', lazy='', :close-on-content-click='false', v-model='isPublishEndShown', transition='scale-transition', offset-y='', full-width='', :nudge-right='40', min-width='290px', :return-value.sync='publishEndDate')
|
||||
v-text-field(slot='activator', label='Publish ending on...', v-model='publishEndDate', prepend-icon='event', readonly)
|
||||
v-date-picker(v-model='date', :min='(new Date()).toISOString().substring(0, 10)', reactive)
|
||||
v-date-picker(v-model='publishEndDate', :min='(new Date()).toISOString().substring(0, 10)', reactive)
|
||||
v-spacer
|
||||
v-btn(flat='', color='primary', @click='isPublishEndShown = false') Cancel
|
||||
v-btn(flat='', color='primary', @click='$refs.menuPublishEnd.save(date)') OK
|
||||
|
Loading…
Reference in New Issue
Block a user