linting and formating. renamed canvas component

src/components/MenuRow.vue

@@ -1,82 +1,75 @@
 <template>
   <div class="menu-row">
-    <h2
-      :id="rowTitle"
-      @click="updateActiveMenu"
-    >
+    <h2 :id="rowTitle" @click="updateActiveMenu">
       {{ rowTitle }}
     </h2>
-    <div
-      v-if="activeMenu === rowTitle"
-      class="menu-row-content"
-    >
+    <div v-if="activeMenu === rowTitle" class="menu-row-content">
       <slot />
     </div>
   </div>
 </template>
 
 <script>
-import {mapGetters} from 'vuex'
+import { mapGetters } from "vuex";
 
 export default {
-  name: 'MenuRow',
+  name: "MenuRow",
   props: {
     rowTitle: {
       type: String,
-      default : ''
-    }
+      default: "",
+    },
   },
   computed: {
     ...mapGetters({
-      activeMenu: 'getActiveMenu',
-    })
+      activeMenu: "getActiveMenu",
+    }),
   },
   methods: {
     updateActiveMenu(event) {
-      const elem = event.target
-      const value = elem.id
-      if (value == this.activeMenu)
-        this.$store.commit('setActiveMenu', "")
-      else
-        this.$store.commit('setActiveMenu', value)
+      const elem = event.target;
+      const value = elem.id;
+      if (value == this.activeMenu) this.$store.commit("setActiveMenu", "");
+      else this.$store.commit("setActiveMenu", value);
     },
-  }
-}
+  },
+};
 </script>
 
 <style>
 .menu-row h2 {
-    font-size: medium;
-    padding: 10px;
-    cursor: pointer;
-    border: 2px solid darkgrey;
-    margin: 0 0 10px 0;
+  font-size: medium;
+  padding: 10px;
+  cursor: pointer;
+  border: 2px solid darkgrey;
+  margin: 0 0 10px 0;
 }
 
 select {
-    margin-top: 10px;
-    padding: 5px;
+  margin-top: 10px;
+  padding: 5px;
 }
-  
+
 input[type="button"] {
-    min-width: 60px;
-    padding: 5px;
-    font-weight: bold;
-    margin-right: 10px;
+  min-width: 60px;
+  padding: 5px;
+  font-weight: bold;
+  margin-right: 10px;
 }
 
 .form-field {
-    display: flex;
-    margin: 10px;
-    justify-content: space-between;
+  display: flex;
+  margin: 10px;
+  justify-content: space-between;
 }
 
 .menu-row {
-    flex: 1;
+  flex: 1;
 }
 
-label, .form-field label {
-    margin-right: 10px;
-    font-weight: bold;
+label,
+.form-field label {
+  margin-right: 10px;
+  font-weight: bold;
 }
 </style>