Files
RealCV/src/TrueCV.Web/Components/Pages/Account/Login.razor
peter 4cc0bb3132 UI redesign: improve readability and add candidate name display
- Add CandidateName property to VeracityReport and display on report page
- Simplify employment verification layout with compact row-based design
- Add UK employment history notice to Home and Check pages
- Improve hero section text readability with text shadow
- Update Login and Register page styling
- Remove Companies House references from UI text

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-21 09:01:01 +01:00

148 lines
6.9 KiB
Plaintext

@page "/account/login"
@using TrueCV.Web.Components.Layout
@layout MainLayout
@using Microsoft.AspNetCore.Identity
@using TrueCV.Infrastructure.Identity
@inject SignInManager<ApplicationUser> SignInManager
@inject NavigationManager NavigationManager
<PageTitle>Login - TrueCV</PageTitle>
<div class="auth-container">
<!-- Left side - Form -->
<div class="auth-form-side">
<div class="auth-form-wrapper">
<div class="text-center mb-4">
<a href="/">
<img src="images/TrueCV_Logo.png" alt="TrueCV" class="auth-logo" />
</a>
</div>
<h1 class="auth-title">Welcome back</h1>
<p class="auth-subtitle">Sign in to continue verifying CVs</p>
@if (!string.IsNullOrEmpty(_errorMessage))
{
<div class="alert alert-danger d-flex align-items-center" role="alert">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="me-2 flex-shrink-0" viewBox="0 0 16 16">
<path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
<path d="M7.002 11a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 4.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 4.995z"/>
</svg>
<span>@_errorMessage</span>
</div>
}
<form method="post" action="/account/perform-login">
<AntiforgeryToken />
<input type="hidden" name="returnUrl" value="@ReturnUrl" />
<div class="mb-3">
<label for="email" class="form-label">Email address</label>
<div class="input-group-icon">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" viewBox="0 0 16 16">
<path d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4Zm2-1a1 1 0 0 0-1 1v.217l7 4.2 7-4.2V4a1 1 0 0 0-1-1H2Zm13 2.383-4.708 2.825L15 11.105V5.383Zm-.034 6.876-5.64-3.471L8 9.583l-1.326-.795-5.64 3.47A1 1 0 0 0 2 13h12a1 1 0 0 0 .966-.741ZM1 11.105l4.708-2.897L1 5.383v5.722Z"/>
</svg>
<input id="email" name="email" type="email" class="form-control form-control-lg"
placeholder="name@example.com" autocomplete="email" required />
</div>
</div>
<div class="mb-3">
<label for="password" class="form-label">Password</label>
<div class="input-group-icon">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" viewBox="0 0 16 16">
<path d="M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2z"/>
</svg>
<input id="password" name="password" type="password" class="form-control form-control-lg"
placeholder="Enter your password" autocomplete="current-password" required />
</div>
</div>
<div class="mb-4 d-flex justify-content-between align-items-center">
<div class="form-check">
<input id="rememberMe" name="rememberMe" type="checkbox" class="form-check-input" value="true" />
<label class="form-check-label" for="rememberMe">
Remember me
</label>
</div>
</div>
<div class="d-grid mb-4">
<button type="submit" class="btn btn-primary btn-lg">
<span>Sign In</span>
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="ms-2" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8z"/>
</svg>
</button>
</div>
</form>
<div class="auth-divider">
<span>New to TrueCV?</span>
</div>
<div class="text-center">
<a href="/account/register" class="btn btn-outline-secondary btn-lg w-100">
Create an account
</a>
</div>
</div>
</div>
<!-- Right side - Branding -->
<div class="auth-brand-side">
<div class="auth-brand-content">
<div class="auth-brand-icon">
<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" fill="currentColor" viewBox="0 0 16 16">
<path d="M10.854 7.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7.5 9.793l2.646-2.647a.5.5 0 0 1 .708 0z"/>
<path d="M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z"/>
<path d="M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5h3zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3z"/>
</svg>
</div>
<h2 class="auth-brand-title">CV Verification Made Simple</h2>
<p class="auth-brand-text">
Upload any CV and get instant AI-powered verification with detailed analysis of qualifications, experience, and company legitimacy.
</p>
<div class="auth-stats">
<div class="auth-stat">
<div class="auth-stat-value">10K+</div>
<div class="auth-stat-label">CVs Verified</div>
</div>
<div class="auth-stat">
<div class="auth-stat-value">98%</div>
<div class="auth-stat-label">Accuracy Rate</div>
</div>
<div class="auth-stat">
<div class="auth-stat-value">&lt;30s</div>
<div class="auth-stat-label">Average Time</div>
</div>
</div>
<div class="auth-testimonial">
<blockquote>
"TrueCV has transformed our hiring process. We catch discrepancies we would have missed before."
</blockquote>
<cite>- HR Director, Tech Company</cite>
</div>
</div>
</div>
</div>
@code {
private string? _errorMessage;
[SupplyParameterFromQuery]
public string? ReturnUrl { get; set; }
[SupplyParameterFromQuery(Name = "error")]
public string? Error { get; set; }
protected override void OnInitialized()
{
_errorMessage = Error;
}
}