3ed92810c3
Prompt: forms for them should be in a container that's white, centerd on screen like forms are right now, just wrapped in white container Stats: Context: 98,313 tokens Time: 17m 47s
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 items-center gap-4 mb-8">
|
|
<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>
|
|
<div class="rounded-2xl bg-white p-8 shadow-sm">
|
|
<div class="space-y-2 text-center mb-6">
|
|
<h1 class="text-2xl font-semibold text-[#333]">{{ title }}</h1>
|
|
<p class="text-sm text-[#607d8b]">
|
|
{{ description }}
|
|
</p>
|
|
</div>
|
|
<slot />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|