linting

src/components/BaseComponents/PaginationTemplate.vue

 <template>
   <div v-if="totalPages() > 0">
-    <span v-if="showPreviousLink()"
-          class="cursor-pointer inline-flex items-center p-2 text-sm font-medium text-gray-500 bg-white rounded-lg border border-gray-300 hover:bg-gray-100 hover:text-gray-700"
-          @click="updatePage(currentPage - 1)">
+    <span
+      v-if="showPreviousLink()"
+      class="cursor-pointer inline-flex items-center p-2 text-sm font-medium text-gray-500 bg-white rounded-lg border border-gray-300 hover:bg-gray-100 hover:text-gray-700"
+      @click="updatePage(currentPage - 1)"
+    >
       Forrige
     </span>
     <label class="mx-2">{{ currentPage + 1 }} av {{ totalPages() }}</label>
     <span
-        v-if="showNextLink()"
-        class="cursor-pointer inline-flex items-center p-2 text-sm font-medium text-gray-500 bg-white rounded-lg border border-gray-300 hover:bg-gray-100 hover:text-gray-700"
-        @click="updatePage(currentPage + 1)">
+      v-if="showNextLink()"
+      class="cursor-pointer inline-flex items-center p-2 text-sm font-medium text-gray-500 bg-white rounded-lg border border-gray-300 hover:bg-gray-100 hover:text-gray-700"
+      @click="updatePage(currentPage + 1)"
+    >
       Neste
     </span>
   </div>
@@ -17,11 +20,11 @@
 
 <script>
 export default {
-  name: 'paginationTemplate',
-  props: ['items', 'currentPage', 'pageSize'],
+  name: "paginationTemplate",
+  props: ["items", "currentPage", "pageSize"],
   methods: {
     updatePage(pageNumber) {
-      this.$emit('page:update', pageNumber);
+      this.$emit("page:update", pageNumber);
     },
     totalPages() {
       return Math.ceil(this.items.length / this.pageSize);
@@ -30,8 +33,8 @@ export default {
       return this.currentPage == 0 ? false : true;
     },
     showNextLink() {
-      return this.currentPage == (this.totalPages() - 1) ? false : true;
-    }
-  }
-}
+      return this.currentPage == this.totalPages() - 1 ? false : true;
+    },
+  },
+};
 </script>

src/components/CommunityComponents/CommunityHome.vue

@@ -26,35 +26,44 @@
       />
     </div>
 
-
     <div class="absolute inset-x-0 px-5 py-3">
-
       <!-- ItemCards -->
       <div class="flex items-center justify-center w-screen">
         <!-- Shows items based on pagination -->
         <div
-            class="grid grid-flow-row-dense grid-cols-2 md:grid-cols-4 lg:grid-cols-5 w-full"
-            v-if="showItems">
-          <ItemCard  v-for="item in visibleItems" :key="item" :item="item" @click="goToItemInfoPage(item.listingID)" />
+          class="grid grid-flow-row-dense grid-cols-2 md:grid-cols-4 lg:grid-cols-5 w-full"
+          v-if="showItems"
+        >
+          <ItemCard
+            v-for="item in visibleItems"
+            :key="item"
+            :item="item"
+            @click="goToItemInfoPage(item.listingID)"
+          />
         </div>
 
         <!-- Shows items based on search field input -->
         <div
-            class="grid grid-flow-row-dense grid-cols-2 md:grid-cols-4 lg:grid-cols-5 w-full place-items-center"
-            v-if="showSearchedItems">
-          <ItemCard v-for="item in searchedItems" :key="item" :item="item" @click="goToItemInfoPage(item.listingID)" />
+          class="grid grid-flow-row-dense grid-cols-2 md:grid-cols-4 lg:grid-cols-5 w-full place-items-center"
+          v-if="showSearchedItems"
+        >
+          <ItemCard
+            v-for="item in searchedItems"
+            :key="item"
+            :item="item"
+            @click="goToItemInfoPage(item.listingID)"
+          />
         </div>
       </div>
 
-
       <!-- pagination -->
       <div class="flex justify-center" v-if="showItems">
         <PaginationTemplate
-            v-bind:items="items"
-            v-on:page:update="updatePage"
-            v-bind:currentPage="currentPage"
-            v-bind:pageSize="pageSize"
-            class="mt-10"
+          v-bind:items="items"
+          v-on:page:update="updatePage"
+          v-bind:currentPage="currentPage"
+          v-bind:pageSize="pageSize"
+          class="mt-10"
         />
       </div>
     </div>
@@ -144,13 +153,12 @@ export default {
       let res = await getItemPictures(itemid);
       return res;
     },
-    searchWritten: function (){
+    searchWritten: function () {
       //This method triggers when search input field is changed
-      if(this.search.length > 0){
+      if (this.search.length > 0) {
         this.showItems = false;
         this.showSearchedItems = true;
-      }
-      else{
+      } else {
         this.showItems = true;
         this.showSearchedItems = false;
       }
@@ -162,11 +170,14 @@ export default {
       this.updateVisibleTodos();
     },
     updateVisibleTodos() {
-      this.visibleItems = this.items.slice(this.currentPage * this.pageSize, (this.currentPage * this.pageSize) + this.pageSize);
+      this.visibleItems = this.items.slice(
+        this.currentPage * this.pageSize,
+        this.currentPage * this.pageSize + this.pageSize
+      );
 
       // if we have 0 visible items, go back a page
       if (this.visibleItems.length === 0 && this.currentPage > 0) {
-        this.updatePage(this.currentPage -1);
+        this.updatePage(this.currentPage - 1);
       }
     },
   },