Update UI with eye-friendly colour scheme
Replace bright white backgrounds with warmer off-white tones to reduce eye strain while maintaining good contrast and professional appearance. Changes: - Update CSS variables with warmer neutral palette (#f5f3f0 page bg, #faf9f7 surfaces, #f0ede8 muted sections) - Soften primary blue from #2563eb to #3b6fd4 - Update navbar, cards, tables to use new surface colours - Update upload area, file lists, and icon backgrounds - Update flag item backgrounds with softer tints - Update shared components (VeracityScoreCard, FlagsList) The new colour scheme uses warm off-white/cream tones that are easier on the eyes than pure white while maintaining professionalism. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -151,7 +151,7 @@
|
||||
|
||||
<!-- Checks List -->
|
||||
<div class="card border-0 shadow-sm">
|
||||
<div class="card-header bg-white py-3 border-bottom">
|
||||
<div class="card-header py-3 border-bottom" style="background-color: var(--truecv-bg-surface);">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<h5 class="mb-0 fw-bold">Recent CV Checks</h5>
|
||||
<span class="badge bg-light text-muted">@_checks.Count total</span>
|
||||
@@ -160,7 +160,7 @@
|
||||
<div class="table-responsive">
|
||||
<table class="table table-hover align-middle mb-0">
|
||||
<thead>
|
||||
<tr class="bg-light">
|
||||
<tr style="background-color: var(--truecv-bg-muted);">
|
||||
<th class="border-0 ps-4 py-3 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-3 text-uppercase small fw-semibold text-muted text-center" style="letter-spacing: 0.05em;">Status</th>
|
||||
@@ -287,25 +287,25 @@
|
||||
}
|
||||
|
||||
.cursor-pointer:hover {
|
||||
background-color: rgba(37, 99, 235, 0.04);
|
||||
background-color: rgba(59, 111, 212, 0.04);
|
||||
}
|
||||
|
||||
.empty-state-icon {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
|
||||
background: linear-gradient(135deg, #e8f1fa 0%, #d4e4f4 100%);
|
||||
border-radius: 24px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 auto;
|
||||
color: #2563eb;
|
||||
color: var(--truecv-primary);
|
||||
}
|
||||
|
||||
.file-icon-wrapper {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
|
||||
background: linear-gradient(135deg, #e8f1fa 0%, #d4e4f4 100%);
|
||||
border-radius: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -323,17 +323,17 @@
|
||||
}
|
||||
|
||||
.score-badge.score-high {
|
||||
background: linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%);
|
||||
background: linear-gradient(135deg, #dcf5e9 0%, #b8edda 100%);
|
||||
color: #047857;
|
||||
}
|
||||
|
||||
.score-badge.score-medium {
|
||||
background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
|
||||
background: linear-gradient(135deg, #fdf6e3 0%, #faecc5 100%);
|
||||
color: #b45309;
|
||||
}
|
||||
|
||||
.score-badge.score-low {
|
||||
background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
|
||||
background: linear-gradient(135deg, #fde8e8 0%, #fcd9d9 100%);
|
||||
color: #b91c1c;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user