fix: move buttons of edit page to top

close #271

src/common/ui/code.vue

@@ -1,8 +1,5 @@
 <template>
   <div class="flex flex-col">
-    <vl-code class="editor-code flex-auto"
-      :options="cmOptions" v-model="content" @ready="onReady"
-    />
     <div class="frame-block" v-show="search.show">
       <button class="pull-right" @click="clearSearch">&times;</button>
       <form class="inline-block mr-1" @submit.prevent="goToLine()">
@@ -32,6 +29,9 @@
         </tooltip>
       </form>
     </div>
+    <vl-code class="editor-code flex-auto"
+      :options="cmOptions" v-model="content" @ready="onReady"
+    />
   </div>
 </template>
 
@@ -233,7 +233,7 @@ export default {
         return stop;
       });
     },
-    doFind(reversed) {
+    doSearch(reversed) {
       const { state } = this.search;
       const { cm } = this;
       if (state.query) {
@@ -241,10 +241,13 @@ export default {
       }
       this.search.show = true;
     },
-    find() {
+    searchInPlace() {
       const { state } = this.search;
       state.posTo = state.posFrom;
-      this.doFind();
+      this.doSearch();
+    },
+    find() {
+      this.searchInPlace();
       this.$nextTick(() => {
         const { search } = this.$refs;
         search.select();
@@ -252,7 +255,7 @@ export default {
       });
     },
     findNext(reversed) {
-      this.doFind(reversed);
+      this.doSearch(reversed);
       this.$nextTick(() => {
         this.$refs.search.focus();
       });
@@ -284,7 +287,7 @@ export default {
     },
   },
   mounted() {
-    this.debouncedFind = debounce(this.doFind, 100);
+    this.debouncedFind = debounce(this.searchInPlace, 100);
     if (this.global) window.addEventListener('keydown', this.onKeyDown, false);
   },
   beforeDestroy() {

src/options/views/edit/index.vue

@@ -10,6 +10,9 @@
       </div>
       <div class="buttons">
         <a class="mr-1" href="https://violentmonkey.github.io/2017/03/14/How-to-edit-scripts-with-your-favorite-editor/" target="_blank">How to edit with your favorite editor?</a>
+        <button v-text="i18n('buttonSave')" @click="save" :disabled="!canSave"></button>
+        <button v-text="i18n('buttonSaveClose')" @click="saveClose" :disabled="!canSave"></button>
+        <button v-text="i18n('buttonClose')" @click="close"></button>
       </div>
     </div>
     <div class="frame-block flex-auto pos-rel">
@@ -22,13 +25,6 @@
         :value="script" :settings="settings"
       />
     </div>
-    <div class="frame-block">
-      <div class="pull-right">
-        <button v-text="i18n('buttonSave')" @click="save" :disabled="!canSave"></button>
-        <button v-text="i18n('buttonSaveClose')" @click="saveClose" :disabled="!canSave"></button>
-        <button v-text="i18n('buttonClose')" @click="close"></button>
-      </div>
-    </div>
   </div>
 </template>