refactor: Compact UI and fix RealCV branding

- Fix logo to show RealCV instead of TrueCV
- Remove duplicate auth-logo from Login/Register pages
- Dashboard: reduce padding, smaller icons, tighter table rows
- Report: compact score header (140px → 100px roundel)
- Reduce stat card sizes and spacing throughout

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-01-24 20:56:04 +00:00
parent 72b7f11c41
commit f775164212
5 changed files with 43 additions and 55 deletions

View File

@@ -14,12 +14,6 @@
<!-- Left side - Form --> <!-- Left side - Form -->
<div class="auth-form-side"> <div class="auth-form-side">
<div class="auth-form-wrapper"> <div class="auth-form-wrapper">
<div class="text-center mb-4">
<a href="/">
<img src="images/RealCV_Logo.png" alt="RealCV" class="auth-logo" />
</a>
</div>
<h1 class="auth-title">Welcome back</h1> <h1 class="auth-title">Welcome back</h1>
<p class="auth-subtitle">Sign in to continue verifying CVs</p> <p class="auth-subtitle">Sign in to continue verifying CVs</p>

View File

@@ -16,12 +16,6 @@
<!-- Left side - Form --> <!-- Left side - Form -->
<div class="auth-form-side"> <div class="auth-form-side">
<div class="auth-form-wrapper"> <div class="auth-form-wrapper">
<div class="text-center mb-4">
<a href="/">
<img src="images/RealCV_Logo.png" alt="RealCV" class="auth-logo" />
</a>
</div>
<h1 class="auth-title">Create account</h1> <h1 class="auth-title">Create account</h1>
<p class="auth-subtitle">Start verifying UK-based CVs in minutes</p> <p class="auth-subtitle">Start verifying UK-based CVs in minutes</p>

View File

