feat(login): update login page styles and integrate neutral button variant
This commit is contained in:
@@ -5,7 +5,9 @@
|
||||
<article class="card border-0 shadow-lg rounded-4">
|
||||
<div class="card-body p-4 p-md-5">
|
||||
<header class="text-center mb-4">
|
||||
<h1 id="login-title" class="h5 fw-bold text-uppercase mb-0">Iniciar sesion</h1>
|
||||
<h1 id="login-title" class="fw-bold text-uppercase mb-0" style="font-size: 17px; color: #666666;">
|
||||
Iniciar sesion
|
||||
</h1>
|
||||
</header>
|
||||
|
||||
<form class="d-grid gap-3" novalidate aria-labelledby="login-title">
|
||||
@@ -17,7 +19,11 @@
|
||||
<label class="visually-hidden" for="login-password">Contrasena</label>
|
||||
<app-input id="login-password" type="password" placeholder="Contrasena" />
|
||||
<div class="text-end">
|
||||
<button type="button" class="btn btn-link p-0 border-0 text-decoration-none small text-secondary">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-link p-0 border-0 text-decoration-none"
|
||||
style="font-size: 12px; font-weight: 325; color: #A0A0A0;"
|
||||
>
|
||||
Olvide mi contrasena
|
||||
</button>
|
||||
</div>
|
||||
@@ -25,7 +31,7 @@
|
||||
</div>
|
||||
|
||||
<div class="d-grid gap-2 text-center">
|
||||
<app-button buttonClass="w-100">Ingresar</app-button>
|
||||
<app-button hostClass="w-100 d-block" buttonClass="w-100">Ingresar</app-button>
|
||||
<button type="button" class="btn btn-link p-0 border-0 text-decoration-none small fw-bold">
|
||||
Crear cuenta
|
||||
</button>
|
||||
@@ -36,13 +42,14 @@
|
||||
<span class="w-100" style="max-width: 16rem; height: 1px; background: linear-gradient(90deg, transparent, rgba(160, 160, 160, 0.55), transparent);"></span>
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline-secondary w-100 d-inline-flex align-items-center justify-content-center gap-2 py-2 fw-semibold"
|
||||
<app-button
|
||||
variant="neutral-outline"
|
||||
hostClass="w-100 d-block"
|
||||
buttonClass="w-100 d-inline-flex align-items-center justify-content-center gap-2 py-2 fw-semibold"
|
||||
>
|
||||
<i class="fa-brands fa-google text-danger" aria-hidden="true"></i>
|
||||
<span>Continuar con Google</span>
|
||||
</button>
|
||||
</app-button>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user