Index: ReserveNGo-frontend/src/App.vue
===================================================================
--- ReserveNGo-frontend/src/App.vue	(revision 4446c6f1a98d080a7c8ad0fe599e8ce1d4eb55d6)
+++ ReserveNGo-frontend/src/App.vue	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
@@ -37,4 +37,6 @@
 
 <style scoped>
+
+template{ background: #FBFFF1;}
 /*header {
   line-height: 1.5;
Index: ReserveNGo-frontend/src/PiniaStores/restaurantStore.js
===================================================================
--- ReserveNGo-frontend/src/PiniaStores/restaurantStore.js	(revision 4446c6f1a98d080a7c8ad0fe599e8ce1d4eb55d6)
+++ ReserveNGo-frontend/src/PiniaStores/restaurantStore.js	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
@@ -9,10 +9,17 @@
     return {
       name: '',
+      address: '',
+      workingHours: '00:50',
+      availableServices: [],
+      averageRating: 0
 
     }
   },
   actions: {
-    setName (name) {
+    setDetails (name, address, workingHours) {
       this.name = name
+      this.address = address
+      this.workingHours = workingHours
+      //this.availableServices = availableServices
     }
   },
Index: ReserveNGo-frontend/src/components/Project/Footer_.vue
===================================================================
--- ReserveNGo-frontend/src/components/Project/Footer_.vue	(revision 4446c6f1a98d080a7c8ad0fe599e8ce1d4eb55d6)
+++ ReserveNGo-frontend/src/components/Project/Footer_.vue	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
@@ -6,5 +6,7 @@
 
     <div id="container" class="border">
+      <footer>
       Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque, voluptatibus?
+      </footer>
     </div>
 
@@ -16,4 +18,9 @@
 #container{
   height: 20vh;
+  background: #8377D1;
+}
+
+footer{
+
 }
 
Index: ReserveNGo-frontend/src/components/Project/Locale_details.vue
===================================================================
--- ReserveNGo-frontend/src/components/Project/Locale_details.vue	(revision 4446c6f1a98d080a7c8ad0fe599e8ce1d4eb55d6)
+++ ReserveNGo-frontend/src/components/Project/Locale_details.vue	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
@@ -1,4 +1,6 @@
 <script>
 
+
+import { restaurantStore } from '@/PiniaStores/restaurantStore.js'
 
 export default {
@@ -8,5 +10,6 @@
         name: '',
         address: ''
-      }
+      },
+      restaurantStore: restaurantStore()
     }
   }
@@ -18,5 +21,5 @@
     <div id="container" class="border px-5 py-2">
       <p>Local details...</p>
-      <p>Working hours: xx:yy-xx:yy</p>
+      <p>Working hours: {{restaurantStore.workingHours}}</p>
       <ul>
         <li>Service 1</li>
Index: ReserveNGo-frontend/src/components/Project/Locale_listing_container.vue
===================================================================
--- ReserveNGo-frontend/src/components/Project/Locale_listing_container.vue	(revision 4446c6f1a98d080a7c8ad0fe599e8ce1d4eb55d6)
+++ ReserveNGo-frontend/src/components/Project/Locale_listing_container.vue	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
@@ -4,5 +4,19 @@
 
 export default defineComponent({
-  components: { Local_in_local_listing }
+  components: { Local_in_local_listing },
+
+
+  data(){
+    return {
+      locale: {
+        name: 'Restaurant name',
+        address: 'Restaurant address',
+        workingHours: '00:00',
+        availableServices: ['pet Friendly', 'WiFI'],
+        averageRating: 0
+      }
+    }
+  }
+
 })
 
@@ -13,9 +27,15 @@
 
   <div id="container" class="border">
+
+    <div v-for="locale_ in 5" :key="locale_">
+
+      <Local_in_local_listing :name="locale.name+locale_" :address="locale.address+locale_" :workingHours="locale.workingHours+locale_" />
+<!--      <Local_in_local_listing/>-->
+    </div>
+
+<!--    <Local_in_local_listing/>
     <Local_in_local_listing/>
     <Local_in_local_listing/>
-    <Local_in_local_listing/>
-    <Local_in_local_listing/>
-    <Local_in_local_listing/>
+    <Local_in_local_listing/>-->
 
 
Index: ReserveNGo-frontend/src/components/Project/My_reservations.vue
===================================================================
--- ReserveNGo-frontend/src/components/Project/My_reservations.vue	(revision 4446c6f1a98d080a7c8ad0fe599e8ce1d4eb55d6)
+++ ReserveNGo-frontend/src/components/Project/My_reservations.vue	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
@@ -1,8 +1,17 @@
 <script setup>
 
+import reservation_ from '@/components/Project/reservation_.vue'
 </script>
 
 <template>
-<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloremque doloribus eos facere optio quam totam, voluptate! A adipisci ducimus enim labore magni molestias nihil, quasi, quos reprehenderit saepe tenetur ullam.</p>
+
+  <div id="container " class="border container-xxl">
+
+    <reservation_/>
+    <reservation_/>
+    <reservation_/>
+    <reservation_/>
+
+  </div>
 </template>
 
Index: ReserveNGo-frontend/src/components/Project/Nav_bar_new.vue
===================================================================
--- ReserveNGo-frontend/src/components/Project/Nav_bar_new.vue	(revision 4446c6f1a98d080a7c8ad0fe599e8ce1d4eb55d6)
+++ ReserveNGo-frontend/src/components/Project/Nav_bar_new.vue	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
@@ -42,5 +42,5 @@
   <!-- navbar -->
 
-  <nav class="navbar navbar-expand-md navbar-light pt-1 pb-4">
+  <nav class="navbar navbar-expand-md navbar-light pt-1 pb-4 ">
     <div class="container-xxl">
       <!-- navbar brand / title -->
@@ -59,15 +59,15 @@
         <ul class="navbar-nav">
           <li class="nav-item">
-            <router-link to="/topics" class="nav-link">Омилени Локали </router-link>
+            <router-link to="/favourite_locals" class="nav-link">Омилени Локали </router-link>
           </li>
           <li class="nav-item">
-            <router-link to="/my_reservations" class="nav-link">Омилени Локали </router-link>
+            <router-link to="/my_reservations" class="nav-link">Мои резервации </router-link>
           </li>
           <li class="nav-item ms-2 d-none d-md-inline">
-            <router-link to="/login">
-            <a class="btn btn-secondary">Најави се</a>
+            <router-link to="/login" >
+            <a class="btn btn-dark">Најави се</a>
             </router-link>
             <router-link to="/register">
-            <a class="btn btn-secondary ms-2">Регистрирај се</a>
+            <a class="btn btn-dark ms-2">Регистрирај се</a>
             </router-link>
           </li>
@@ -91,4 +91,8 @@
   height: 5%;
 }
+nav{
+  background: #8377D1;
+}
+
 
 
Index: ReserveNGo-frontend/src/components/Project/favourite_locals.vue
===================================================================
--- ReserveNGo-frontend/src/components/Project/favourite_locals.vue	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
+++ ReserveNGo-frontend/src/components/Project/favourite_locals.vue	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
@@ -0,0 +1,13 @@
+<script setup>
+
+</script>
+
+<template>
+
+  <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div>
+
+</template>
+
+<style scoped>
+
+</style>
Index: ReserveNGo-frontend/src/components/Project/home_.vue
===================================================================
--- ReserveNGo-frontend/src/components/Project/home_.vue	(revision 4446c6f1a98d080a7c8ad0fe599e8ce1d4eb55d6)
+++ ReserveNGo-frontend/src/components/Project/home_.vue	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
@@ -37,3 +37,5 @@
 <style scoped>
 
+
+
 </style>
Index: ReserveNGo-frontend/src/components/Project/local_in_local_listing.vue
===================================================================
--- ReserveNGo-frontend/src/components/Project/local_in_local_listing.vue	(revision 4446c6f1a98d080a7c8ad0fe599e8ce1d4eb55d6)
+++ ReserveNGo-frontend/src/components/Project/local_in_local_listing.vue	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
@@ -1,4 +1,6 @@
 <script>
 
+
+import { restaurantStore } from '@/PiniaStores/restaurantStore.js'
 
 export default {
@@ -7,12 +9,40 @@
     return {
 
-      locale:{
+      /*locale:{
         name: "Restaurant name",
         address: "Restaurant address",
-      }
+      }*/
+
+
+    }
+  },
+  props: {
+    name: {
+      type: String,
+      required: true,
+      default: "Restaurant name" // Default value if no prop is passed
+    },
+    address: {
+      type: String,
+      required: true,
+      default: "Restaurant address"
+    },
+    workingHours: {
+      type: String,
+      required: false,
+      default: "Working hours not provided"
+    }
+  },
+
+  methods: {
+    handleClick() {
+      //alert(`Clicked on ${this.name}`);
+      let restaurantStore_ = restaurantStore()
+
+      restaurantStore_.setDetails(this.name, this.address, this.workingHours)
+
 
     }
   }
