fix: editor-code UI fixes

This commit is contained in:
NGPixel 2018-02-20 00:12:50 -05:00
parent ce7063ea91
commit 8830835340
2 changed files with 18 additions and 21 deletions

View File

@ -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)')
let self = this
cm.setSize(null, 'calc(100vh - 100px)')
cm.setOption('extraKeys', {
'F11'(cm) {
cm.setOption('fullScreen', !cm.getOption('fullScreen'))
},
onCmFocus(cm) {
console.log('the editor is focus!', cm)
'Esc'(cm) {
if (cm.getOption('fullScreen')) cm.setOption('fullScreen', false)
},
onCmCodeChange(newCode) {
console.log('this is new code', newCode)
this.code = newCode
'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 {

View File

@ -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