Added ESlint to client and applied rules

client/src/pages/spells/single-spell-page.vue

@@ -1,7 +1,15 @@
 <template>
-  <div class="container-fluid p-4" id="spell-container">
-    <h1 class="display-3 font-display mb-3">{{ spell.name }}</h1>
-    <p class="prewrap">{{ spell.description }}</p>  </div>
+  <div
+    id="spell-container"
+    class="container-fluid p-4"
+  >
+    <h1 class="display-3 font-display mb-3">
+      {{ spell.name }}
+    </h1>
+    <p class="prewrap">
+      {{ spell.description }}
+    </p>
+  </div>
 </template>
 
 <script>
@@ -10,11 +18,11 @@ import { RepositoryFactory } from "@/api/repositories";
 const Spells = RepositoryFactory.get('spells');
 
 export default {
-  name: 'single-spell-page',
+  name: 'SingleSpellPage',
   metaInfo() {
     return {
       titleTemplate: this.spell.name ? `%s - ${this.spell.name}` : '%s',
-    }
+    };
   },
   data() {
     return {
@@ -23,7 +31,7 @@ export default {
       errors: {
         loading: "",
       }
-    }
+    };
   },
   created() {
     Spells.getOne(this.id)
@@ -34,7 +42,7 @@ export default {
         console.log(err);
       });
   },
-}
+};
 </script>
 
 <style>

client/src/pages/spells/spells-page.vue

@@ -1,7 +1,12 @@
 <template>
-  <div class="container-fluid p-4" id="spell-container">
-    <h1 class="display-3 font-display mb-3">Sortilèges</h1>
-    <spell-list/>
+  <div
+    id="spell-container"
+    class="container-fluid p-4"
+  >
+    <h1 class="display-3 font-display mb-3">
+      Sortilèges
+    </h1>
+    <spell-list />
   </div>
 </template>
 
@@ -9,14 +14,14 @@
 import SpellsList from "@/components/spells/spells-list.vue";
 
 export default {
-  name: 'spells-page',
+  name: 'SpellsPage',
   metaInfo: {
     titleTemplate: '%s - Grimoire'
   },
   components: {
     'spell-list': SpellsList,
   }
-}
+};
 </script>
 
 <style lang="scss"></style>