diff --git a/package.json b/package.json
index c9e882a..5d65e8a 100644
--- a/package.json
+++ b/package.json
@@ -68,6 +68,7 @@
     "qrcode": "^1.5.3",
     "sass": "^1.75.0",
     "tailwind-merge": "^2.5.2",
+    "vue-pagination-2": "^3.1.0",
     "vue-qrcode": "^2.2.2",
     "vue-qrcode-reader": "^5.5.4",
     "vue3-form-wizard": "^0.2.3",
diff --git a/pages/teerdays.vue b/pages/teerdays.vue
index 34f52f1..968290b 100644
--- a/pages/teerdays.vue
+++ b/pages/teerdays.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="text-center py-4 lg:px-4">
+  <div class="text-center mb-17 sm:mb-20 lg:mb-20 py-4 lg:px-4">
     <div
       class="p-2 incognitee-bg items-center text-indigo-100 leading-none lg:rounded-full flex lg:inline-flex"
       role="alert"
@@ -116,102 +116,93 @@
       class="my-20 border-0 h-px bg-gradient-to-r from-transparent via-gray-700 to-transparent"
     />
 
-    <div class="my-28">
-      <div class="mx-auto max-w-7xl px-6 lg:px-8">
-        <div class="mx-auto max-w-2xl lg:max-w-none">
-          <dl class="mt-5 grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3">
-            <div class="relative overflow-hidden w-full sm:w-auto">
-              <dt>
-                <div class="absolute rounded-md bg-gray-800 p-3">
-                  <svg
-                    class="h-6 w-6 text-white"
-                    fill="none"
-                    viewBox="0 0 24 24"
-                    stroke-width="1.5"
-                    stroke="currentColor"
-                    aria-hidden="true"
-                  >
-                    <path
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      d="M15 19.128a9.38 9.38 0 0 0 2.625.372 9.337 9.337 0 0 0 4.121-.952 4.125 4.125 0 0 0-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 0 1 8.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0 1 11.964-3.07M12 6.375a3.375 3.375 0 1 1-6.75 0 3.375 3.375 0 0 1 6.75 0Zm8.25 2.25a2.625 2.625 0 1 1-5.25 0 2.625 2.625 0 0 1 5.25 0Z"
-                    />
-                  </svg>
-                </div>
-                <p class="ml-16 truncate text-xs font-medium text-gray-400">
-                  TEERday holder
-                </p>
-              </dt>
-              <dd class="ml-16 flex items-baseline">
-                <p class="text-4xl font-semibold text-white">
-                  {{ summaryHolders }}
-                </p>
-              </dd>
+    <div class="mb-20">
+      <dl
+        class="mt-5 grid grid-cols-1 divide-y divide-gray-700 overflow-hidden rounded-lg bg-gray-800 shadow md:grid-cols-3 md:divide-x md:divide-y-0"
+      >
+        <div class="px-4 py-5 sm:p-6">
+          <svg
+            class="h-6 w-6 mb-3 text-white"
+            fill="none"
+            viewBox="0 0 24 24"
+            stroke-width="1.5"
+            stroke="currentColor"
+            aria-hidden="true"
+          >
+            <path
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              d="M15 19.128a9.38 9.38 0 0 0 2.625.372 9.337 9.337 0 0 0 4.121-.952 4.125 4.125 0 0 0-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 0 1 8.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0 1 11.964-3.07M12 6.375a3.375 3.375 0 1 1-6.75 0 3.375 3.375 0 0 1 6.75 0Zm8.25 2.25a2.625 2.625 0 1 1-5.25 0 2.625 2.625 0 0 1 5.25 0Z"
+            />
+          </svg>
+          <dt class="text-base font-normal text-gray-300">TEERday holder</dt>
+          <dd class="mt-1 flex items-baseline justify-between md:block lg:flex">
+            <div
+              class="flex items-baseline text-2xl font-semibold text-incognitee-green"
+            >
+              {{ summaryHolders }}
             </div>
