Model: Qwen 3.6 35B A3

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
This commit is contained in:
Darius Rapalis
2026-04-28 20:41:14 +03:00
parent fdfe3cd7c7
commit 646164c85d
7 changed files with 142 additions and 112 deletions

View File

@@ -31,7 +31,7 @@ defineProps<{
<div
v-if="status"
class="mb-4 text-center text-sm font-medium text-green-600"
class="mb-2 text-center text-sm font-medium text-green-600"
>
{{ status }}
</div>
@@ -40,32 +40,33 @@ defineProps<{
v-bind="store.form()"
:reset-on-success="['password']"
v-slot="{ errors, processing }"
class="flex flex-col gap-6"
class="flex flex-col gap-5"
>
<div class="grid gap-6">
<div class="grid gap-5">
<div class="grid gap-2">
<Label for="email">Email address</Label>
<Label for="email" class="text-sm font-medium text-[#333]">Email address</Label>
<Input
id="email"
type="email"
name="email"
required
autofocus
:tabindex="1"
tabindex="1"
autocomplete="email"
placeholder="email@example.com"
class="h-11 bg-[#f2f6f8] border-[#e9e9ed] text-[#0a0e10] placeholder:text-[#9ba8b0] focus:bg-white focus:border-[#03a9f4] focus:ring-[#03a9f4]"
/>
<InputError :message="errors.email" />
</div>
<div class="grid gap-2">
<div class="flex items-center justify-between">
<Label for="password">Password</Label>
<Label for="password" class="text-sm font-medium text-[#333]">Password</Label>
<TextLink
v-if="canResetPassword"
:href="request()"
class="text-sm"
:tabindex="5"
class="text-sm text-[#03a9f4] hover:text-[#0288d1]"
tabindex="5"
>
Forgot password?
</TextLink>
@@ -74,38 +75,45 @@ defineProps<{
id="password"
name="password"
required
:tabindex="2"
tabindex="2"
autocomplete="current-password"
placeholder="Password"
class="bg-[#f2f6f8] border-[#e9e9ed] text-[#0a0e10] placeholder:text-[#9ba8b0] focus:bg-white focus:border-[#03a9f4] focus:ring-[#03a9f4]"
/>
<InputError :message="errors.password" />
</div>
<div class="flex items-center justify-between">
<Label for="remember" class="flex items-center space-x-3">
<Checkbox id="remember" name="remember" :tabindex="3" />
<span>Remember me</span>
<div class="flex items-center">
<Label for="remember" class="flex items-center space-x-2 cursor-pointer">
<Checkbox
id="remember"
name="remember"
tabindex="3"
class="border-[#e9e9ed] data-[checked]:border-[#03a9f4] data-[checked]:bg-[#03a9f4] focus:ring-[#03a9f4]"
/>
<span class="text-sm text-[#546e7a]">Remember me</span>
</Label>
</div>
<Button
type="submit"
class="mt-4 w-full"
:tabindex="4"
class="h-11 w-full bg-[#03a9f4] hover:bg-[#0298dd] text-base font-medium"
tabindex="4"
:disabled="processing"
data-test="login-button"
>
<Spinner v-if="processing" />
Log in
<span v-else>Log in</span>
</Button>
</div>
<div
class="text-center text-sm text-muted-foreground"
v-if="canRegister"
>
<div class="text-center text-sm text-[#607d8b]">
Don't have an account?
<TextLink :href="register()" :tabindex="5">Sign up</TextLink>
<TextLink
:href="register()"
tabindex="5"
class="text-[#03a9f4] hover:text-[#0288d1] decoration-transparent hover:decoration-current underline-offset-4"
>Sign up</TextLink>
</div>
</Form>
</template>