Updated color scheme and identity

2025-08-03 19:42:43 +02:00
parent 0c96466263
commit 6aad01c96f
24 changed files with 146 additions and 127 deletions
--- a/app/pages/about.vue
+++ b/app/pages/about.vue
@@ -3,6 +3,10 @@ import { PhCircleNotch } from '@phosphor-icons/vue'

 const { locale } = useI18n()

+definePageMeta({
+  layout: "public"
+})
+
 const { data: page, refresh, status } = useLazyAsyncData(`about-content-${locale}`, () => {
  return queryCollection("sections").path(`/sections/${locale.value}/legal`).first()
 })
--- a/app/pages/explore.vue
+++ b/app/pages/explore.vue
@@ -2,7 +2,7 @@
 import type { Calendar } from "@@/models/CalendarConfig";

 definePageMeta({
-  middleware: ["reset-menu"]
+  layout: "public"
 })

 // const { data: availableCalendars, status: calendarStatus } = useLazyFetch<{ data: Calendar[] }>("/api/calendars/query", { key: "explore-calendars", query: { full: true } })
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -4,12 +4,33 @@ useHead({
 })

 definePageMeta({
-  middleware: ["reset-menu"]
+  layout: "public"
 })
+
+const { auth } = useSupabaseClient()
+const user = useSupabaseUser()
+const profileUrl: string = `${useRequestURL().origin}/my/`
+
+async function handleGoogleLogin() {
+  const { error } = await auth.signInWithOAuth({
+    provider: "google",
+    options: {
+      queryParams: {
+        access_type: "offline",
+        prompt: "consent"
+      },
+      redirectTo: profileUrl
+    }
+  })
+
+  if (error) {
+    console.log(error.message)
+  }
+}
 </script>

 <template>
-  <main class="py-8 px-5 md:px-8">
+  <main class="h-full grid place-items-center py-8 px-5 md:px-8">
    <Head>
      <Title>
        TTTools — {{ $t('head.title') }}
@@ -17,6 +38,22 @@ definePageMeta({
      <Meta name="description" :content="$t('head.description')" />
    </Head>

-    <Heading level="h1">TTTools</Heading>
+    <div class="py-8 md:py-24 px-4">
+      <div class="flow text-center max-w-2xl mx-auto">
+        <h1 class="text-3xl md:text-5xl font-bold md:font-semibold">A home for your creativity</h1>
+        <p class="text-sm">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Ipsam eos rem accusantium voluptates? Inventore dolorum reprehenderit quibusdam consequatur, totam iusto velit neque dolor dicta possimus cum, deleniti, saepe expedita culpa!</p>
+
+        <TransitionGroup name="fade-group" appear>
+          <UiButton v-if="user" as-child>
+            <NuxtLink to="/my">
+              Dashboard
+            </NuxtLink>
+          </UiButton>
+          <UiButton v-else @click="handleGoogleLogin">
+            Log in
+          </UiButton>
+        </TransitionGroup>
+      </div>
+    </div>
  </main>
 </template>