diff --git a/.gitignore b/.gitignore
index 4ec4abfa..b1b1b3f5 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,14 +1,14 @@
-.idea
+.cache
+.env
 .env*
-node_modules
-*.log*
-.nuxt
+.idea
 .nitro
-.cache
+.nuxt
 .output
-.env
-dist
+*.log*
+/temp-package/
 /temp-package/api/
-vue-2
+dist
+node_modules
 temp-package/types
-/temp-package/
+vue-2
diff --git a/components/Pagination.vue b/components/Pagination.vue
index f3239a43..0b7aff47 100644
--- a/components/Pagination.vue
+++ b/components/Pagination.vue
@@ -1,6 +1,6 @@
 <template>
-  <div class="py-6 flex items-center justify-between">
-    <div class="flex-1 flex flex-col md:flex-row items-center sm:justify-between justify-end gap-3">
+  <div class="flex items-center justify-between py-6">
+    <div class="flex flex-col items-center justify-end flex-1 gap-3 md:flex-row sm:justify-between">
       <div class="flex items-center gap-3">
         <div>
           <select :value="pageSize" class="px-2 py-1 bg-base-100" @change="(e) => updatePageSize(parseInt(e.target.value, 10))">
@@ -18,7 +18,7 @@
         <div>
           <p class="text-sm text-base-content/50">
             Showing
-            <span class="font-medium">{{ (currentPage * pageSize) - pageSize + 1}}</span>
+            <span class="font-medium">{{ (currentPage * pageSize) - pageSize + 1 }}</span>
             to
             <span class="font-medium">{{ Math.min(currentPage * pageSize, totalResults) }}</span>
             of
@@ -30,7 +30,7 @@
       <div>
         <nav class="relative z-0 inline-flex -space-x-px" aria-label="Pagination">
           <a
-            class="page-button rounded-l-lg"
+            class="rounded-l-lg page-button"
             @click="goToFirstPage"
           >
             <span class="sr-only">Previous</span>
@@ -48,7 +48,7 @@
           >
             <span class="sr-only">Previous</span>
             <svg
-              class="h-5 w-5"
+              class="w-5 h-5"
               xmlns="http://www.w3.org/2000/svg"
               viewBox="0 0 20 20"
               fill="currentColor"
@@ -148,7 +148,7 @@
           >
             <span class="sr-only">Next</span>
             <svg
-              class="h-5 w-5"
+              class="w-5 h-5"
               xmlns="http://www.w3.org/2000/svg"
               viewBox="0 0 20 20"
               fill="currentColor"
@@ -162,7 +162,7 @@
             </svg>
           </button>
           <button
-            class="page-button rounded-r-lg"
+            class="rounded-r-lg page-button"
             @click="goToLastPage"
           >
             <span class="sr-only">Next</span>
@@ -228,9 +228,6 @@ function goToPage (pageNum: number) {
   if (pageNum > totalPages() || pageNum < 1) {
     return;
   }
-
-  console.log(pageNum);
-
   emit("update:currentPage", pageNum);
 }
 
diff --git a/components/TorrustSelect.vue b/components/TorrustSelect.vue
index 57ad4032..80731b60 100644
--- a/components/TorrustSelect.vue
+++ b/components/TorrustSelect.vue
@@ -1,21 +1,21 @@
 <template>
   <div class="group dropdown" :class="dropdownAlignment">
-    <label tabindex="0" class="select select-bordered group-hover:border-amber-500 items-center duration-200" :class="{ 'h-[3.5rem]': !!label }">
-      <div class="mr-1 flex flex-col flex-nowrap text-left capitalize">
+    <label tabindex="0" class="items-center duration-200 select select-bordered group-hover:border-amber-500" :class="{ 'h-[3.5rem]': !!label }">
+      <div class="flex flex-col mr-1 text-left capitalize flex-nowrap">
         <span v-if="label" class="text-xs text-primary">{{ label }}</span>
-        <div class="text-sm flex flex-row flex-nowrap">
+        <div class="flex flex-row text-sm flex-nowrap">
           <span v-if="props.selected.length === 0">None</span>
           <span v-else-if="props.selected.length > 1">Multiple</span>
           <span v-else>{{ getOptionNameByValue(props.selected[0]) }}</span>
         </div>
       </div>
     </label>
