peter/RealCV
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix cursor styling and replace hero logo with SVG illustration

Browse Source 
- Replace hero section PNG logo with clean SVG document illustration
- Add comprehensive cursor styling to prevent text cursor on non-editable elements
- Cover all SVG elements, Bootstrap components, and custom classes
- Ensure checkboxes and interactive elements have pointer cursor

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
peter
2026-01-21 09:23:51 +01:00
parent 4cc0bb3132
commit 7ca00ca0b6
2 changed files with 51 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/TrueCV.Web/Components/Pages/Home.razor
View File

@@ -7,9 +7,9 @@
<div class="container hero-content">
<div class="row align-items-center py-5">
<div class="col-lg-7">
<h1 class="display-3 fw-bold mb-4" style="letter-spacing: -0.03em; text-shadow: 0 2px 4px rgba(0,0,0,0.3);">
<h1 class="display-3 fw-bold mb-4" style="letter-spacing: -0.03em; color: #FFFFFF; text-shadow: 0 2px 10px rgba(0,0,0,0.8), 0 0 40px rgba(255,255,255,0.3);">
Verify CVs with<br />
<span style="color: #60A5FA;">Confidence</span>
<span style="color: #60A5FA; text-shadow: 0 2px 8px rgba(0,0,0,0.4);">Confidence</span>
</h1>
<p class="lead mb-3 opacity-90" style="font-size: 1.25rem; line-height: 1.7;">
TrueCV uses AI-powered analysis and official company records to verify employment history,
@@ -39,7 +39,23 @@
</div>
<div class="col-lg-5 text-center mt-5 mt-lg-0">
<div class="position-relative">
<img src="images/TrueCV_Logo.png" alt="TrueCV" class="hero-logo" style="max-height: 220px; filter: drop-shadow(0 20px 40px rgba(0,0,0,0.3));" />
<!-- CV Verification Illustration -->
<svg width="280" height="280" viewBox="0 0 280 280" fill="none" xmlns="http://www.w3.org/2000/svg" style="filter: drop-shadow(0 20px 40px rgba(0,0,0,0.3));">
<!-- Document background -->
<rect x="60" y="30" width="160" height="200" rx="8" fill="white" fill-opacity="0.95"/>
<!-- Document lines -->
<rect x="85" y="60" width="80" height="8" rx="4" fill="#CBD5E1"/>
<rect x="85" y="80" width="110" height="6" rx="3" fill="#E2E8F0"/>
<rect x="85" y="95" width="100" height="6" rx="3" fill="#E2E8F0"/>
<rect x="85" y="110" width="90" height="6" rx="3" fill="#E2E8F0"/>
<rect x="85" y="135" width="70" height="8" rx="4" fill="#CBD5E1"/>
<rect x="85" y="155" width="110" height="6" rx="3" fill="#E2E8F0"/>
<rect x="85" y="170" width="95" height="6" rx="3" fill="#E2E8F0"/>
<rect x="85" y="185" width="105" height="6" rx="3" fill="#E2E8F0"/>
<!-- Checkmark circle -->
<circle cx="200" cy="190" r="45" fill="#22C55E"/>
<path d="M180 190L193 203L220 176" stroke="white" stroke-width="8" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</div>
</div>
</div>

32
src/TrueCV.Web/wwwroot/app.css
View File

@@ -83,6 +83,38 @@ html, body {
min-height: 100vh;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
cursor: default;
}
/* Prevent text cursor on non-editable elements */
h1, h2, h3, h4, h5, h6, p, span, div, section, article, header, footer, nav, main, aside,
label, li, ul, ol, table, tr, td, th, thead, tbody, tfoot, img, svg, picture, figure,
path, circle, rect, line, polyline, polygon, ellipse, g, use, text, tspan,
.card, .btn, .alert, .badge, .nav-link, .dropdown-item, .dropdown-toggle,
.breadcrumb, .breadcrumb-item, .progress, .progress-bar, .spinner-border,
.score-ring, .score-ring-container, .stat-card, .stat-item, .feature-card,
.employment-row, .timeline-segment, .file-type-icon,
[role="status"], [role="progressbar"] {
cursor: default;
}
/* Ensure form inputs still have text cursor */
input[type="text"], input[type="email"], input[type="password"], input[type="search"],
input[type="url"], input[type="tel"], input[type="number"], textarea, select,
[contenteditable="true"] {
cursor: text;
}
/* Checkboxes should have pointer cursor */
input[type="checkbox"], input[type="radio"], .form-check-input {
cursor: pointer;
}
/* Buttons and links should have pointer cursor */
a, button, [role="button"], .btn, .btn-close, .navbar-toggler,
input[type="submit"], input[type="button"], input[type="reset"],
.collapsible-header, .drop-zone {
cursor: pointer;
}
/* Typography */