-
 
 }
@@ -24,7 +54,7 @@
 <template>
 
-  <div id="container" class="border my-3 p-2">
-<h3>{{locale.name}}</h3>
-  <h5>{{locale.address}}</h5>
+  <div id="container" class="border my-3 p-2" @click="handleClick()">
+<h3>{{name}}</h3>
+  <h5>{{address}}</h5>
 
   </div>
@@ -38,4 +68,5 @@
 
 
+
 }
 
Index: ReserveNGo-frontend/src/components/Project/login_.vue
===================================================================
--- ReserveNGo-frontend/src/components/Project/login_.vue	(revision 4446c6f1a98d080a7c8ad0fe599e8ce1d4eb55d6)
+++ ReserveNGo-frontend/src/components/Project/login_.vue	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
@@ -4,8 +4,29 @@
 
 <template>
-  <input type="email">
-  <label for="email">Email</label>
-  <input type="password">
-  <label for="password">Password</label>
+
+
+  <div class="container-xxl">
+
+    <div class="row justify-content-center  ">
+
+      <div class="col-3">
+        <form action="" method="POST">
+
+      <label for="email" class="form-label">Email</label>
+      <input name="email" id="email" class="form-control" type="email">
+
+      <label for="password" class="form-label">Password</label>
+      <input name="password" id="password" type="password" class="form-control">
+
+        <button type="submit" class="btn btn-dark mt-2">Login</button>
+        </form>
+      </div>
+
+
+
+    </div>
+
+
+  </div>
 </template>
 