-
-            <div class="relative overflow-hidden w-full sm:w-auto">
-              <dt>
-                <div class="absolute rounded-md bg-gray-800 p-3">
-                  <svg
-                    class="h-6 w-6 text-white"
-                    fill="none"
-                    viewBox="0 0 24 24"
-                    stroke-width="1.5"
-                    stroke="currentColor"
-                    aria-hidden="true"
-                  >
-                    <path
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      d="M16.5 10.5V6.75a4.5 4.5 0 1 0-9 0v3.75m-.75 11.25h10.5a2.25 2.25 0 0 0 2.25-2.25v-6.75a2.25 2.25 0 0 0-2.25-2.25H6.75a2.25 2.25 0 0 0-2.25 2.25v6.75a2.25 2.25 0 0 0 2.25 2.25Z"
-                    />
-                  </svg>
-                </div>
-                <p class="ml-16 truncate text-xs font-medium text-gray-400">
-                  Total TEER bonded
-                </p>
-              </dt>
-              <dd class="ml-16 flex items-baseline">
-                <p class="text-4xl font-semibold text-white">
-                  {{ summaryTeerBonded.toFixed(2) }}
-                </p>
-              </dd>
+          </dd>
+        </div>
+        <div class="px-4 py-5 sm:p-6">
+          <svg
+            class="h-6 w-6 mb-3 text-white"
+            fill="none"
+            viewBox="0 0 24 24"
+            stroke-width="1.5"
+            stroke="currentColor"
+            aria-hidden="true"
+          >
+            <path
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              d="M16.5 10.5V6.75a4.5 4.5 0 1 0-9 0v3.75m-.75 11.25h10.5a2.25 2.25 0 0 0 2.25-2.25v-6.75a2.25 2.25 0 0 0-2.25-2.25H6.75a2.25 2.25 0 0 0-2.25 2.25v6.75a2.25 2.25 0 0 0 2.25 2.25Z"
+            />
+          </svg>
+          <dt class="text-base font-normal text-gray-300">Total TEER bonded</dt>
+          <dd class="mt-1 flex items-baseline justify-between md:block lg:flex">
+            <div
+              class="flex items-baseline text-2xl font-semibold text-incognitee-green"
+            >
+              {{ summaryTeerBonded.toFixed(2) }}
             </div>
-
-            <div class="relative overflow-hidden w-full sm:w-auto">
-              <dt>
-                <div class="absolute rounded-md bg-gray-800 p-3">
-                  <svg
-                    class="h-6 w-6 text-white"
-                    fill="none"
-                    viewBox="0 0 24 24"
-                    stroke-width="1.5"
-                    stroke="currentColor"
-                    aria-hidden="true"
-                  >
-                    <path
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      d="M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 0 1 3 19.875v-6.75ZM9.75 8.625c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125V8.625ZM16.5 4.125c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125V4.125Z"
-                    />
-                  </svg>
-                </div>
-                <p class="ml-16 truncate text-xs font-medium text-gray-400">
-                  Total TEERdays active
-                </p>
-              </dt>
-              <dd class="ml-16 flex items-baseline">
-                <p class="text-4xl font-semibold text-white">
-                  {{ summaryTeerDays.toFixed(2) }}
-                </p>
-              </dd>
+          </dd>
+        </div>
+        <div class="px-4 py-5 sm:p-6">
+          <svg
+            class="h-6 w-6 mb-3 text-white"
+            fill="none"
+            viewBox="0 0 24 24"
+            stroke-width="1.5"
+            stroke="currentColor"
+            aria-hidden="true"
+          >
+            <path
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              d="M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 0 1 3 19.875v-6.75ZM9.75 8.625c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125V8.625ZM16.5 4.125c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125V4.125Z"
+            />
+          </svg>
+          <dt class="text-base font-normal text-gray-300">
+            Total TEERdays active
+          </dt>
+          <dd class="mt-1 flex items-baseline justify-between md:block lg:flex">
+            <div
+              class="flex items-baseline text-2xl font-semibold text-incognitee-green"
+            >
+              {{ summaryTeerDays.toFixed(2) }}
             </div>
-          </dl>
+          </dd>
         </div>
-      </div>
+      </dl>
     </div>
 
-    <div v-if="accounts.length" class="py-12 sm:py-16">
+    <div
+      v-if="accounts.length > 0"
+      ref="walletSection"
+      id="wallet"
+      class="py-12 sm:py-16"
+    >
       <div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
         <div class="mx-auto max-w-2xl lg:max-w-none">
           <h1
@@ -1036,18 +1027,63 @@ watch(selectedAccount, (newAccount) => {
     accountStore.setAddress(newAccount);
   }
 });