@@ -13,8 +13,8 @@
<PageTitle>Dashboard - RealCV</PageTitle> <PageTitle>Dashboard - RealCV</PageTitle>
<div class="container py-5"> <div class="container py-3">
<div class="d-flex justify-content-between align-items-center mb-4"> <div class="d-flex justify-content-between align-items-center mb-3">
<div> <div>
<h1 class="fw-bold mb-1">Dashboard</h1> <h1 class="fw-bold mb-1">Dashboard</h1>
<p class="text-muted mb-0">View and manage your CV verification checks</p> <p class="text-muted mb-0">View and manage your CV verification checks</p>
@@ -93,13 +93,13 @@
else else
{ {
<!-- Stats Cards --> <!-- Stats Cards -->
<div class="row mb-4 g-4"> <div class="row mb-3 g-3">
<div class="col-md-4"> <div class="col-md-4">
<div class="card border-0 shadow-sm stat-card h-100"> <div class="card border-0 shadow-sm stat-card h-100">
<div class="card-body p-4"> <div class="card-body p-3">
<div class="d-flex align-items-center"> <div class="d-flex align-items-center">
<div class="stat-icon stat-icon-primary me-3"> <div class="stat-icon stat-icon-primary me-3">
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor" viewBox="0 0 16 16"> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" fill="currentColor" viewBox="0 0 16 16">
<path d="M10.854 7.854a.5.5 0 0 0-.708-.708L7.5 9.793 6.354 8.646a.5.5 0 1 0-.708.708l1.5 1.5a.5.5 0 0 0 .708 0l3-3z"/> <path d="M10.854 7.854a.5.5 0 0 0-.708-.708L7.5 9.793 6.354 8.646a.5.5 0 1 0-.708.708l1.5 1.5a.5.5 0 0 0 .708 0l3-3z"/>
<path d="M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2zM9.5 3A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5v2z"/> <path d="M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2zM9.5 3A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5v2z"/>
</svg> </svg>
@@ -114,10 +114,10 @@
</div> </div>
<div class="col-md-4"> <div class="col-md-4">
<div class="card border-0 shadow-sm stat-card h-100"> <div class="card border-0 shadow-sm stat-card h-100">
<div class="card-body p-4"> <div class="card-body p-3">
<div class="d-flex align-items-center"> <div class="d-flex align-items-center">
<div class="stat-icon stat-icon-success me-3"> <div class="stat-icon stat-icon-success me-3">
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor" viewBox="0 0 16 16"> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" fill="currentColor" 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="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="M10.97 4.97a.235.235 0 0 0-.02.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-1.071-1.05z"/> <path d="M10.97 4.97a.235.235 0 0 0-.02.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-1.071-1.05z"/>
</svg> </svg>
@@ -132,10 +132,10 @@
</div> </div>
<div class="col-md-4"> <div class="col-md-4">
<div class="card border-0 shadow-sm stat-card h-100"> <div class="card border-0 shadow-sm stat-card h-100">
<div class="card-body p-4"> <div class="card-body p-3">
<div class="d-flex align-items-center"> <div class="d-flex align-items-center">
<div class="stat-icon stat-icon-warning me-3"> <div class="stat-icon stat-icon-warning me-3">
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor" viewBox="0 0 16 16"> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" fill="currentColor" viewBox="0 0 16 16">
<path d="M2.5 15a.5.5 0 1 1 0-1h1v-1a4.5 4.5 0 0 1 2.557-4.06c.29-.139.443-.377.443-.59v-.7c0-.213-.154-.451-.443-.59A4.5 4.5 0 0 1 3.5 3V2h-1a.5.5 0 0 1 0-1h11a.5.5 0 0 1 0 1h-1v1a4.5 4.5 0 0 1-2.557 4.06c-.29.139-.443.377-.443.59v.7c0 .213.154.451.443.59A4.5 4.5 0 0 1 12.5 13v1h1a.5.5 0 0 1 0 1h-11zm2-13v1c0 .537.12 1.045.337 1.5h6.326c.216-.455.337-.963.337-1.5V2h-7zm3 6.35c0 .701-.478 1.236-1.011 1.492A3.5 3.5 0 0 0 4.5 13s.866-1.299 3-1.48V8.35zm1 0v3.17c2.134.181 3 1.48 3 1.48a3.5 3.5 0 0 0-1.989-3.158C8.978 9.586 8.5 9.052 8.5 8.351z"/> <path d="M2.5 15a.5.5 0 1 1 0-1h1v-1a4.5 4.5 0 0 1 2.557-4.06c.29-.139.443-.377.443-.59v-.7c0-.213-.154-.451-.443-.59A4.5 4.5 0 0 1 3.5 3V2h-1a.5.5 0 0 1 0-1h11a.5.5 0 0 1 0 1h-1v1a4.5 4.5 0 0 1-2.557 4.06c-.29.139-.443.377-.443.59v.7c0 .213.154.451.443.59A4.5 4.5 0 0 1 12.5 13v1h1a.5.5 0 0 1 0 1h-11zm2-13v1c0 .537.12 1.045.337 1.5h6.326c.216-.455.337-.963.337-1.5V2h-7zm3 6.35c0 .701-.478 1.236-1.011 1.492A3.5 3.5 0 0 0 4.5 13s.866-1.299 3-1.48V8.35zm1 0v3.17c2.134.181 3 1.48 3 1.48a3.5 3.5 0 0 0-1.989-3.158C8.978 9.586 8.5 9.052 8.5 8.351z"/>
</svg> </svg>
</div> </div>
@@ -151,7 +151,7 @@
<!-- Checks List --> <!-- Checks List -->
<div class="card border-0 shadow-sm"> <div class="card border-0 shadow-sm">
<div class="card-header py-3 border-bottom" style="background-color: var(--realcv-bg-surface);"> <div class="card-header py-2 border-bottom" style="background-color: var(--realcv-bg-surface);">
<div class="d-flex justify-content-between align-items-center"> <div class="d-flex justify-content-between align-items-center">
<div class="d-flex align-items-center gap-3"> <div class="d-flex align-items-center gap-3">
<h5 class="mb-0 fw-bold">Recent CV Checks</h5> <h5 class="mb-0 fw-bold">Recent CV Checks</h5>
@@ -178,17 +178,17 @@
<table class="table table-hover align-middle mb-0"> <table class="table table-hover align-middle mb-0">
<thead> <thead>
<tr style="background-color: var(--realcv-bg-muted);"> <tr style="background-color: var(--realcv-bg-muted);">
<th class="border-0 ps-3 py-3" style="width: 40px;"> <th class="border-0 ps-3 py-2" style="width: 40px;">
<input type="checkbox" class="form-check-input" <input type="checkbox" class="form-check-input"
checked="@IsAllSelected()" checked="@IsAllSelected()"
@onchange="ToggleSelectAll" @onchange="ToggleSelectAll"
title="Select all" /> title="Select all" />
</th> </th>
<th class="border-0 py-3 text-uppercase small fw-semibold text-muted" style="letter-spacing: 0.05em;">Candidate</th> <th class="border-0 py-2 text-uppercase small fw-semibold text-muted" style="letter-spacing: 0.05em;">Candidate</th>
<th class="border-0 py-3 text-uppercase small fw-semibold text-muted" style="letter-spacing: 0.05em;">Uploaded</th> <th class="border-0 py-2 text-uppercase small fw-semibold text-muted" style="letter-spacing: 0.05em;">Uploaded</th>
<th class="border-0 py-3 text-uppercase small fw-semibold text-muted text-center" style="letter-spacing: 0.05em;">Status</th> <th class="border-0 py-2 text-uppercase small fw-semibold text-muted text-center" style="letter-spacing: 0.05em;">Status</th>
<th class="border-0 py-3 text-uppercase small fw-semibold text-muted text-center" style="letter-spacing: 0.05em;">Score</th> <th class="border-0 py-2 text-uppercase small fw-semibold text-muted text-center" style="letter-spacing: 0.05em;">Score</th>
<th class="border-0 py-3 pe-4 text-uppercase small fw-semibold text-muted text-end" style="letter-spacing: 0.05em;">Actions</th> <th class="border-0 py-2 pe-4 text-uppercase small fw-semibold text-muted text-end" style="letter-spacing: 0.05em;">Actions</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@@ -196,15 +196,15 @@
{ {
<tr class="@(check.Status == "Completed" ? "cursor-pointer" : "") @(_selectedIds.Contains(check.Id) ? "table-active" : "")" <tr class="@(check.Status == "Completed" ? "cursor-pointer" : "") @(_selectedIds.Contains(check.Id) ? "table-active" : "")"
@onclick="() => ViewReport(check)"> @onclick="() => ViewReport(check)">
<td class="ps-3 py-3" @onclick:stopPropagation="true"> <td class="ps-3 py-2" @onclick:stopPropagation="true">
<input type="checkbox" class="form-check-input" <input type="checkbox" class="form-check-input"
checked="@_selectedIds.Contains(check.Id)" checked="@_selectedIds.Contains(check.Id)"
@onchange="() => ToggleSelection(check.Id)" /> @onchange="() => ToggleSelection(check.Id)" />
</td> </td>
<td class="py-3"> <td class="py-2">
<div class="d-flex align-items-center"> <div class="d-flex align-items-center">
<div class="file-icon-wrapper me-3"> <div class="file-icon-wrapper me-3">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-file-earmark-person text-primary" viewBox="0 0 16 16"> <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-file-earmark-person text-primary" viewBox="0 0 16 16">
<path d="M11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z"/> <path d="M11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z"/>
<path d="M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2zM9.5 3A1.5 1.5 0 0 0 11 4.5h2v9.255S12 12 8 12s-5 1.755-5 1.755V2a1 1 0 0 1 1-1h5.5v2z"/> <path d="M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2zM9.5 3A1.5 1.5 0 0 0 11 4.5h2v9.255S12 12 8 12s-5 1.755-5 1.755V2a1 1 0 0 1 1-1h5.5v2z"/>
</svg> </svg>
@@ -215,17 +215,17 @@
</div> </div>
</div> </div>
</td> </td>
<td class="py-3"> <td class="py-2">
<div> <div>
<p class="mb-0 small">@check.CreatedAt.ToString("dd MMM yyyy")</p> <p class="mb-0 small">@check.CreatedAt.ToString("dd MMM yyyy")</p>
<small class="text-muted">@check.CreatedAt.ToString("HH:mm")</small> <small class="text-muted">@check.CreatedAt.ToString("HH:mm")</small>
</div> </div>
</td> </td>
<td class="py-3 text-center"> <td class="py-2 text-center">
@switch (check.Status) @switch (check.Status)
{ {
case "Completed": case "Completed":
<span class="badge rounded-pill bg-success-subtle text-success px-3 py-2"> <span class="badge rounded-pill bg-success-subtle text-success px-2 py-1">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="bi bi-check-circle-fill me-1" viewBox="0 0 16 16"> <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="bi bi-check-circle-fill me-1" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/> <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg> </svg>
@@ -233,13 +233,13 @@
</span> </span>
break; break;
case "Processing": case "Processing":
<span class="badge rounded-pill bg-primary-subtle text-primary px-3 py-2"> <span class="badge rounded-pill bg-primary-subtle text-primary px-2 py-1">
<span class="spinner-border spinner-border-sm me-1" role="status" style="width: 0.75rem; height: 0.75rem;"></span> <span class="spinner-border spinner-border-sm me-1" role="status" style="width: 0.75rem; height: 0.75rem;"></span>
@(check.ProcessingStage ?? "Processing") @(check.ProcessingStage ?? "Processing")
</span> </span>
break; break;
case "Pending": case "Pending":
<span class="badge rounded-pill bg-secondary-subtle text-secondary px-3 py-2"> <span class="badge rounded-pill bg-secondary-subtle text-secondary px-2 py-1">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="bi bi-clock me-1" viewBox="0 0 16 16"> <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="bi bi-clock me-1" viewBox="0 0 16 16">
<path d="M8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71V3.5z"/> <path d="M8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71V3.5z"/>
<path d="M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zm7-8A7 7 0 1 1 1 8a7 7 0 0 1 14 0z"/> <path d="M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zm7-8A7 7 0 1 1 1 8a7 7 0 0 1 14 0z"/>
@@ -248,7 +248,7 @@
</span> </span>
break; break;
case "Failed": case "Failed":
<span class="badge rounded-pill bg-danger-subtle text-danger px-3 py-2"> <span class="badge rounded-pill bg-danger-subtle text-danger px-2 py-1">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="bi bi-x-circle-fill me-1" viewBox="0 0 16 16"> <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="bi bi-x-circle-fill me-1" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293 5.354 4.646z"/> <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293 5.354 4.646z"/>
</svg> </svg>
@@ -256,11 +256,11 @@
</span> </span>
break; break;
default: default:
<span class="badge rounded-pill bg-secondary-subtle text-secondary px-3 py-2">@check.Status</span> <span class="badge rounded-pill bg-secondary-subtle text-secondary px-2 py-1">@check.Status</span>
break; break;
} }
</td> </td>
<td class="py-3 text-center"> <td class="py-2 text-center">
@if (check.VeracityScore.HasValue) @if (check.VeracityScore.HasValue)
{ {
<div class="score-ring-container" title="Veracity Score: @check.VeracityScore%"> <div class="score-ring-container" title="Veracity Score: @check.VeracityScore%">
@@ -278,7 +278,7 @@
<span class="text-muted">--</span> <span class="text-muted">--</span>
} }
</td> </td>
<td class="py-3 pe-4 text-end"> <td class="py-2 pe-4 text-end">
<div class="d-flex justify-content-end align-items-center gap-2"> <div class="d-flex justify-content-end align-items-center gap-2">
@if (check.Status == "Completed") @if (check.Status == "Completed")
{ {
@@ -399,8 +399,8 @@
} }
.file-icon-wrapper { .file-icon-wrapper {
width: 44px; width: 36px;
height: 44px; height: 36px;
background: linear-gradient(135deg, #e8f1fa 0%, #d4e4f4 100%); background: linear-gradient(135deg, #e8f1fa 0%, #d4e4f4 100%);
border-radius: 10px; border-radius: 10px;
display: flex; display: flex;
@@ -410,8 +410,8 @@
.score-ring-container { .score-ring-container {
position: relative; position: relative;
width: 52px; width: 42px;
height: 52px; height: 42px;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;

View File

@@ -131,7 +131,7 @@
<div class="col-12"> <div class="col-12">
<div class="card border-0 shadow-sm overflow-hidden"> <div class="card border-0 shadow-sm overflow-hidden">
<div class="score-header"> <div class="score-header">
<div class="row align-items-center py-4 px-3"> <div class="row align-items-center py-2 px-3">
<div class="col-md-4 text-center"> <div class="col-md-4 text-center">
<div class="score-roundel @GetScoreColorClass(_report!.OverallScore)"> <div class="score-roundel @GetScoreColorClass(_report!.OverallScore)">
<svg class="score-ring" viewBox="0 0 120 120"> <svg class="score-ring" viewBox="0 0 120 120">
@@ -153,10 +153,10 @@
<span class="score-max">/100</span> <span class="score-max">/100</span>
</div> </div>
</div> </div>
<div class="mt-2 text-white truecv-score-label">RealCV Score</div> <div class="mt-1 text-white truecv-score-label">RealCV Score</div>
</div> </div>
<div class="col-md-8"> <div class="col-md-8">
<div class="row g-4 text-center text-md-start"> <div class="row g-2 text-center text-md-start">
<div class="col-4"> <div class="col-4">
<div class="stat-item"> <div class="stat-item">
<div class="stat-icon"> <div class="stat-icon">
@@ -165,7 +165,7 @@
<path d="M2 1a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V1Zm11 0H3v14h3v-2.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 .5.5V15h3V1Z"/> <path d="M2 1a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V1Zm11 0H3v14h3v-2.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 .5.5V15h3V1Z"/>
</svg> </svg>
</div> </div>
<h3 class="mb-0 fw-bold text-white">@_report.EmploymentVerifications.Count</h3> <h5 class="mb-0 fw-bold text-white">@_report.EmploymentVerifications.Count</h5>
<small class="stat-label">Employers Checked</small> <small class="stat-label">Employers Checked</small>
</div> </div>
</div> </div>
@@ -177,7 +177,7 @@
<path d="M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1z"/> <path d="M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1z"/>
</svg> </svg>
</div> </div>
<h3 class="mb-0 fw-bold text-white">@_report.TimelineAnalysis.TotalGapMonths</h3> <h5 class="mb-0 fw-bold text-white">@_report.TimelineAnalysis.TotalGapMonths</h5>
<small class="stat-label">Gap Months</small> <small class="stat-label">Gap Months</small>
</div> </div>
</div> </div>
@@ -188,7 +188,7 @@
<path d="M14.778.085A.5.5 0 0 1 15 .5V8a.5.5 0 0 1-.314.464L14.5 8l.186.464-.003.001-.006.003-.023.009a12.435 12.435 0 0 1-.397.15c-.264.095-.631.223-1.047.35-.816.252-1.879.523-2.71.523-.847 0-1.548-.28-2.158-.525l-.028-.01C7.68 8.71 7.14 8.5 6.5 8.5c-.7 0-1.638.23-2.437.477A19.626 19.626 0 0 0 3 9.342V15.5a.5.5 0 0 1-1 0V.5a.5.5 0 0 1 1 0v.282c.226-.079.496-.17.79-.26C4.606.272 5.67 0 6.5 0c.84 0 1.524.277 2.121.519l.043.018C9.286.788 9.828 1 10.5 1c.7 0 1.638-.23 2.437-.477a19.587 19.587 0 0 0 1.349-.476l.019-.007.004-.002h.001"/> <path d="M14.778.085A.5.5 0 0 1 15 .5V8a.5.5 0 0 1-.314.464L14.5 8l.186.464-.003.001-.006.003-.023.009a12.435 12.435 0 0 1-.397.15c-.264.095-.631.223-1.047.35-.816.252-1.879.523-2.71.523-.847 0-1.548-.28-2.158-.525l-.028-.01C7.68 8.71 7.14 8.5 6.5 8.5c-.7 0-1.638.23-2.437.477A19.626 19.626 0 0 0 3 9.342V15.5a.5.5 0 0 1-1 0V.5a.5.5 0 0 1 1 0v.282c.226-.079.496-.17.79-.26C4.606.272 5.67 0 6.5 0c.84 0 1.524.277 2.121.519l.043.018C9.286.788 9.828 1 10.5 1c.7 0 1.638-.23 2.437-.477a19.587 19.587 0 0 0 1.349-.476l.019-.007.004-.002h.001"/>
</svg> </svg>
</div> </div>
<h3 class="mb-0 fw-bold text-white">@_report.Flags.Count</h3> <h5 class="mb-0 fw-bold text-white">@_report.Flags.Count</h5>
<small class="stat-label">Flags Raised</small> <small class="stat-label">Flags Raised</small>
</div> </div>
</div> </div>
@@ -496,12 +496,12 @@
/* Score Roundel */ /* Score Roundel */
.score-roundel { .score-roundel {
position: relative; position: relative;
width: 140px; width: 100px;
height: 140px; height: 100px;
margin: 0 auto; margin: 0 auto;
background: rgba(255, 255, 255, 0.15); background: rgba(255, 255, 255, 0.15);
border-radius: 50%; border-radius: 50%;
padding: 8px; padding: 6px;
} }
.score-roundel .score-ring { .score-roundel .score-ring {
@@ -555,14 +555,14 @@
} }
.score-roundel .score-value { .score-roundel .score-value {
font-size: 2.5rem; font-size: 1.75rem;
font-weight: 700; font-weight: 700;
line-height: 1; line-height: 1;
color: white; color: white;
} }
.score-roundel .score-max { .score-roundel .score-max {
font-size: 1rem; font-size: 0.75rem;
opacity: 0.85; opacity: 0.85;
color: white; color: white;
} }

Binary file not shown.

Before

Width:  |  Height:  |  Size: 89 KiB

After

Width:  |  Height:  |  Size: 26 KiB