UI Tweaks and new Routing. Profile, Settings and Recovery made.

movie-group-8/src/router/index.js

@@ -7,6 +7,7 @@ const router = createRouter({
         { path: '/', component: () => import('../views/Home.vue') },
         { path: '/register', component: () => import('../views/Register.vue') },
         { path: '/login', component: () => import('../views/Login.vue') },
+        { path: '/recover-account', component: () => import('../views/RecoverAccount.vue') },
         { 
           path: '/films', 
           component: () => import('../views/Films.vue'), 
@@ -16,7 +17,17 @@ const router = createRouter({
             path: '/watchlist', 
             component: () => import('../views/Watchlist.vue'), 
             meta: { requiresAuth: true },
-          },
+        },
+        { 
+            path: '/profile', 
+            component: () => import('../views/Profile.vue'), 
+            meta: { requiresAuth: true },
+        },
+        { 
+            path: '/settings', 
+            component: () => import('../views/Settings.vue'), 
+            meta: { requiresAuth: true },
+        },
     ],
 });
 

movie-group-8/src/views/Login.vue

@@ -35,7 +35,7 @@
                 <div>
                     <div class="flex justify-between items-center mb-2">
                         <label class="block text-sm dark:text-white">Password</label>
-                        <a class="text-sm text-blue-600 decoration-2 hover:underline focus:outline-hidden focus:underline font-medium dark:text-blue-500" href="../examples/html/recover-account.html">
+                        <a class="text-sm text-blue-600 decoration-2 hover:underline focus:outline-hidden focus:underline font-medium dark:text-blue-500" href="/recover-account">
                         Forgot password?
                         </a>
                     </div>

movie-group-8/src/views/Profile.vue

+<template>Profile</template>
\ No newline at end of file

movie-group-8/src/views/RecoverAccount.vue

+<template>Recover Account</template>
\ No newline at end of file

movie-group-8/src/views/Settings.vue

+<template>Settings</template>
\ No newline at end of file