+import { nextTick } from "vue";
+
 const connect = () => {
   web3Enable("Integritee Dapp")
     .then((extensions) => {
-      console.log(extensions);
+      console.log("Enabled extensions:", extensions);
+
+      // Check if any extensions are found
+      if (extensions.length === 0) {
+        console.error(
+          "No wallet extensions found. Please install or enable a wallet.",
+        );
+        alert("No wallet extensions found. Please install or enable a wallet.");
+        return; // Stop execution if no extensions are found
+      }
+
       return web3Accounts();
     })
     .then((accountsList) => {
+      // If web3Accounts() didn't return a list, exit gracefully
+      if (!accountsList) {
+        console.error("No accounts found. Please unlock your wallet.");
+        alert("No accounts found. Please unlock your wallet.");
+        return;
+      }
+
+      // If accounts are found, store them
       accounts.value = accountsList;
-      console.log(accounts);
+      console.log("Found accounts:", accountsList);
+
+      if (accountsList.length > 0) {
+        // Wallet accounts found, scroll to the wallet section
+        nextTick(() => {
+          const walletSection = document.getElementById("wallet");
+          if (walletSection) {
+            // Scroll with smooth behavior
+            walletSection.scrollIntoView({
+              behavior: "smooth",
+              block: "start",
+            });
+          } else {
+            console.error("Wallet section not found.");
+          }
+        });
+      } else {
+        console.error(
+          "No accounts detected. Please unlock your wallet or create an account.",
+        );
+        alert(
+          "No accounts detected. Please unlock your wallet or create an account.",
+        );
+      }
     })
     .catch((error) => {
-      console.error("Error in web3Enable or web3Accounts:", error);
+      // Handle any errors during the connection process
+      console.error("Error during wallet connection:", error);
+      alert("Error during wallet connection. Please try again.");
     });
 };
 
