feat: add i18n support for Vietnamese and English
This commit is contained in:
127
webappUI/login.html
Normal file
127
webappUI/login.html
Normal file
@@ -0,0 +1,127 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="vi">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Login — AfterSales CRM</title>
|
||||
<link rel="stylesheet" href="shared.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="login-layout">
|
||||
<!-- Left Panel -->
|
||||
<div class="login-left">
|
||||
<div class="login-left-content">
|
||||
<div class="login-left-icon">
|
||||
<span class="material-symbols-outlined">support_agent</span>
|
||||
</div>
|
||||
<h1>AfterSales CRM</h1>
|
||||
<p>Real-estate after-sales customer care system. Manage feedbacks, track tickets, and deliver exceptional service.</p>
|
||||
|
||||
<div style="margin-top:48px; display:flex; gap:32px; justify-content:center;">
|
||||
<div style="text-align:center;">
|
||||
<div style="font-size:32px; font-weight:800; font-family:var(--font-heading);">3,658</div>
|
||||
<div style="font-size:13px; opacity:0.8; margin-top:4px;">Records Imported</div>
|
||||
</div>
|
||||
<div style="text-align:center;">
|
||||
<div style="font-size:32px; font-weight:800; font-family:var(--font-heading);">4</div>
|
||||
<div style="font-size:13px; opacity:0.8; margin-top:4px;">Departments</div>
|
||||
</div>
|
||||
<div style="text-align:center;">
|
||||
<div style="font-size:32px; font-weight:800; font-family:var(--font-heading);">8</div>
|
||||
<div style="font-size:13px; opacity:0.8; margin-top:4px;">Tests Passing</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="margin-top:48px; padding:16px 24px; background:rgba(255,255,255,0.15); border-radius:var(--crm-radius-lg); backdrop-filter:blur(10px);">
|
||||
<div style="display:flex; align-items:center; gap:12px; margin-bottom:12px;">
|
||||
<span class="material-symbols-outlined" style="font-size:20px;">format_quote</span>
|
||||
<span style="font-size:13px; font-weight:600;">Customer Feedback</span>
|
||||
</div>
|
||||
<p style="font-size:14px; line-height:1.6; opacity:0.9; font-style:italic;">
|
||||
"The support team resolved my issue within 24 hours. Excellent service and very professional follow-up."
|
||||
</p>
|
||||
<div style="display:flex; align-items:center; gap:8px; margin-top:12px;">
|
||||
<div style="width:28px; height:28px; border-radius:50%; background:rgba(255,255,255,0.3); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700;">NA</div>
|
||||
<div>
|
||||
<div style="font-size:13px; font-weight:600;">Nguyễn A</div>
|
||||
<div style="font-size:11px; opacity:0.7;">Sunrise A1 Resident</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right Panel - Login Form -->
|
||||
<div class="login-right">
|
||||
<div class="login-form-container">
|
||||
<div class="login-form-header">
|
||||
<h2>Welcome back</h2>
|
||||
<p>Sign in to your account to continue</p>
|
||||
</div>
|
||||
|
||||
<form class="login-form" onsubmit="return false;">
|
||||
<div class="form-group">
|
||||
<label class="form-label">Email</label>
|
||||
<input type="email" class="form-input" placeholder="Enter your email" value="admin@minicrm.local">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="form-label">Password</label>
|
||||
<div style="position:relative;">
|
||||
<input type="password" class="form-input" placeholder="Enter your password" value="password" style="padding-right:44px;">
|
||||
<button type="button" style="position:absolute; right:8px; top:50%; transform:translateY(-50%); background:none; border:none; cursor:pointer; color:var(--crm-text-tertiary); padding:4px;">
|
||||
<span class="material-symbols-outlined" style="font-size:20px;">visibility_off</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="display:flex; align-items:center; justify-content:space-between; margin-bottom:24px;">
|
||||
<label class="form-toggle">
|
||||
<div class="toggle-switch active"></div>
|
||||
<span class="toggle-label" style="font-size:13px;">Remember me</span>
|
||||
</label>
|
||||
<a href="#" style="font-size:13px; font-weight:600; color:var(--crm-primary); text-decoration:none;">Forgot password?</a>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn--primary btn--lg" style="width:100%;">
|
||||
Sign In
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<div class="login-divider">or continue with</div>
|
||||
|
||||
<div class="login-demo">
|
||||
<div class="login-demo-title">Demo Accounts</div>
|
||||
<div class="login-demo-accounts">
|
||||
<div class="login-demo-account">
|
||||
<div>
|
||||
<div class="login-demo-role">Admin</div>
|
||||
<div class="login-demo-email">admin@minicrm.local</div>
|
||||
</div>
|
||||
<span class="material-symbols-outlined" style="font-size:18px; color:var(--crm-text-tertiary);">arrow_forward</span>
|
||||
</div>
|
||||
<div class="login-demo-account">
|
||||
<div>
|
||||
<div class="login-demo-role">Manager</div>
|
||||
<div class="login-demo-email">manager@minicrm.local</div>
|
||||
</div>
|
||||
<span class="material-symbols-outlined" style="font-size:18px; color:var(--crm-text-tertiary);">arrow_forward</span>
|
||||
</div>
|
||||
<div class="login-demo-account">
|
||||
<div>
|
||||
<div class="login-demo-role">Staff</div>
|
||||
<div class="login-demo-email">staff@minicrm.local</div>
|
||||
</div>
|
||||
<span class="material-symbols-outlined" style="font-size:18px; color:var(--crm-text-tertiary);">arrow_forward</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="text-align:center; margin-top:24px; font-size:12px; color:var(--crm-text-tertiary);">
|
||||
Laravel 13.6 • Filament 5.6 • Spatie RBAC
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user