60 lines
3.7 KiB
HTML
60 lines
3.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="id">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>Login - SCM</title>
|
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
|
<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@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<style>:root {
|
|
--scm-primary: #5699DA;
|
|
--scm-primary-dark: #417DB8;
|
|
--scm-primary-bg: #EBF3F9;
|
|
--scm-surface: #FFFFFF;
|
|
--scm-bg: #F1F5F9;
|
|
--scm-border: #E2E8F0;
|
|
--scm-text: #0F172A;
|
|
--scm-text-muted: #64748B;
|
|
}</style>
|
|
</head>
|
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
|
<div class="flex min-h-screen items-center justify-center px-4 py-12">
|
|
<div class="w-full max-w-sm rounded-xl border border-[var(--scm-border)] bg-white p-6 shadow-lg sm:p-8">
|
|
<div class="mb-6 text-center">
|
|
<div class="mx-auto flex h-12 w-12 items-center justify-center rounded-xl bg-[var(--scm-primary)] text-xl font-extrabold text-white">SCM</div>
|
|
<h1 class="mt-4 text-xl font-extrabold text-[var(--scm-text)]">Supply Chain Management</h1>
|
|
<p class="mt-1 text-sm text-[var(--scm-text-muted)]">Sign in to your account</p>
|
|
</div>
|
|
<form class="space-y-4">
|
|
<label class="space-y-1.5">
|
|
<span class="text-xs font-semibold text-[var(--scm-text-muted)]">Username / Email</span>
|
|
<input type="text" placeholder="user@company.com" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2.5 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" />
|
|
</label>
|
|
<label class="space-y-1.5">
|
|
<span class="text-xs font-semibold text-[var(--scm-text-muted)]">Password</span>
|
|
<input type="password" placeholder="••••••••" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2.5 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" />
|
|
</label>
|
|
<label class="space-y-1.5">
|
|
<span class="text-xs font-semibold text-[var(--scm-text-muted)]">Branch / Tenant</span>
|
|
<select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2.5 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30">
|
|
<option>SCM Group — HQ</option>
|
|
<option>SCM Group — Warehouse A</option>
|
|
<option>SCM Group — Warehouse B</option>
|
|
</select>
|
|
</label>
|
|
<div class="flex items-center justify-between text-xs">
|
|
<label class="flex items-center gap-2"><input type="checkbox" class="rounded border-[var(--scm-border)] accent-[var(--scm-primary)]" /><span class="text-[var(--scm-text-muted)]">Remember me</span></label>
|
|
<a href="#" class="font-semibold text-[var(--scm-primary)] hover:text-[var(--scm-primary-dark)]">Forgot Password?</a>
|
|
</div>
|
|
<button type="button" onclick="window.location.href='./dash-overview.html'" class="w-full rounded-lg bg-[var(--scm-primary)] px-4 py-2.5 text-sm font-bold text-white hover:bg-[var(--scm-primary-dark)]">Sign In</button>
|
|
</form>
|
|
<p class="mt-6 text-center text-xs text-[var(--scm-text-muted)]">© 2025 SCM Platform. All rights reserved.</p>
|
|
</div>
|
|
</div>
|
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
|
</body>
|
|
</html>
|