Index: ReserveNGo-frontend/src/components/Project/register_.vue
===================================================================
--- ReserveNGo-frontend/src/components/Project/register_.vue	(revision 4446c6f1a98d080a7c8ad0fe599e8ce1d4eb55d6)
+++ ReserveNGo-frontend/src/components/Project/register_.vue	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
@@ -4,14 +4,34 @@
 
 <template>
-  <input type="text" id="name">
-  <label for="name">Name</label>
-  <input type="text" id="surname">
-  <label for="surname">Surname</label>
-  <input type="text" id="phone_number">
-  <label for="phone_number">Phone Number</label>
-  <input type="email" id="email">
-  <label for="email">Email Address</label>
-  <input type="password" id="password">
-  <label for="password">Password</label>
+  <div class="container-xxl">
+    <div class="row justify-content-center">
+
+
+  <div class="col-3">
+    <form action="" method="POST">
+      <label for="name" class="form-label" >Name</label>
+      <input type="text" id="name" name="name" class="form-control" placeholder="Name" required>
+
+      <label for="surname" class="form-label">Surname</label>
+      <input type="text" id="surname" name="surname" class="form-control" placeholder="Surname" required>
+
+      <label for="phone_number" class="form-label">Phone Number</label>
+      <input type="text" id="phone_number" name="phone-number" class="form-control" required>
+
+      <label for="email" class="form-label">Email Address</label>
+      <input type="email" id="email" name="email" class="form-control" placeholder="someone@example.com" required>
+
+      <label for="password" class="form-label">Password</label>
+      <input type="password" id="password" name="password" class="form-control">
+
+      <button type="submit" class="btn btn-dark">Register</button>
+    </form>
+    </div>
+
+    </div>
+
+
+  </div>
+
 </template>
 
Index: ReserveNGo-frontend/src/components/Project/reservation_.vue
===================================================================
--- ReserveNGo-frontend/src/components/Project/reservation_.vue	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
+++ ReserveNGo-frontend/src/components/Project/reservation_.vue	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
@@ -0,0 +1,44 @@
+<script>
+
+
+export default {
+
+  data(){
+    return {
+
+      reservation:{
+        id: "res_id",
+        time: "time_of_reservation",
+      }
+
+    }
+  },
+  props:[]
+
+
+}
+
+
+
+</script>
+
+<template>
+
+  <div id="container" class="border my-3 p-2">
+    <h3>{{reservation.id}}</h3>
+    <h5>{{reservation.time}}</h5>
+
+  </div>
+</template>
+
+<style scoped>
+
+#container{
+
+  height: 10vh;
+
+
+}
+
+
+</style>
Index: ReserveNGo-frontend/src/router/index.js
===================================================================
--- ReserveNGo-frontend/src/router/index.js	(revision 4446c6f1a98d080a7c8ad0fe599e8ce1d4eb55d6)
+++ ReserveNGo-frontend/src/router/index.js	(revision f9ef3e8ed6c0f2e543145610d75ecbb5d74424b1)
@@ -1,8 +1,10 @@
 import { createRouter, createWebHistory } from 'vue-router'
 
-import My_reservations from '@/components/Project/My_reservations.vue'
+
 import home_ from '@/components/Project/home_.vue'
 import login_ from '@/components/Project/login_.vue'
 import register_ from '@/components/Project/register_.vue'
+import favourite_locals from '@/components/Project/favourite_locals.vue'
+import my_reservations from '@/components/Project/My_reservations.vue'
 
 const router = createRouter({
@@ -10,11 +12,16 @@
   routes: [
     {
-      path: '/topics',
-      name: 'my_reservations',
-      component: My_reservations,
+      path: '/favourite_locals',
+      name: 'favourite_locals',
+      component: favourite_locals,
       // route level code-splitting
       // this generates a separate chunk (About.[hash].js) for this route
       // which is lazy-loaded when the route is visited.
 
+    },
+    {
+      path: '/my_reservations',
+      name: 'my reservations',
+      component: my_reservations,
     },
     {