forked from ttc/micro-frontend
56 lines
2.7 KiB
HTML
56 lines
2.7 KiB
HTML
<!-- Modal-like backdrop that covers the viewport -->
|
|
<div class="login-backdrop">
|
|
<div class="login-modal d-flex align-items-center justify-content-center">
|
|
<div class="card modal-card" role="dialog" aria-labelledby="signin-title" aria-modal="true">
|
|
<div class="brand">
|
|
<!-- <img src="assets/logo.png" alt="Company logo" class="logo" /> -->
|
|
<img src="logo.png" alt="Company logo" class="logo mb-2"/>
|
|
<h1 id="signin-title" class='kanit-bold'>เข้าสู่ระบบ</h1>
|
|
<p class="subtitle">บัญชีโปรแกรมจัดการบัญชีของคุณ</p>
|
|
</div>
|
|
<form [formGroup]="loginForm" (ngSubmit)="signIn()" class="form px-3 pb-3">
|
|
<label class="field">
|
|
<span class="label-text">อีเมล์</span>
|
|
<input type="email" formControlName="username" autocomplete="username" placeholder="nuttakit@gmail.com" required />
|
|
</label>
|
|
|
|
<label class="field">
|
|
<span class="label-text">รหัสผ่าน</span>
|
|
<input type="password" formControlName="password" autocomplete="current-password" required />
|
|
</label>
|
|
|
|
<div class="actions">
|
|
<label class="stay-signed">
|
|
<input type="checkbox" formControlName="remember" />
|
|
<span>จดจำรหัสผ่าน</span>
|
|
</label>
|
|
<!-- <fa-icon [icon]="faCoffee" /> -->
|
|
<button type="submit" class="primary" [disabled]="!(loginForm.get('username')?.valid && loginForm.get('password')?.value)">
|
|
เข้าสู่ระบบ
|
|
</button>
|
|
|
|
</div>
|
|
|
|
<div class="alt-options">
|
|
<button type="button" class="biometric" (click)="useBiometric()">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none">
|
|
<path d="M12 11a1 1 0 1 0 0-2 1 1 0 0 0 0 2z" fill="currentColor" opacity=".9"/>
|
|
<path d="M6.2 10.9A6 6 0 0 1 12 6a6 6 0 0 1 5.8 4.9M12 22v-2" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
<path d="M4 12a8 8 0 0 1 16 0v1" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
</svg>
|
|
<span>เข้าสู่ระบบด้วย Windows Hello / Touch ID</span>
|
|
</button>
|
|
|
|
<a class="help-link" href="#" (click)="$event.preventDefault(); forgotPassword()">ลืมรหัส ใช่ หรือ ไม่?</a>
|
|
</div>
|
|
|
|
<div class="footer">
|
|
<a href="#" (click)="$event.preventDefault(); createAccount()">สร้างบัญชี</a>
|
|
<span class="divider">•</span>
|
|
<a href="#" (click)="$event.preventDefault(); privacy()">Privacy & terms</a>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|