f512e1b080
Session Total cost: $6.03 (costs may be inaccurate due to usage of unknown models) Total duration (API): 54m 34s Total duration (wall): 1h 19m 51s Total code changes: 2980 lines added, 195 lines removed Usage by model: qwen/qwen3.6-35b-a3b: 324.5k input, 75.4k output, 12.8m cache read, 0 cache write ($5.96) claude-haiku-4-5: 9.4k input, 13.3k output, 8.3k cache read, 0 cache write ($0.0767) Runtime: llamacpp Model: Qwen 3.6 35B A3B Q4 K M Coding Agent: ClaudeCode
362 lines
16 KiB
PHP
362 lines
16 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Sign up - TimeLog</title>
|
|
<meta name="description" content="Create your free TimeLog account and start tracking time today.">
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap" rel="stylesheet">
|
|
<style>
|
|
:root {
|
|
--primary: #03a9f4;
|
|
--primary-dark: #0287c5;
|
|
--text-dark: #333;
|
|
--text-medium: #546e7a;
|
|
--text-light: #607d8b;
|
|
--text-muted: #9ba8b0;
|
|
--bg-light: #f2f6f8;
|
|
--bg-white: #fff;
|
|
--border-color: #e9e9ed;
|
|
--input-bg: #f2f6f8;
|
|
--input-border: #e9e9ed;
|
|
--input-focus-border: #03a9f4;
|
|
--input-focus-shadow: 0 0 0 1px #03a9f4;
|
|
--error-color: #bf2600;
|
|
--card-shadow: 0 2px 4px rgba(0,0,0,0.1), 0 8px 16px rgba(11,12,14,0.2);
|
|
}
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
body {
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
color: var(--text-dark);
|
|
background: var(--bg-light);
|
|
min-height: 100vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
a { color: var(--primary); text-decoration: none; }
|
|
a:hover { text-decoration: underline; }
|
|
|
|
/* === HEADER === */
|
|
.auth-header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 16px 24px;
|
|
background: var(--bg-light);
|
|
}
|
|
.auth-header .logo {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.auth-header .logo svg {
|
|
height: 32px;
|
|
}
|
|
.auth-header .logo span {
|
|
font-size: 18px;
|
|
font-weight: 700;
|
|
color: var(--text-dark);
|
|
}
|
|
|
|
/* === AUTH FORM CONTAINER === */
|
|
.auth-container {
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 20px;
|
|
}
|
|
.auth-form {
|
|
background: var(--bg-white);
|
|
border-radius: 8px;
|
|
box-shadow: var(--card-shadow);
|
|
width: 100%;
|
|
max-width: 400px;
|
|
padding: 32px 32px 24px;
|
|
}
|
|
.auth-form__logo {
|
|
text-align: center;
|
|
margin-bottom: 20px;
|
|
}
|
|
.auth-form__logo a {
|
|
display: inline-block;
|
|
}
|
|
.auth-form__logo svg {
|
|
height: 40px;
|
|
}
|
|
.auth-form__header {
|
|
text-align: center;
|
|
margin-bottom: 24px;
|
|
}
|
|
.auth-form__header h1 {
|
|
font-size: 24px;
|
|
font-weight: 700;
|
|
color: var(--text-dark);
|
|
margin-bottom: 8px;
|
|
}
|
|
.auth-form__header p {
|
|
font-size: 14px;
|
|
color: var(--text-medium);
|
|
}
|
|
.auth-form__body {
|
|
margin-bottom: 16px;
|
|
}
|
|
|
|
/* === FORM CONTROLS === */
|
|
.form-control {
|
|
margin-bottom: 16px;
|
|
}
|
|
.form-control label {
|
|
display: block;
|
|
font-size: 12px;
|
|
font-weight: 500;
|
|
color: var(--text-medium);
|
|
margin-bottom: 4px;
|
|
}
|
|
.form-control input {
|
|
width: 100%;
|
|
height: 40px;
|
|
padding: 8px 12px;
|
|
font-size: 14px;
|
|
font-family: inherit;
|
|
border: 1px solid var(--input-border);
|
|
border-radius: 4px;
|
|
background: var(--input-bg);
|
|
color: var(--text-dark);
|
|
transition: border-color 0.15s, box-shadow 0.15s;
|
|
outline: none;
|
|
}
|
|
.form-control input:focus {
|
|
border-color: var(--input-focus-border);
|
|
box-shadow: var(--input-focus-shadow);
|
|
background: var(--bg-white);
|
|
}
|
|
.form-control input::placeholder {
|
|
color: var(--text-muted);
|
|
}
|
|
.form-control input.error {
|
|
border-color: var(--error-color);
|
|
}
|
|
|
|
/* === BUTTONS === */
|
|
.btn-primary {
|
|
width: 100%;
|
|
height: 48px;
|
|
background: var(--primary);
|
|
color: #fff;
|
|
font-size: 16px;
|
|
font-weight: 700;
|
|
font-family: inherit;
|
|
border: none;
|
|
border-radius: 8px;
|
|
cursor: pointer;
|
|
transition: background-color 0.2s;
|
|
}
|
|
.btn-primary:hover {
|
|
background: var(--primary-dark);
|
|
}
|
|
.btn-primary:active {
|
|
opacity: 0.9;
|
|
}
|
|
|
|
/* === DIVIDER === */
|
|
.auth-form__divider {
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 20px 0;
|
|
}
|
|
.auth-form__divider::before,
|
|
.auth-form__divider::after {
|
|
content: '';
|
|
flex: 1;
|
|
height: 1px;
|
|
background: var(--border-color);
|
|
}
|
|
.auth-form__divider span {
|
|
padding: 0 12px;
|
|
font-size: 12px;
|
|
color: var(--text-muted);
|
|
text-transform: uppercase;
|
|
font-weight: 500;
|
|
}
|
|
|
|
/* === SOCIAL BUTTONS === */
|
|
.social-buttons {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 8px;
|
|
margin-bottom: 16px;
|
|
}
|
|
.btn-social {
|
|
width: 100%;
|
|
height: 44px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 10px;
|
|
font-size: 14px;
|
|
font-weight: 600;
|
|
font-family: inherit;
|
|
border-radius: 8px;
|
|
cursor: pointer;
|
|
transition: background-color 0.15s;
|
|
}
|
|
.btn-social svg {
|
|
width: 20px;
|
|
height: 20px;
|
|
}
|
|
.btn-google {
|
|
background: var(--bg-white);
|
|
border: 1px solid var(--border-color);
|
|
color: var(--text-dark);
|
|
}
|
|
.btn-google:hover {
|
|
background: #f8f9fa;
|
|
}
|
|
.btn-github {
|
|
background: var(--text-dark);
|
|
border: 1px solid var(--text-dark);
|
|
color: var(--bg-white);
|
|
}
|
|
.btn-github:hover {
|
|
background: #1a1a1a;
|
|
}
|
|
.btn-sso {
|
|
background: var(--bg-white);
|
|
border: 1px solid var(--border-color);
|
|
color: var(--text-dark);
|
|
}
|
|
.btn-sso:hover {
|
|
background: #f8f9fa;
|
|
}
|
|
|
|
/* === FOOTER === */
|
|
.auth-form__footer {
|
|
text-align: center;
|
|
padding-top: 8px;
|
|
border-top: 1px solid var(--border-color);
|
|
}
|
|
.auth-form__footer p {
|
|
font-size: 14px;
|
|
color: var(--text-medium);
|
|
}
|
|
|
|
/* === TERMS === */
|
|
.auth-form__terms {
|
|
font-size: 11px;
|
|
color: var(--text-muted);
|
|
text-align: center;
|
|
margin-top: 12px;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
/* === RESPONSIVE === */
|
|
@media (max-width: 768px) {
|
|
.auth-form {
|
|
max-width: 100%;
|
|
box-shadow: none;
|
|
background: transparent;
|
|
}
|
|
.auth-form__header h1 {
|
|
font-size: 28px;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<!-- === HEADER === -->
|
|
<div class="auth-header">
|
|
<a href="{{ url('/') }}" class="logo">
|
|
<svg height="32" viewBox="0 0 158 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M31.3333 0H8.66667C3.8802 0 0 3.8802 0 8.66667V31.3333C0 36.1198 3.8802 40 8.66667 40H31.3333C36.1198 40 40 36.1198 40 31.3333V8.66667C40 3.8802 36.1198 0 31.3333 0Z" fill="#03A9F4"/>
|
|
<path d="M25.6947 11.3924C26.3928 10.6932 26.2425 9.51811 25.3206 9.16425C24.0343 8.67046 22.6376 8.3999 21.1779 8.3999C14.7823 8.3999 9.59766 13.5934 9.59766 19.9999C9.59766 26.4064 14.7823 31.5999 21.1779 31.5999C22.6286 31.5999 24.017 31.3327 25.2968 30.8447C26.2211 30.4922 26.3728 29.3149 25.6735 28.6144C25.2203 28.1605 24.5345 28.0545 23.9264 28.257C23.0645 28.544 22.1427 28.6995 21.1846 28.6995C16.3879 28.6995 12.4994 24.8043 12.4994 19.9995C12.4994 15.1946 16.3879 11.2995 21.1846 11.2995C22.1496 11.2995 23.0779 11.4571 23.9451 11.7481C24.5537 11.9523 25.2409 11.847 25.6947 11.3924Z" fill="white"/>
|
|
<path d="M22.9294 20.1332C22.9294 20.9432 22.2728 21.5998 21.4628 21.5998C20.6527 21.5998 19.9961 20.9432 19.9961 20.1332C19.9961 19.3232 20.6527 18.6665 21.4628 18.6665C22.2728 18.6665 22.9294 19.3232 22.9294 20.1332Z" fill="white"/>
|
|
<path d="M23.7261 17.8301C23.2007 17.308 23.2007 16.4616 23.7261 15.9395L28.1021 11.5913C28.6274 11.0692 29.4793 11.0692 30.0047 11.5913C30.53 12.1133 30.53 12.9597 30.0047 13.4818L25.6287 17.8301C25.1033 18.3521 24.2515 18.3521 23.7261 17.8301Z" fill="white"/>
|
|
<path d="M23.7261 22.1693C23.2007 22.6914 23.2007 23.5378 23.7261 24.0599L28.1021 28.4082C28.6274 28.9302 29.4793 28.9302 30.0047 28.4082C30.53 27.8861 30.53 27.0397 30.0047 26.5176L25.6287 22.1693C25.1033 21.6473 24.2515 21.6473 23.7261 22.1693Z" fill="white"/>
|
|
</svg>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- === AUTH FORM === -->
|
|
<div class="auth-container">
|
|
<div class="auth-form">
|
|
<div class="auth-form__logo">
|
|
<a href="{{ url('/') }}">
|
|
<svg width="40" viewBox="0 0 158 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M31.3333 0H8.66667C3.8802 0 0 3.8802 0 8.66667V31.3333C0 36.1198 3.8802 40 8.66667 40H31.3333C36.1198 40 40 36.1198 40 31.3333V8.66667C40 3.8802 36.1198 0 31.3333 0Z" fill="#03A9F4"/>
|
|
<path d="M25.6947 11.3924C26.3928 10.6932 26.2425 9.51811 25.3206 9.16425C24.0343 8.67046 22.6376 8.3999 21.1779 8.3999C14.7823 8.3999 9.59766 13.5934 9.59766 19.9999C9.59766 26.4064 14.7823 31.5999 21.1779 31.5999C22.6286 31.5999 24.017 31.3327 25.2968 30.8447C26.2211 30.4922 26.3728 29.3149 25.6735 28.6144C25.2203 28.1605 24.5345 28.0545 23.9264 28.257C23.0645 28.544 22.1427 28.6995 21.1846 28.6995C16.3879 28.6995 12.4994 24.8043 12.4994 19.9995C12.4994 15.1946 16.3879 11.2995 21.1846 11.2995C22.1496 11.2995 23.0779 11.4571 23.9451 11.7481C24.5537 11.9523 25.2409 11.847 25.6947 11.3924Z" fill="white"/>
|
|
<path d="M22.9294 20.1332C22.9294 20.9432 22.2728 21.5998 21.4628 21.5998C20.6527 21.5998 19.9961 20.9432 19.9961 20.1332C19.9961 19.3232 20.6527 18.6665 21.4628 18.6665C22.2728 18.6665 22.9294 19.3232 22.9294 20.1332Z" fill="white"/>
|
|
<path d="M23.7261 17.8301C23.2007 17.308 23.2007 16.4616 23.7261 15.9395L28.1021 11.5913C28.6274 11.0692 29.4793 11.0692 30.0047 11.5913C30.53 12.1133 30.53 12.9597 30.0047 13.4818L25.6287 17.8301C25.1033 18.3521 24.2515 18.3521 23.7261 17.8301Z" fill="white"/>
|
|
<path d="M23.7261 22.1693C23.2007 22.6914 23.2007 23.5378 23.7261 24.0599L28.1021 28.4082C28.6274 28.9302 29.4793 28.9302 30.0047 28.4082C30.53 27.8861 30.53 27.0397 30.0047 26.5176L25.6287 22.1693C25.1033 21.6473 24.2515 21.6473 23.7261 22.1693Z" fill="white"/>
|
|
</svg>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="auth-form__header">
|
|
<h1>Create your account</h1>
|
|
<p>Start tracking time for free</p>
|
|
</div>
|
|
|
|
<div class="auth-form__body">
|
|
<form method="POST" action="{{ route('register.post') }}">
|
|
@csrf
|
|
|
|
<!-- First Name -->
|
|
<div class="form-control">
|
|
<label for="first_name">First Name</label>
|
|
<input type="text" id="first_name" name="first_name" placeholder="John" value="{{ old('first_name') }}" required autocomplete="given-name">
|
|
</div>
|
|
|
|
<!-- Last Name -->
|
|
<div class="form-control">
|
|
<label for="last_name">Last Name</label>
|
|
<input type="text" id="last_name" name="last_name" placeholder="Doe" value="{{ old('last_name') }}" required autocomplete="family-name">
|
|
</div>
|
|
|
|
<!-- Email -->
|
|
<div class="form-control">
|
|
<label for="email">Email</label>
|
|
<input type="email" id="email" name="email" placeholder="you@company.com" value="{{ old('email') }}" required autocomplete="email">
|
|
</div>
|
|
|
|
<!-- Password -->
|
|
<div class="form-control">
|
|
<label for="password">Password</label>
|
|
<input type="password" id="password" name="password" placeholder="Create a password" required autocomplete="new-password">
|
|
</div>
|
|
|
|
<!-- Submit -->
|
|
<button type="submit" class="btn-primary">Create FREE account</button>
|
|
</form>
|
|
|
|
<!-- Divider -->
|
|
<div class="auth-form__divider">
|
|
<span>or</span>
|
|
</div>
|
|
|
|
<!-- Social signup -->
|
|
<div class="social-buttons">
|
|
<a href="{{ url('/auth/google') }}" class="btn-social btn-google">
|
|
<svg viewBox="0 0 24 24"><path fill="#4285F4" d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92a5.06 5.06 0 01-2.2 3.32v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.1z"/><path fill="#34A853" d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"/><path fill="#FBBC05" d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z"/><path fill="#EA4335" d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"/></svg>
|
|
Sign up with Google
|
|
</a>
|
|
<a href="{{ url('/auth/github') }}" class="btn-social btn-github">
|
|
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.285 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z"/></svg>
|
|
Sign up with GitHub
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="auth-form__footer">
|
|
<p>Already have an account? <a href="{{ route('login') }}">Log in</a></p>
|
|
</div>
|
|
|
|
<p class="auth-form__terms">
|
|
By signing up, you agree to our <a href="#">Terms of Service</a> and <a href="#">Privacy Policy</a>.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|