@@ -1296,27 +1332,39 @@ class PendingUnlock {
 
 const txStatus = ref("");
 const showStatusOverlay = ref(false);
+
+// Open the status overlay (notification)
 const openStatusOverlay = () => {
   showStatusOverlay.value = true;
 };
+
+// Close the status overlay after a delay (e.g., 5 seconds)
+const closeStatusOverlay = () => {
+  setTimeout(() => {
+    showStatusOverlay.value = false;
+  }, 5000); // 5 seconds delay
+};
+
 const txResHandlerIntegritee = ({ events = [], status, txHash }) => {
-  status.isFinalized
-    ? (txStatus.value = `😀 Finalized!`)
-    : (txStatus.value = `⌛ Current transaction status: ${status.type}. Please be patient a few more seconds.`);
+  if (status.isFinalized) {
+    txStatus.value = `😀 Finalized!`;
+
+    // Close the overlay automatically after 5 seconds
+    closeStatusOverlay();
+  } else {
+    txStatus.value = `⌛ Current transaction status: ${status.type}. Please be patient a few more seconds.`;
+  }
 
   // Loop through Vec<EventRecord> to display all events
   events.forEach(({ _, event: { data, method, section } }) => {
     if (section + ":" + method === "system:ExtrinsicFailed") {
-      // extract the data for this event
+      // Extract the data for this event
       const [dispatchError, dispatchInfo] = data;
       console.log(`dispatchinfo: ${dispatchInfo}`);
       let errorInfo;
 
-      // decode the error
+      // Decode the error
       if (dispatchError.isModule) {
-        // for module errors, we have the section indexed, lookup
-        // (For specific known errors, we can also do a check against the
-        // api.errors.<module>.<ErrorName>.is(dispatchError.asModule) guard)
         const mod = dispatchError.asModule;
         const error = api.registry.findMetaError(
           new Uint8Array([
@@ -1338,13 +1386,16 @@ const txResHandlerIntegritee = ({ events = [], status, txHash }) => {
       }
       txStatus.value = `😞 Transaction Failed! ${section}.${method}::${errorInfo}`;
     } else if (section + ":" + method === "system:ExtrinsicSuccess") {
-      txStatus.value`❤️️ Transaction successful!`;
+      txStatus.value = `❤️️ Transaction successful!`;
+      // Close the overlay automatically after 5 seconds if successful
+      closeStatusOverlay();
     }
   });
 };
 
-const txErrHandlerIntegritee = (err) =>
-  (txStatus.value = `😞 Transaction Failed: ${err.toString()}`);
+const txErrHandlerIntegritee = (err) => {
+  txStatus.value = `😞 Transaction Failed: ${err.toString()}`;
+};
 </script>
 
 <style scoped>
@@ -1468,10 +1519,13 @@ input[type="number"] {
   }
 
   &__row {
-    gap: 48px;
+    display: block; /* Default for mobile */
 
-    @include md {
-      display: block;
+    /* Media Query for Desktop */
+    @media (min-width: 768px) {
+      /* Adjust the pixel value according to your breakpoint */
+      display: flex;
+      gap: 48px;
     }
   }
 
diff --git a/yarn.lock b/yarn.lock
index 7eed909..1236be4 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -274,6 +274,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-string-parser@npm:^7.24.8":
+  version: 7.24.8
+  resolution: "@babel/helper-string-parser@npm:7.24.8"
+  checksum: 10c0/6361f72076c17fabf305e252bf6d580106429014b3ab3c1f5c4eb3e6d465536ea6b670cc0e9a637a77a9ad40454d3e41361a2909e70e305116a23d68ce094c08
+  languageName: node
+  linkType: hard
+
 "@babel/helper-validator-identifier@npm:^7.24.5, @babel/helper-validator-identifier@npm:^7.24.6":
   version: 7.24.6
   resolution: "@babel/helper-validator-identifier@npm:7.24.6"
@@ -281,6 +288,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-validator-identifier@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-validator-identifier@npm:7.24.7"
+  checksum: 10c0/87ad608694c9477814093ed5b5c080c2e06d44cb1924ae8320474a74415241223cc2a725eea2640dd783ff1e3390e5f95eede978bc540e870053152e58f1d651
+  languageName: node
+  linkType: hard
+
 "@babel/helper-validator-option@npm:^7.24.6":
   version: 7.24.6
   resolution: "@babel/helper-validator-option@npm:7.24.6"
@@ -319,6 +333,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/parser@npm:^7.25.3":
+  version: 7.25.6
+  resolution: "@babel/parser@npm:7.25.6"
+  dependencies:
+    "@babel/types": "npm:^7.25.6"
+  bin:
+    parser: ./bin/babel-parser.js
+  checksum: 10c0/f88a0e895dbb096fd37c4527ea97d12b5fc013720602580a941ac3a339698872f0c911e318c292b184c36b5fbe23b612f05aff9d24071bc847c7b1c21552c41d
+  languageName: node
+  linkType: hard
+
 "@babel/plugin-proposal-decorators@npm:^7.23.0":
   version: 7.24.6
   resolution: "@babel/plugin-proposal-decorators@npm:7.24.6"
@@ -457,6 +482,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/types@npm:^7.25.6":
+  version: 7.25.6
+  resolution: "@babel/types@npm:7.25.6"
+  dependencies:
+    "@babel/helper-string-parser": "npm:^7.24.8"
+    "@babel/helper-validator-identifier": "npm:^7.24.7"
+    to-fast-properties: "npm:^2.0.0"
+  checksum: 10c0/89d45fbee24e27a05dca2d08300a26b905bd384a480448823f6723c72d3a30327c517476389b7280ce8cb9a2c48ef8f47da7f9f6d326faf6f53fd6b68237bdc4
+  languageName: node
+  linkType: hard
+
 "@cloudflare/kv-asset-handler@npm:^0.3.1":
   version: 0.3.2
   resolution: "@cloudflare/kv-asset-handler@npm:0.3.2"
@@ -1006,6 +1042,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@jridgewell/sourcemap-codec@npm:^1.5.0":
+  version: 1.5.0
+  resolution: "@jridgewell/sourcemap-codec@npm:1.5.0"
+  checksum: 10c0/2eb864f276eb1096c3c11da3e9bb518f6d9fc0023c78344cdc037abadc725172c70314bdb360f2d4b7bffec7f5d657ce006816bc5d4ecb35e61b66132db00c18
+  languageName: node
+  linkType: hard
+
 "@jridgewell/trace-mapping@npm:^0.3.24, @jridgewell/trace-mapping@npm:^0.3.25":
   version: 0.3.25
   resolution: "@jridgewell/trace-mapping@npm:0.3.25"
@@ -3966,6 +4009,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/compiler-core@npm:3.5.1":
+  version: 3.5.1
+  resolution: "@vue/compiler-core@npm:3.5.1"
+  dependencies:
+    "@babel/parser": "npm:^7.25.3"
+    "@vue/shared": "npm:3.5.1"
+    entities: "npm:^4.5.0"
+    estree-walker: "npm:^2.0.2"
+    source-map-js: "npm:^1.2.0"
+  checksum: 10c0/a0b055a3b1ca81a1f0cb38bf796ff43e51f2c88de6685d3dc4c8bb0229c5c9f09eb0602812d7f2bd1febf31a1c78a7d6ef36213d805132a2e20e1382ab3a7815
+  languageName: node
+  linkType: hard
+
 "@vue/compiler-dom@npm:3.4.27, @vue/compiler-dom@npm:^3.3.4":
   version: 3.4.27
   resolution: "@vue/compiler-dom@npm:3.4.27"
@@ -3976,6 +4032,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/compiler-dom@npm:3.5.1":
+  version: 3.5.1
+  resolution: "@vue/compiler-dom@npm:3.5.1"
+  dependencies:
+    "@vue/compiler-core": "npm:3.5.1"
+    "@vue/shared": "npm:3.5.1"
+  checksum: 10c0/6eb5453ae7d58d52033f939d1f8e31b58effe1d5c10bd5d04473b654630e5e29f8314f0bfaafd8b624ef3f237a0322fd457701cc1bd4c35c3f21717a707e108e
+  languageName: node
+  linkType: hard
+
 "@vue/compiler-sfc@npm:3.4.27, @vue/compiler-sfc@npm:^3.4.15, @vue/compiler-sfc@npm:^3.4.27":
   version: 3.4.27
   resolution: "@vue/compiler-sfc@npm:3.4.27"
@@ -3993,6 +4059,23 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/compiler-sfc@npm:3.5.1":
+  version: 3.5.1
+  resolution: "@vue/compiler-sfc@npm:3.5.1"
+  dependencies:
+    "@babel/parser": "npm:^7.25.3"
+    "@vue/compiler-core": "npm:3.5.1"
+    "@vue/compiler-dom": "npm:3.5.1"
+    "@vue/compiler-ssr": "npm:3.5.1"
+    "@vue/shared": "npm:3.5.1"
+    estree-walker: "npm:^2.0.2"
+    magic-string: "npm:^0.30.11"
+    postcss: "npm:^8.4.44"
+    source-map-js: "npm:^1.2.0"
+  checksum: 10c0/be6327da609ddac76feb09efcf9fe4ce627c0b4a26f69640605559609be552e8e46c8301a4ea425f0d5bcb28b5382fc4c9a671628044dbecdbee4318c8d313f7
+  languageName: node
+  linkType: hard
+
 "@vue/compiler-ssr@npm:3.4.27":
   version: 3.4.27
   resolution: "@vue/compiler-ssr@npm:3.4.27"
@@ -4003,6 +4086,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/compiler-ssr@npm:3.5.1":
+  version: 3.5.1
+  resolution: "@vue/compiler-ssr@npm:3.5.1"
+  dependencies:
+    "@vue/compiler-dom": "npm:3.5.1"
+    "@vue/shared": "npm:3.5.1"
+  checksum: 10c0/91c3f46a8e95ab2572b6dfa5871414f5b7a19e3d85f958d773c10e7a70fd230ca6d51ea09d2f2afdd2b3d9abd954e651d91bf83a9252c289d2a8f61d6fc50422
+  languageName: node
+  linkType: hard
+
 "@vue/devtools-api@npm:^6.5.0, @vue/devtools-api@npm:^6.5.1":
   version: 6.6.1
   resolution: "@vue/devtools-api@npm:6.6.1"
@@ -4095,6 +4188,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/reactivity@npm:3.5.1":
+  version: 3.5.1
+  resolution: "@vue/reactivity@npm:3.5.1"
+  dependencies:
+    "@vue/shared": "npm:3.5.1"
+  checksum: 10c0/87ea0ab297fc62e264497b85d758be456ecd9cae8f0d8cd58fbd82b8a0fc148f057c165d6df0e3ba7600be2b8bafee177a96d86418a5135f2e87aa0ec1d3446e
+  languageName: node
+  linkType: hard
+
 "@vue/runtime-core@npm:3.4.27":
   version: 3.4.27
   resolution: "@vue/runtime-core@npm:3.4.27"
@@ -4105,6 +4207,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/runtime-core@npm:3.5.1":
+  version: 3.5.1
+  resolution: "@vue/runtime-core@npm:3.5.1"
+  dependencies:
+    "@vue/reactivity": "npm:3.5.1"
+    "@vue/shared": "npm:3.5.1"
+  checksum: 10c0/7c6f298102ceedb1daff53b5a5769332cf9017056b3991d7a89f1e024b09317af7d09a62c88933470d1d18a2102f46f116d225fb1d55460f856a0a47819c207d
+  languageName: node
+  linkType: hard
+
 "@vue/runtime-dom@npm:3.4.27":
   version: 3.4.27
   resolution: "@vue/runtime-dom@npm:3.4.27"
@@ -4116,6 +4228,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/runtime-dom@npm:3.5.1":
+  version: 3.5.1
+  resolution: "@vue/runtime-dom@npm:3.5.1"
+  dependencies:
+    "@vue/reactivity": "npm:3.5.1"
+    "@vue/runtime-core": "npm:3.5.1"
+    "@vue/shared": "npm:3.5.1"
+    csstype: "npm:^3.1.3"
+  checksum: 10c0/cf5c4fafc3aa298954f9b0ed3db9fc4f24b95e2529cf3218fbb0a5b9357ffb685d7e2606f948cfb9bc9505a43c5fe0098dc7306c90f2f2f45d1f86c0f1e96740
+  languageName: node
+  linkType: hard
+
 "@vue/server-renderer@npm:3.4.27":
   version: 3.4.27
   resolution: "@vue/server-renderer@npm:3.4.27"
@@ -4128,6 +4252,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/server-renderer@npm:3.5.1":
+  version: 3.5.1
+  resolution: "@vue/server-renderer@npm:3.5.1"
+  dependencies:
+    "@vue/compiler-ssr": "npm:3.5.1"
+    "@vue/shared": "npm:3.5.1"
+  peerDependencies:
+    vue: 3.5.1
+  checksum: 10c0/5407a36fe9bf054d4835c38c266426874ea42dc55b439e1a3b999d10012d7f0a287f1fdee40adc07ae03580778357dc5474569710748e86626271eba2a0279ab
+  languageName: node
+  linkType: hard
+
 "@vue/shared@npm:3.4.27, @vue/shared@npm:^3.4.21":
   version: 3.4.27
   resolution: "@vue/shared@npm:3.4.27"
@@ -4135,6 +4271,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/shared@npm:3.5.1":
+  version: 3.5.1
+  resolution: "@vue/shared@npm:3.5.1"
+  checksum: 10c0/fe54f4861eb0e2962fd11d9607cb2b02ffd162ccd31264f3fa3949cd4673eb9704bab7c1a9c7f4f59fbeb2eebc5d579729c2aeab7cb77a0654d2bd865a732c57
+  languageName: node
+  linkType: hard
+
 "@vuelidate/core@npm:^2.0.3":
   version: 2.0.3
   resolution: "@vuelidate/core@npm:2.0.3"
@@ -4684,6 +4827,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"babel-plugin-add-module-exports@npm:^0.2.1":
+  version: 0.2.1
+  resolution: "babel-plugin-add-module-exports@npm:0.2.1"
+  checksum: 10c0/013f92f2f5722eefc8aa0e513ba6efd57df649702b518b3734c47e66b072ca9931ad9a0b2692dcde9e6b18c981c4c24f423d105b9e1b16707cf5517cbacad1e7
+  languageName: node
+  linkType: hard
+
 "bail@npm:^2.0.0":
   version: 2.0.2
   resolution: "bail@npm:2.0.2"
@@ -9011,6 +9161,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"magic-string@npm:^0.30.11":
+  version: 0.30.11
+  resolution: "magic-string@npm:0.30.11"
+  dependencies:
+    "@jridgewell/sourcemap-codec": "npm:^1.5.0"
+  checksum: 10c0/b9eb370773d0bd90ca11a848753409d8e5309b1ad56d2a1aa49d6649da710a6d2fe7237ad1a643c5a5d3800de2b9946ed9690acdfc00e6cc1aeafff3ab1752c4
+  languageName: node
+  linkType: hard
+
 "magicast@npm:^0.3.4":
   version: 0.3.4
   resolution: "magicast@npm:0.3.4"
@@ -9268,6 +9427,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"merge@npm:^2.1.1":
+  version: 2.1.1
+  resolution: "merge@npm:2.1.1"
+  checksum: 10c0/9e722a88f661fb4d32bfbab37dcc10c2057d3e3ec7bda5325a13cbfb82a59916963ec99374cca7f5bd3ff8c65a6ffbd9e1061bc0c45c6e3bf211c78af659cb44
+  languageName: node
+  linkType: hard
+
 "methods@npm:^1.1.2":
   version: 1.1.2
   resolution: "methods@npm:1.1.2"
@@ -10418,6 +10584,7 @@ __metadata:
     vite: "npm:^5.2.10"
     vite-svg-loader: "npm:^5.1.0"
     vue: "npm:^3.4.26"
+    vue-pagination-2: "npm:^3.1.0"
     vue-qrcode: "npm:^2.2.2"
     vue-qrcode-reader: "npm:^5.5.4"
     vue-router: "npm:^4.3.2"
@@ -11502,6 +11669,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"postcss@npm:^8.4.44":
+  version: 8.4.45
+  resolution: "postcss@npm:8.4.45"
+  dependencies:
+    nanoid: "npm:^3.3.7"
+    picocolors: "npm:^1.0.1"
+    source-map-js: "npm:^1.2.0"
+  checksum: 10c0/ad6f8b9b1157d678560373696109745ab97a947d449f8a997acac41c7f1e4c0f3ca4b092d6df1387f430f2c9a319987b1780dbdc27e35800a88cde9b606c1e8f
+  languageName: node
+  linkType: hard
+
 "prelude-ls@npm:^1.2.1":
   version: 1.2.1
   resolution: "prelude-ls@npm:1.2.1"
@@ -14267,6 +14445,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"vue-pagination-2@npm:^3.1.0":
+  version: 3.1.0
+  resolution: "vue-pagination-2@npm:3.1.0"
+  dependencies:
+    babel-plugin-add-module-exports: "npm:^0.2.1"
+    merge: "npm:^2.1.1"
+    vue: "npm:>=2.0.0"
+    vuex: "npm:^2.0.0"
+  checksum: 10c0/f7d275976357de626c1c60498c8a32d4462fbe64d47e9b2fd5043a13f0591e92a8589ea659e9cd807e9177086323d343eb189a5ac118d14f4c24bb2821e8e7e1
+  languageName: node
+  linkType: hard
+
 "vue-qrcode-reader@npm:^5.5.4":
   version: 5.5.6
   resolution: "vue-qrcode-reader@npm:5.5.6"
@@ -14329,6 +14519,24 @@ __metadata:
   languageName: node
   linkType: hard
 
+"vue@npm:>=2.0.0":
+  version: 3.5.1
+  resolution: "vue@npm:3.5.1"
+  dependencies:
+    "@vue/compiler-dom": "npm:3.5.1"
+    "@vue/compiler-sfc": "npm:3.5.1"
+    "@vue/runtime-dom": "npm:3.5.1"
+    "@vue/server-renderer": "npm:3.5.1"
+    "@vue/shared": "npm:3.5.1"
+  peerDependencies:
+    typescript: "*"
+  peerDependenciesMeta:
+    typescript:
+      optional: true
+  checksum: 10c0/bf1050faa0f20eae1ff7bd80fac545fa051459f66d1968a2ba7eaeee7bf23762a1fbb9e68a12ec25c1b08a5e53df601c1d45cb482292a661128fe219093e51cc
+  languageName: node
+  linkType: hard
+
 "vue@npm:^3.4.21, vue@npm:^3.4.26":
   version: 3.4.27
   resolution: "vue@npm:3.4.27"
@@ -14369,6 +14577,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"vuex@npm:^2.0.0":
+  version: 2.5.0
+  resolution: "vuex@npm:2.5.0"
+  checksum: 10c0/c67659376f28eee06b915aafe0b30ef2f5a4dbaa34a30d884bacd26e9c6816613d0e306ea08b99c2f3f4a9751a676c6fcd5f1c4f98739703af2152b07360e16c
+  languageName: node
+  linkType: hard
+
 "web-namespaces@npm:^2.0.0":
   version: 2.0.1
   resolution: "web-namespaces@npm:2.0.1"