diff --git a/client/src/views/Login.vue b/client/src/views/Login.vue
index 9f21ab0..f5650d0 100644
--- a/client/src/views/Login.vue
+++ b/client/src/views/Login.vue
@@ -1,13 +1,18 @@
 <script setup lang="ts">
-import { ref } from 'vue'
+import { ref, computed } from 'vue'
 import { state } from '../state';
 import router from '../router'
 
 const name = ref("")
 const password = ref("")
+const signUpWait = ref(false)
+const loginWait = ref(false)
+const signUpClass = computed(() => `submit button is-success ${signUpWait ? 'is-loading' : ''}`)
+const loginClass = computed(() => `submit button is-success ${loginWait ? 'is-loading' : ''}`)
 
 async function signUp() {
     const $name = name.value
+    signUpWait.value = true
     const result = await fetch("/api/v1/auth", {
         method: 'POST',
         body: JSON.stringify({ name: $name, password: password.value }),
@@ -22,6 +27,7 @@ async function signUp() {
 
 async function login() {
     const $name = name.value
+    loginWait.value = true
     const result = await fetch("/api/v1/auth", {
         method: 'PUT',
         body: JSON.stringify({ name: $name, password: password.value }),
@@ -58,8 +64,8 @@ async function login() {
                 </div>
             </section>
             <footer class="modal-card-foot">
-                <button class="submit button is-success" @click="login">Log in</button>
-                <button class="submit button is-info" @click="signUp">Sign Up</button>
+                <button :class="loginClass" @click="login">Log in</button>
+                <button :class="signUpClass" @click="signUp">Sign Up</button>
             </footer>
         </div>
     </div>