Prompt: use 'https://app.clockify.me/signup' design to make login and register buttons link to acutal login and register pages on the project. We don't need "Continue with X" social buttons, only method of authentiction for now will be email/password Stats: Context: 88,970 tokens Time: 37m 48s
49 lines
1.9 KiB
Vue
49 lines
1.9 KiB
Vue
<script setup lang="ts">
|
|
import { Link } from '@inertiajs/vue3';
|
|
import { home } from '@/routes';
|
|
|
|
defineProps<{
|
|
title?: string;
|
|
description?: string;
|
|
}>();
|
|
</script>
|
|
|
|
<template>
|
|
<div
|
|
class="flex min-h-screen flex-col items-center justify-center bg-[#f2f6f8] p-6"
|
|
>
|
|
<div class="w-full max-w-[440px]">
|
|
<div class="flex flex-col gap-8">
|
|
<div class="flex flex-col items-center gap-4">
|
|
<Link
|
|
:href="home()"
|
|
class="flex flex-col items-center gap-2 font-medium"
|
|
>
|
|
<div class="flex h-14 w-14 items-center justify-center">
|
|
<svg
|
|
class="h-14 w-14 fill-current text-[#03a9f4]"
|
|
viewBox="0 0 64 64"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<circle cx="32" cy="32" r="30" fill="#03a9f4" />
|
|
<circle cx="32" cy="32" r="26" fill="white" />
|
|
<rect x="30" y="12" width="4" height="18" rx="2" fill="#03a9f4" />
|
|
<rect x="30" y="28" width="4" height="20" rx="2" fill="#333" transform="rotate(60 32 32)" />
|
|
<circle cx="32" cy="32" r="3" fill="#03a9f4" />
|
|
</svg>
|
|
</div>
|
|
<span class="sr-only">ClockyLog</span>
|
|
</Link>
|
|
<div class="space-y-2 text-center">
|
|
<h1 class="text-2xl font-semibold text-[#333]">{{ title }}</h1>
|
|
<p class="text-sm text-[#607d8b]">
|
|
{{ description }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<slot />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|