fix: editor-code UI fixes
This commit is contained in:
		| @@ -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 | ||||
|   | ||||
		Reference in New Issue
	
	Block a user