NotFoundView.vue

<script setup lang="ts"></script>

<template>
  <div
    class="card min-w-25 text-center ms-md-auto position-fixed top-50 start-50 translate-middle shadow"
  >
    <div class="card-header fs-4">Something went wrong</div>
    <div class="card-body p-5">
      <h1 class="card-title mb-5">Page Not Found</h1>
      <p class="card-text text-secondary fs-4">
        Back to the <router-link to="/">HomePage</router-link>
      </p>
    </div>
  </div>
</template>

<style scoped>
.min-w-25 {
  min-width: 25%;
}
</style>