-    <div tabindex="0" class="mt-3 flex flex-col gap-2 dropdown-content border border-base-content/20 p-2 shadow bg-base-100 rounded-lg" ref="dropdownContent">
+    <div ref="dropdownContent" tabindex="0" class="flex flex-col gap-2 p-2 mt-3 border rounded-lg shadow dropdown-content border-base-content/20 bg-base-100">
       <template v-if="props.search">
         <div class="">
           <input
             v-model="searchText"
-            class="input border-2 placeholder-base-content text-sm input-bordered rounded-2xl"
+            class="text-sm border-2 input placeholder-base-content input-bordered rounded-2xl"
             placeholder="Search"
           >
         </div>
@@ -25,31 +25,31 @@
           <li
             v-for="(option) in filteredOptions()"
             :key="option.value"
-            class="text-base-content text-sm"
+            class="text-sm text-base-content"
             @click="toggleOption(option)"
           >
             <div class="flex flex-row w-full rounded-lg">
               <div class="font-bold text-neutral-content">
                 {{ option.name }}
               </div>
-              <div v-if="props.multiple" class="ml-auto flex flex-col items-center">
+              <div v-if="props.multiple" class="flex flex-col items-center ml-auto">
                 <span
                   v-if="isSelectedOption(option)"
                   class="relative inline-flex"
                 >
                   <input
                     type="checkbox"
-                    class="h-6 w-6 appearance-none bg-primary border-2 border-primary rounded-md"
+                    class="w-6 h-6 border-2 rounded-md appearance-none bg-primary border-primary"
                   >
                   <CheckIcon
-                    class="absolute text-neutral-content w-5"
+                    class="absolute w-5 text-neutral-content"
                     style="top: 50%;left: 50%;transform: translate(-50%, -50%);"
                   />
                 </span>
                 <input
                   v-else
                   type="checkbox"
-                  class="h-6 w-6 appearance-none border-2 border-base-content/20 rounded-md duration-200"
+                  class="w-6 h-6 duration-200 border-2 rounded-md appearance-none border-base-content/20"
                 >
               </div>
             </div>
@@ -62,7 +62,9 @@
         </div>
       </template>
       <template v-if="props.selected.length > 1">
-        <button class="p-2 bg-primary/10 text-primary text-sm w-full rounded-lg" @click="emit('update:selected', [])">Clear all</button>
+        <button class="w-full p-2 text-sm rounded-lg bg-primary/10 text-primary" @click="emit('update:selected', [])">
+          Clear all
+        </button>
       </template>
     </div>
   </div>
@@ -135,8 +137,6 @@ function toggleOption (option: TorrustSelectOption) {
     value = [option.value];
   }
 
-  console.log(value);
-
   emit("update:selected", value);
 }
 
diff --git a/components/torrent/TorrentActionCard.vue b/components/torrent/TorrentActionCard.vue
index 6d9fa6d0..a0af70a8 100644
--- a/components/torrent/TorrentActionCard.vue
+++ b/components/torrent/TorrentActionCard.vue
@@ -8,7 +8,9 @@
         <template v-if="torrent.tags?.length">
           <div class="flex flex-wrap space-x-2">
             <template v-for="tag in torrent.tags">
-              <NuxtLink :to="`/torrents?tagFilters=${tag.name}`" class="px-2 py-1 bg-base-content/25 hover:bg-base-content/50 font-semibold capitalize text-xs rounded-lg cursor-pointer">{{ tag.name }}</NuxtLink>
+              <NuxtLink :to="`/torrents?tagFilters=${tag.name}`" class="px-2 py-1 bg-base-content/25 hover:bg-base-content/50 font-semibold capitalize text-xs rounded-lg cursor-pointer">
+                {{ tag.name }}
+              </NuxtLink>
             </template>
           </div>
         </template>
diff --git a/components/torrent/TorrentList.vue b/components/torrent/TorrentList.vue
index 09ff3c13..4fd025e9 100644
--- a/components/torrent/TorrentList.vue
+++ b/components/torrent/TorrentList.vue
@@ -54,8 +54,7 @@ import { ArrowDownTrayIcon, LinkIcon } from "@heroicons/vue/24/outline";
 import { ChevronRightIcon, ChevronDownIcon } from "@heroicons/vue/20/solid";
 import { PropType } from "vue";
 import { TorrentCompact } from "torrust-index-types-lib";
