101 lines
4.3 KiB
HTML
Executable File
101 lines
4.3 KiB
HTML
Executable File
<html lang="en">
|
|
|
|
<head>
|
|
<script>
|
|
window.FontAwesomeConfig = {
|
|
autoReplaceSvg: 'nest'
|
|
};
|
|
</script>
|
|
<script
|
|
src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/js/all.min.js"
|
|
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport"
|
|
content="width=device-width, initial-scale=1, viewport-fit=cover">
|
|
<title>Create Account — TrimTime</title>
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<link rel="stylesheet"
|
|
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
|
<script>
|
|
tailwind.config = {
|
|
theme:
|
|
{
|
|
extend:
|
|
{
|
|
colors:
|
|
{
|
|
ink: '#111b15',
|
|
stone: '#f4f6f4',
|
|
surface: '#ffffff',
|
|
muted: '#6c7870',
|
|
line: '#e1e7e2',
|
|
accent: '#10b981'
|
|
},
|
|
fontFamily:
|
|
{
|
|
sans: ['Inter', 'sans-serif']
|
|
},
|
|
borderRadius:
|
|
{
|
|
jumbo: '1rem',
|
|
tile: '0.75rem'
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
</head>
|
|
|
|
<body class="bg-stone text-ink min-h-screen flex flex-col px-6 py-12">
|
|
<div class="flex-1 max-w-md mx-auto w-full h-[500px] block" id="igc4">
|
|
<header class="mb-10"><button onclick="history.back()"
|
|
class="w-10 h-10 rounded-full border border-line flex items-center justify-center mb-8"><i
|
|
class="fa-solid fa-arrow-left text-sm"></i></button>
|
|
<h1 class="text-3xl font-bold tracking-tight">Create Account</h1>
|
|
<p class="text-muted mt-2">Join TrimTime to track your appointments and
|
|
loyalty.</p>
|
|
</header>
|
|
<form class="space-y-4">
|
|
<div class="grid grid-cols-2 gap-4">
|
|
<div><label
|
|
class="block text-[10px] font-bold uppercase tracking-widest text-muted mb-2 ml-1">First
|
|
Name</label><input type="text" placeholder="John"
|
|
class="w-full bg-surface border border-line rounded-xl px-5 py-4 focus:ring-2 focus:ring-ink outline-none transition-all">
|
|
</div>
|
|
<div><label
|
|
class="block text-[10px] font-bold uppercase tracking-widest text-muted mb-2 ml-1">Last
|
|
Name</label><input type="text" placeholder="Doe"
|
|
class="w-full bg-surface border border-line rounded-xl px-5 py-4 focus:ring-2 focus:ring-ink outline-none transition-all">
|
|
</div>
|
|
</div>
|
|
<div><label
|
|
class="block text-[10px] font-bold uppercase tracking-widest text-muted mb-2 ml-1">Email
|
|
Address</label><input type="email" placeholder="name@example.com"
|
|
class="w-full bg-surface border border-line rounded-xl px-5 py-4 focus:ring-2 focus:ring-ink outline-none transition-all">
|
|
</div>
|
|
<div><label
|
|
class="block text-[10px] font-bold uppercase tracking-widest text-muted mb-2 ml-1">Phone
|
|
Number</label><input type="tel" placeholder="+1 (555) 000-0000"
|
|
class="w-full bg-surface border border-line rounded-xl px-5 py-4 focus:ring-2 focus:ring-ink outline-none transition-all">
|
|
</div>
|
|
<div><label
|
|
class="block text-[10px] font-bold uppercase tracking-widest text-muted mb-2 ml-1">Password</label><input
|
|
type="password" placeholder="••••••••"
|
|
class="w-full bg-surface border border-line rounded-xl px-5 py-4 focus:ring-2 focus:ring-ink outline-none transition-all">
|
|
</div>
|
|
<p class="text-[10px] text-muted leading-relaxed px-1">
|
|
By creating an account, you agree to our <a href="#"
|
|
class="underline">Terms of Service</a> and <a href="#"
|
|
class="underline">Privacy Policy</a>.
|
|
</p><button type="button" onclick="location.href='Verify__mobile.html'"
|
|
class="w-full bg-ink text-white py-5 rounded-full font-bold uppercase tracking-widest hover:bg-black transition-all shadow-lg mt-4">
|
|
Sign Up
|
|
</button>
|
|
</form>
|
|
<p class="mt-10 text-center text-sm text-muted">
|
|
Already have an account? <a href="Login__mobile.html"
|
|
class="text-ink font-bold border-b border-ink">Log in</a></p>
|
|
</div>
|
|
</body>
|
|
|
|
</html> |