cpularp-manager-frontend/src/views/UserDashboard.vue

<script lang="ts" setup>
import UserInfo from '@/components/UserInfo.vue'
import { onMounted } from 'vue'
import { update_info } from '@/ts/user_info'

onMounted(update_info)
</script>

<template>
  <div class="bg-black">
    <div class="min-h-screen p-2 md:p-4">
      <div
        class="container max-w-3xl p-4 mx-auto space-y-2 font-mono text-white bg-primary min-w-xs md:space-y-4"
      >
        <div class="p-2 bg-secondary md:p-4 ring-2 ring-secondary/80">
          <div class="bg-primary ring-2 ring-primary/80">
            <div
              class="flex flex-col w-full h-full p-2 space-x-4 rounded-sm space-2 drop-shadow-md drop-shadow-accent"
            >
              <h1 class="text-md md:text-xl">> USER AUTHENTICATED</h1>
            </div>
          </div>
        </div>
        <div class="p-2 bg-secondary md:p-4 ring-2 ring-secondary/80">
          <UserInfo></UserInfo>
        </div>
        <a
          class="flex w-full p-2 font-mono text-lg md:p-4 md:text-2xl bg-secondary ring-2 ring-secondary/80 h-fit0 hover:bg-secondary/50"
          href="http://localhost:31337/logout"
        >
          <div class="w-full h-full text-center bg-primary">
            <p class="drop-shadow-accent drop-shadow-md">Logout</p>
          </div>
        </a>
      </div>
    </div>
  </div>
</template>