-import { fileSize, timeSince, ref } from "#imports";
-import { downloadTorrent } from "#imports";
+import { fileSize, timeSince, ref, downloadTorrent } from "#imports";
 
 const props = defineProps({
   torrents: Array as PropType<Array<TorrentCompact>>
diff --git a/components/torrent/TorrentTable.vue b/components/torrent/TorrentTable.vue
index add20a27..ef8bc3b7 100644
--- a/components/torrent/TorrentTable.vue
+++ b/components/torrent/TorrentTable.vue
@@ -3,37 +3,47 @@
     <div class="flex flex-col overflow-x-auto whitespace-nowrap">
       <table class="table-auto text-center bg-base-200">
         <thead>
-        <tr class="text-sm text-base-content/75">
-          <th class="py-2">Name</th>
-          <th>Size</th>
-          <th>Date</th>
-          <th>Uploader</th>
-          <th>Seeders</th>
-          <th>Leechers</th>
-          <th>Actions</th>
-        </tr>
+          <tr class="text-sm text-base-content/75">
+            <th class="py-2">
+              Name
+            </th>
+            <th>Size</th>
+            <th>Date</th>
+            <th>Uploader</th>
+            <th>Seeders</th>
+            <th>Leechers</th>
+            <th>Actions</th>
+          </tr>
         </thead>
         <tbody>
-        <tr v-for="(torrent, index) in torrents" :key="index" class="bg-base-100 text-sm">
-          <td class="pl-6 text-left font-bold"><span @click.stop="$router.push(`/torrent/${torrent.info_hash}`)" class="cursor-pointer hover:text-amber-500 duration-200">{{ torrent.title }}</span></td>
-          <td class="px-2">{{ fileSize(torrent.file_size) }}</td>
-          <td>{{ timeSince(new Date(torrent.date_uploaded)) }} ago ({{ new Date(torrent.date_uploaded).toLocaleDateString(undefined, { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }) }})</td>
-          <td>{{ torrent.uploader }}</td>
-          <td class="text-green-500">{{ torrent.seeders }}</td>
-          <td class="text-red-500">{{ torrent.leechers }}</td>
-          <td>
-            <div class="flex flex-row flex-nowrap items-center justify-center font-semibold">
-              <div class="ml-2 w-10 h-10 text-base-content/50 hover:text-base-content flex flex-col shrink-0 items-center justify-center duration-500 cursor-pointer" @click.stop="downloadTorrent(torrent.info_hash, torrent.title)">
-                <ArrowDownTrayIcon class="w-5" />
+          <tr v-for="(torrent, index) in torrents" :key="index" class="bg-base-100 text-sm">
+            <td class="pl-6 text-left font-bold">
+              <span class="cursor-pointer hover:text-amber-500 duration-200" @click.stop="$router.push(`/torrent/${torrent.info_hash}`)">{{ torrent.title }}</span>
+            </td>
+            <td class="px-2">
+              {{ fileSize(torrent.file_size) }}
+            </td>
+            <td>{{ timeSince(new Date(torrent.date_uploaded)) }} ago ({{ new Date(torrent.date_uploaded).toLocaleDateString(undefined, { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }) }})</td>
+            <td>{{ torrent.uploader }}</td>
+            <td class="text-green-500">
+              {{ torrent.seeders }}
+            </td>
+            <td class="text-red-500">
+              {{ torrent.leechers }}
+            </td>
+            <td>
+              <div class="flex flex-row flex-nowrap items-center justify-center font-semibold">
+                <div class="ml-2 w-10 h-10 text-base-content/50 hover:text-base-content flex flex-col shrink-0 items-center justify-center duration-500 cursor-pointer" @click.stop="downloadTorrent(torrent.info_hash, torrent.title)">
+                  <ArrowDownTrayIcon class="w-5" />
+                </div>
+                <div class="ml-2 w-10 h-10 text-base-content/50 hover:text-base-content flex flex-col shrink-0 items-center justify-center duration-500 cursor-pointer">
+                  <a class="flex items-center" :href="`magnet:?xt=urn:btih:${torrent.info_hash}`">
+                    <LinkIcon class="w-5" />
+                  </a>
+                </div>
               </div>
-              <div class="ml-2 w-10 h-10 text-base-content/50 hover:text-base-content flex flex-col shrink-0 items-center justify-center duration-500 cursor-pointer">
-                <a class="flex items-center" :href="`magnet:?xt=urn:btih:${torrent.info_hash}`">
-                  <LinkIcon class="w-5" />
-                </a>
-              </div>
-            </div>
-          </td>
-        </tr>
+            </td>
+          </tr>
         </tbody>
       </table>
     </div>
@@ -44,8 +54,7 @@
 import { ArrowDownTrayIcon, LinkIcon } from "@heroicons/vue/24/outline";
 import { PropType } from "vue";
 import { TorrentCompact } from "torrust-index-types-lib";
-import { fileSize, timeSince, ref } from "#imports";
-import { downloadTorrent } from "#imports";
+import { fileSize, timeSince, ref, downloadTorrent } from "#imports";
 
 const props = defineProps({
   torrents: Array as PropType<Array<TorrentCompact>>
diff --git a/pages/torrent/edit/[infoHash].vue b/pages/torrent/edit/[infoHash].vue
index bcc8c329..643245e5 100644
--- a/pages/torrent/edit/[infoHash].vue
+++ b/pages/torrent/edit/[infoHash].vue
@@ -11,8 +11,12 @@
       <div>
         <label for="description" class="px-2">Description</label>
         <div class="my-2 tabs tabs-boxed w-fit border border-base-content/20">
-          <button class="tab" :class="{ 'tab-active': descriptionView === 'edit' }" @click="descriptionView = 'edit'">Edit</button>
-          <button class="tab" :class="{ 'tab-active': descriptionView === 'preview' }" @click="descriptionView = 'preview'">Preview</button>
+          <button class="tab" :class="{ 'tab-active': descriptionView === 'edit' }" @click="descriptionView = 'edit'">
+            Edit
+          </button>
+          <button class="tab" :class="{ 'tab-active': descriptionView === 'preview' }" @click="descriptionView = 'preview'">
+            Preview
+          </button>
         </div>
         <template v-if="descriptionView === 'edit'">
           <textarea
diff --git a/pages/torrents.vue b/pages/torrents.vue
index e87db66f..044b875e 100644
--- a/pages/torrents.vue
+++ b/pages/torrents.vue
@@ -30,8 +30,12 @@
     </div>
     <div class="flex">
       <div class="my-2 tabs tabs-boxed w-fit border border-base-content/20">
-        <button class="tab" :class="{ 'tab-active': layout === 'default' }" @click="layout = 'default'">Default</button>
-        <button class="tab" :class="{ 'tab-active': layout === 'table' }" @click="layout = 'table'">Table</button>
+        <button class="tab" :class="{ 'tab-active': layout === 'default' }" @click="layout = 'default'">
+          Default
+        </button>
+        <button class="tab" :class="{ 'tab-active': layout === 'table' }" @click="layout = 'table'">
+          Table
+        </button>
       </div>
     </div>
     <div class="flex flex-col">
diff --git a/pages/upload.vue b/pages/upload.vue
index cfe70341..75c6e0af 100644
--- a/pages/upload.vue
+++ b/pages/upload.vue
@@ -11,8 +11,12 @@
       <div>
         <label for="description" class="px-2">Description</label>
         <div class="my-2 tabs tabs-boxed w-fit border border-base-content/20">
-          <button class="tab" :class="{ 'tab-active': descriptionView === 'edit' }" @click="descriptionView = 'edit'">Edit</button>
-          <button class="tab" :class="{ 'tab-active': descriptionView === 'preview' }" @click="descriptionView = 'preview'">Preview</button>
+          <button class="tab" :class="{ 'tab-active': descriptionView === 'edit' }" @click="descriptionView = 'edit'">
+            Edit
+          </button>
+          <button class="tab" :class="{ 'tab-active': descriptionView === 'preview' }" @click="descriptionView = 'preview'">
+            Preview
+          </button>
         </div>
         <template v-if="descriptionView === 'edit'">
           <textarea
diff --git a/tailwind.config.js b/tailwind.config.js
index 29a00cb1..1704e850 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -35,6 +35,6 @@ module.exports = {
   },
   plugins: [
     require("daisyui"),
-    require('@tailwindcss/typography')
+    require("@tailwindcss/typography")
   ]
 };