added room invites to DB, and minor frontend layout changes

src/App.vue

@@ -1,9 +1,33 @@
 <template>
   <div id="page">
     <router-view />
+
+    <div id="absolute">
+      <button class="logout" @click="logout()">Logout</button>
+
+      <router-link to="." class="button">
+        Home
+      </router-link>
+
+      <router-link to="/friendlist" class="button">
+        Friendlist
+      </router-link>
+    </div>
   </div>
 </template>
 
+<script setup lang="ts">
+import { useRouter } from 'vue-router'
+import { logout as authLogout } from './stores/auth.ts'
+
+const router = useRouter()
+
+function logout() {
+  authLogout()
+  router.push('/login')
+}
+</script>
+
 <style scoped>
 #page {
   display: flex;
@@ -15,6 +39,13 @@
   background: var(--background);
 }
 
+#absolute {
+  position: absolute;
+  left: 0;
+  top: 0;
+  margin: 30px;
+}
+
 @media screen and (max-width: 720px) {
   #page {
     padding: 0;

src/base.css

@@ -52,7 +52,7 @@ input:focus, textarea:focus {
   border-color: var(--accent);
 }
 
-button {
+button, .button {
   font-size: 1rem;
   background: var(--accent);
   color: #0b0d12;
@@ -61,9 +61,11 @@ button {
   padding: 0.6rem 1rem;
   font-weight: 600;
   cursor: pointer;
+  text-decoration: none;
+  margin: 5px;
 }
 
-button:hover {
+button:hover, .button:hover {
   background: var(--accent-hover);
 }
 

src/pages/RoomsPage.vue

@@ -7,10 +7,6 @@
 
     <CreateRoomModal v-if="showCreate" @close="showCreate = false" @created="rooms.push($event)" />
 
-    <router-link to="/friendlist">
-      to friendlist
-    </router-link>
-
     <ul class="rooms-list">
       <li v-for="room in rooms" :key="room.uuid" class="room-item">
         <router-link class="room-link" :to="`/rooms/${room.uuid}`">
@@ -18,35 +14,24 @@
         </router-link>
       </li>
     </ul>
-
-    <button class="logout" @click="logout()">Logout</button>
   </div>
 </template>
 
 <script setup lang="ts">
 import { onMounted, ref } from 'vue'
-import { useRouter } from 'vue-router'
+import { initAuth } from '../stores/auth.ts'
-import { initAuth, logout as authLogout } from '../stores/auth.ts'
 import { fetchRooms } from '../api/rooms'
 import type { Room } from '../types/api'
 import CreateRoomModal from '../components/CreateRoomModal.vue'
 
 const showCreate = ref(false)
 
-
-const router = useRouter()
-
 const rooms = ref<Room[]>([])
 
 onMounted(async () => {
   const auth = await initAuth()
   rooms.value = await fetchRooms(auth.uuid!)
 })
-
-function logout() {
-  authLogout()
-  router.push('/login')
-}
 </script>
 
 <style scoped>
@@ -96,13 +81,6 @@ function logout() {
   background: rgba(255, 255, 255, 0.03);
 }
 
-.logout {
-  position: absolute;
-  left: 0;
-  top: 0;
-  margin: 30px;
-}
-
 .owner {
   font-weight: normal;
   opacity: 0.7;