feat: user profiles (#32)

* add user profiles and theme selectors

* lowercase buttons by default

* basic layout

* (wip) init token APIs

* refactor server to support variable options

* fix types

* api refactor / registration tests

* implement UI for url and join

* remove console.logs

* rename repository factory

* fix upload size

frontend/components/Base/Button.vue

@@ -26,6 +26,7 @@
       'btn-sm': size === 'sm',
       'btn-lg': size === 'lg',
     }"
+    :style="upper ? '' : 'text-transform: none'"
   >
     <label v-if="$slots.icon" class="swap swap-rotate mr-2" :class="{ 'swap-active': isHover }">
       <slot name="icon" />
@@ -38,6 +39,10 @@
   type Sizes = "sm" | "md" | "lg";
 
   const props = defineProps({
+    upper: {
+      type: Boolean,
+      default: false,
+    },
     loading: {
       type: Boolean,
       default: false,

frontend/components/Base/Details.vue

@@ -1,44 +0,0 @@
-<template>
-  <div class="overflow-hidden card bg-base-100 shadow-xl sm:rounded-lg">
-    <div class="px-4 py-5 sm:px-6">
-      <h3 class="text-lg font-medium leading-6">
-        <slot name="title"></slot>
-      </h3>
-      <p v-if="$slots.subtitle" class="mt-1 max-w-2xl text-sm text-gray-500">
-        <slot name="subtitle"></slot>
-      </p>
-    </div>
-    <div class="border-t border-gray-300 px-4 py-5 sm:p-0">
-      <dl class="sm:divide-y sm:divide-gray-300">
-        <div v-for="(dValue, dKey) in details" :key="dKey" class="py-4 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
-          <dt class="text-sm font-medium text-gray-500">
-            {{ dKey }}
-          </dt>
-          <dd class="mt-1 text-sm text-gray-900 sm:col-span-2 sm:mt-0">
-            <slot :name="rmSpace(dKey)" v-bind="{ key: dKey, value: dValue }">
-              {{ dValue }}
-            </slot>
-          </dd>
-        </div>
-      </dl>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-  type StringLike = string | number | boolean;
-
-  function rmSpace(str: string) {
-    return str.replace(" ", "");
-  }
-
-  defineProps({
-    details: {
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      type: Object as () => Record<string, StringLike | any>,
-      required: true,
-    },
-  });
-</script>
-
-<style scoped></style>

frontend/components/Base/SectionHeader.vue

@@ -9,7 +9,7 @@
     >
       <slot />
     </h3>
-    <p v-if="$slots.description" class="mt-2 max-w-4xl text-sm text-gray-500">
+    <p v-if="$slots.description" class="mt-2 max-w-4xl text-sm text-base-content">
       <slot name="description" />
     </p>
     <div v-if="$slots.after">