diff --git a/package.json b/package.json
index bafe987..a6681c6 100644
--- a/package.json
+++ b/package.json
@@ -26,5 +26,6 @@
     "typescript": "^4.5.4",
     "vite": "^2.9.9",
     "vue-tsc": "^0.34.7"
-  }
+  },
+  "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
 }
diff --git a/src/components/CharacterCard.vue b/src/components/CharacterCard.vue
index e297056..8732ec0 100644
--- a/src/components/CharacterCard.vue
+++ b/src/components/CharacterCard.vue
@@ -36,7 +36,7 @@ watch(invs.value,()=>{
   const currentInv = invs.value.get(props.character)
   if(currentInv){
     if(currentInv.galders){
-      galders.value = currentInv.galders
+      galders.value = currentInv.galders || currentInv.money
     }
     items.value = Object.values(currentInv.items).length
   }
diff --git a/src/pages/login.tsx b/src/pages/login.tsx
new file mode 100644
index 0000000..dc3b544
--- /dev/null
+++ b/src/pages/login.tsx
@@ -0,0 +1,91 @@
+<template>
+  <div> {{loginString}} </div>
+  <section class="login_modal">
+    <div class="login_field">
+      <label for="userName">Username: </label>
+      <input
+        type="text"
+        id="login-username"
+        v-model="username"
+        required
+        />
+    </div>
+    <div class="login_field">
+      <label for="password">Password: </label>
+      <input
+        type="password"
+        id="login-password"
+        v-model="password"
+        required
+        />
+    </div>
+    <div class="login_field">
+      <button
+        type="button"
+        id="loginButton"
+        v-on:click="login()"
+        >Login</button>
+
+      <button
+        type="button"
+        id="logoutButton"
+        v-on:click="logout()"
+        >Logout</button>
+    </div>
+
+  </section>
+</template>
+<script lang="ts" setup>
+const username = ref("")
+const password = ref("")
+const loginString = ref("not logged in")
+
+const login = () => {
+  new LoginHelper(username.value, password.value).login()
+    .then((session)=>{
+      console.log(session, "adding to storage")
+      storage.AddSession(session)
+      window.location.reload()
+    }).catch((e)=>{
+      if(e.code == "ERR_BAD_REQUEST") {
+        alert("invalid username/password")
+        return
+      }
+      alert("unknown error, please report")
+      console.log(e)
+    })
+}
+
+const logout = () => {
+  new LogoutHelper().logout().then(()=>{
+    storage.RemoveSession()
+    localStorage.clear()
+    window.location.reload()
+  })
+}
+
+const s = storage.GetSession()
+const api = new LTOApiv0(s)
+if (s != undefined) {
+  username.value = s.user
+}
+
+const updateLogin = () => {
+  api.GetLoggedin().then((res)=>{
+    if(res) {
+      loginString.value = "logged in as " + s.user
+    }
+  })
+}
+updateLogin()
+
+
+</script>
+
+<script lang="ts">
+import { defineComponent, computed, PropType, defineProps, defineEmits, ref} from 'vue';
+import { LTOApiv0 } from '../lib/lifeto';
+import { LoginHelper, LogoutHelper, Session } from '../lib/session';
+import { storage } from '../session_storage';
+
+</script>