linting and formating. renamed canvas component

src/components/MenuCellProperties.vue

@@ -8,7 +8,7 @@
           type="color"
           @value="cellProperties.liveColor"
           @input="updateCellProperties"
-        >
+        />
       </div>
       <div class="form-field">
         <label for="dead">Dead cell color</label>
@@ -17,7 +17,7 @@
           type="color"
           :value="cellProperties.deadColor"
           @input="updateCellProperties"
-        >
+        />
       </div>
       <div class="form-field">
         <label>Cell size</label>
@@ -27,36 +27,36 @@
           min="1"
           :value="cellProperties.size"
           @input="updateCellProperties"
-        >
+        />
       </div>
     </form>
   </MenuRow>
 </template>
 
 <script>
-import MenuRow from './MenuRow.vue'
+import MenuRow from "./MenuRow.vue";
 export default {
-  name: 'MainMenu',
+  name: "MainMenu",
   components: {
-    MenuRow
+    MenuRow,
   },
   data() {
     return {
-      cellProperties: this.$store.state.cellProperties
-    }
+      cellProperties: this.$store.state.cellProperties,
+    };
   },
   methods: {
     getCellProperties(event) {
-      const elem = event.target
-      const prop = this.$store.state.cellProperties
-      return prop[elem.name]
+      const elem = event.target;
+      const prop = this.$store.state.cellProperties;
+      return prop[elem.name];
     },
     updateCellProperties(event) {
-      const elem = event.target
-      const prop = {'name' : elem.name, 'value' : elem.value}
+      const elem = event.target;
+      const prop = { name: elem.name, value: elem.value };
       //console.log(prop)
-      this.$store.commit('setCellProperties', prop)
-    }
+      this.$store.commit("setCellProperties", prop);
+    },
   },
-}
+};
 </script>