Compare commits

...

2 Commits

Author SHA1 Message Date
Tom Trappmann
b3685e2048 bug fixing 2026-02-02 23:00:18 +01:00
Tom Trappmann
84467c42c7 Fix font import order 2026-02-02 22:53:47 +01:00
5 changed files with 43 additions and 33 deletions

View File

@@ -204,14 +204,13 @@ For every logical change:
1. Make the change
2. `git status` must be clean after commit
3. Commit with a concise imperative message
4. Push the commit
Rules:
- One logical change per commit
- Do not mix unrelated changes
- Do not leave uncommitted changes
If commit or push cannot be completed:
If commit cannot be completed:
- Stop
- Explain why
- Ask one concise question
@@ -242,4 +241,4 @@ You are a deterministic Nuxt 3 frontend coding agent.
Build against mock data when the API is not available.
Integrate with FastAPI via runtime-configured base URLs.
Use JWT auth via Bearer tokens when endpoints are defined.
Maintain clean git history with commit+push for each change.
Maintain clean git history with commit for each change.

View File

@@ -9,5 +9,14 @@
</template>
<script setup lang="ts">
useHead({
link: [
{ rel: "preconnect", href: "https://fonts.googleapis.com" },
{ rel: "preconnect", href: "https://fonts.gstatic.com", crossorigin: "anonymous" },
{
rel: "stylesheet",
href: "https://fonts.googleapis.com/css2?family=Sora:wght@300;400;500;600;700&display=swap",
},
],
})
</script>

View File

@@ -1,6 +1,5 @@
@import "tailwindcss";
@import "@nuxt/ui";
@import url("https://fonts.googleapis.com/css2?family=Sora:wght@300;400;500;600;700&display=swap");
body {
font-family: "Sora", "Avenir Next", "Trebuchet MS", sans-serif;

View File

@@ -0,0 +1,5 @@
<template>
<div>
<slot />
</div>
</template>

View File

@@ -7,9 +7,11 @@
<div class="absolute inset-0 bg-[radial-gradient(circle_at_top,_rgba(15,23,42,0.2),_rgba(2,6,23,0.9))]" />
</div>
<div class="relative mx-auto flex min-h-screen max-w-6xl flex-col justify-center gap-12 px-6 py-12 lg:flex-row lg:items-center">
<div
class="relative mx-auto flex min-h-screen max-w-6xl flex-col justify-center gap-12 px-6 py-12 lg:flex-row lg:items-center">
<section class="flex-1 space-y-6 animate-rise">
<div class="inline-flex items-center gap-3 rounded-full border border-white/10 bg-white/5 px-4 py-2 text-xs uppercase tracking-[0.2em] text-white/70">
<div
class="inline-flex items-center gap-3 rounded-full border border-white/10 bg-white/5 px-4 py-2 text-xs uppercase tracking-[0.2em] text-white/70">
<span class="h-2 w-2 rounded-full bg-emerald-400 shadow-[0_0_16px_rgba(52,211,153,0.9)]" />
Shift-Ready
</div>
@@ -17,7 +19,8 @@
Keep every shift aligned, effortless, and on time.
</h1>
<p class="max-w-xl text-base text-white/70">
Nautilus DeskTime is the calm command center for employee schedules. Secure access keeps the crew in sync while the app does the heavy lifting.
Nautilus DeskTime is the calm command center for employee schedules. Secure access keeps the crew in
sync while the app does the heavy lifting.
</p>
<div class="flex flex-wrap items-center gap-4 text-sm text-white/70">
<div class="flex items-center gap-2 rounded-full border border-white/10 bg-white/5 px-3 py-1">
@@ -36,7 +39,8 @@
</section>
<section class="flex w-full max-w-md flex-1 items-center justify-center">
<div class="w-full rounded-3xl border border-white/10 bg-white/10 p-8 shadow-[0_30px_60px_rgba(2,6,23,0.6)] backdrop-blur animate-rise-delayed">
<div
class="w-full rounded-3xl border border-white/10 bg-white/10 p-8 shadow-[0_30px_60px_rgba(2,6,23,0.6)] backdrop-blur animate-rise-delayed">
<div class="space-y-2">
<p class="text-sm uppercase tracking-[0.3em] text-white/60">Welcome back</p>
<h2 class="text-2xl font-semibold">Log in to your shift hub</h2>
@@ -48,28 +52,21 @@
<span>Email address</span>
<input
class="w-full rounded-2xl border border-white/10 bg-white/5 px-4 py-3 text-base text-white placeholder:text-white/40 focus:border-emerald-300 focus:outline-none focus:ring-2 focus:ring-emerald-300/40"
type="email"
name="email"
placeholder="you@company.com"
autocomplete="email"
required
/>
type="email" name="email" placeholder="you@company.com" autocomplete="email" required />
</label>
<label class="block space-y-2 text-sm text-white/70">
<span>Password</span>
<input
class="w-full rounded-2xl border border-white/10 bg-white/5 px-4 py-3 text-base text-white placeholder:text-white/40 focus:border-cyan-300 focus:outline-none focus:ring-2 focus:ring-cyan-300/40"
type="password"
name="password"
placeholder="••••••••"
autocomplete="current-password"
required
/>
type="password" name="password" placeholder="••••••••" autocomplete="current-password"
required />
</label>
<div class="flex items-center justify-between text-sm text-white/60">
<label class="inline-flex items-center gap-2">
<input class="h-4 w-4 rounded border-white/20 bg-white/10 text-emerald-300 focus:ring-emerald-300/40" type="checkbox" />
<input
class="h-4 w-4 rounded border-white/20 bg-white/10 text-emerald-300 focus:ring-emerald-300/40"
type="checkbox" />
Remember me
</label>
<button class="text-sm font-medium text-emerald-200 hover:text-emerald-100" type="button">
@@ -79,10 +76,10 @@
<button
class="group flex w-full items-center justify-center gap-3 rounded-2xl bg-emerald-300 px-4 py-3 text-sm font-semibold uppercase tracking-[0.25em] text-slate-900 transition hover:bg-emerald-200"
type="submit"
>
type="submit">
Log in
<span class="inline-flex h-7 w-7 items-center justify-center rounded-full bg-slate-900/10 text-slate-900 transition group-hover:translate-x-1">
<span
class="inline-flex h-7 w-7 items-center justify-center rounded-full bg-slate-900/10 text-slate-900 transition group-hover:translate-x-1">
</span>
</button>
@@ -104,6 +101,7 @@
opacity: 0;
transform: translateY(18px);
}
to {
opacity: 1;
transform: translateY(0);