move font selector

src/page/HomePage.vue

@@ -17,6 +17,12 @@
           @click="this.tool = 'author'"
         >Author</button>
 
+        <button
+          class="p-3 mr-2 rounded"
+          :class="{'bg-slate-300': this.tool == 'font'}"
+          @click="this.tool = 'font'"
+        >Font</button>
+
         <button
           class="p-3 mr-2 rounded"
           :class="{'bg-slate-300': this.tool == 'background'}"
@@ -190,6 +196,20 @@
         </div>
       </div>
 
+      <div
+        :class="{hidden: this.tool !== 'font'}"
+        class="drop-shadow-md rounded-md md:border border-zinc-300 tool"
+      >
+        <div class="p-5">
+          <SelectForm
+            id="font"
+            v-model="font"
+            :items="fonts"
+            label="Font"
+          />
+        </div>
+      </div>
+
       <div
         :class="{hidden: this.tool !== 'background'}"
         class="drop-shadow-md rounded-md md:border border-zinc-300 tool"