hooked up all items on the list settings section

app/pages/auth/login.vue

@@ -7,10 +7,21 @@ definePageMeta({
 </script>
 
 <template>
-  <login-form/>
+  <div class="content">
+    <h1>Log in</h1>
+    <login-form/>
+  </div>
 
 </template>
 
 <style scoped>
+.content {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  height: 100vh;
+  gap: 2rem;
+}
 
 </style>

app/pages/auth/register.vue

@@ -0,0 +1,32 @@
+<script lang="ts" setup>
+
+import RegistrationForm from "~/components/forms/auth/registration-form.vue";
+
+const showForm = ref(true);
+
+definePageMeta({
+  layout: 'auth'
+})
+
+const onRegistered = () => {
+  showForm.value = false;
+}
+</script>
+
+<template>
+  <div class="content">
+    <h1>Register</h1>
+    <registration-form v-if="showForm" @registered="onRegistered"/>
+    <div v-else>Registration successful! Check your email to set your password and log in.</div>
+  </div>
+
+</template>
+
+<style scoped>
+.content {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+</style>

app/pages/auth/reset-password/[token].vue

@@ -0,0 +1,30 @@
+<script lang="ts" setup>
+import NewPasswordForm from "~/components/forms/auth/new-password-form.vue";
+
+definePageMeta({
+  layout: 'auth'
+})
+
+const route = useRoute();
+
+const passwordResetToken = route.params.token as string;
+const email = route.query.email as string;
+</script>
+
+<template>
+  <div class="content">
+    <h1>Reset Your Password</h1>
+    <new-password-form :email="email" :token="passwordResetToken"/>
+  </div>
+</template>
+
+<style scoped>
+.content {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  height: 100vh;
+  gap: 2rem;
+}
+
+</style>