Files
myAi/web/wwwroot/cv-matcher/index.html
T
claude fc2dd721e4
Build and Push Docker Images / build (push) Successful in 29s
Initial commit
2026-05-02 21:31:31 +03:00

100 lines
7.4 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>MyAi.ro · AI CV Matcher</title>
<meta name="description" content="Upload a CV PDF, provide a job link or description, and compare the job requirements against extracted CV context." />
<meta name="author" content="Mihes Gelu" />
<meta property="og:title" content="MyAi.ro · AI CV Matcher" />
<meta property="og:description" content="AI-powered CV-to-job matching demo." />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://myai.ro/cv-matcher/" />
<meta name="theme-color" content="#071326" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
<link rel="stylesheet" href="/css/bootstrap.min.css" />
<link rel="stylesheet" href="/css/myai.css" />
</head>
<body>
<div class="site-shell">
<header class="header" id="top">
<div class="container nav-wrap">
<a class="brand" href="/" aria-label="MyAi.ro home"><span class="brand-mark ai-mark">AI</span><span><span class="brand-text">MyAi.ro</span><small>CV Matcher</small></span></a>
<nav class="nav" id="mainNav" aria-label="Primary navigation"><a href="/">Navigator</a><a href="#matcher">Matcher</a><a href="#contact">Contact</a></nav>
<button class="menu-toggle" id="menuToggle" aria-expanded="false" aria-controls="mainNav"><span></span><span></span><span></span></button>
</div>
</header>
<main>
<section class="hero matcher-hero">
<div class="container hero-grid">
<div class="hero-copy">
<span class="eyebrow">AI CV Matcher</span>
<h1>Upload your CV, add a job link, and see how well they match.</h1>
<p class="hero-text">The backend should extract text from the PDF, create RAG context from your CV, retrieve relevant experience for the job, then score strengths, gaps and next actions.</p>
<div class="hero-actions"><a class="btn btn-primary" href="#matcher">Try matcher</a><a class="btn btn-secondary" href="/">Back to navigator</a></div>
</div>
<div class="hero-card ai-console-card">
<div class="console-line"><span>1</span> PDF text extraction</div>
<div class="console-line"><span>2</span> CV chunking + embeddings</div>
<div class="console-line"><span>3</span> Job URL/description parsing</div>
<div class="console-line"><span>4</span> Match score + evidence</div>
</div>
</div>
</section>
<section class="section" id="matcher">
<div class="container matcher-grid">
<form class="ai-panel" id="cvMatcherForm">
<span class="eyebrow">Input</span>
<h2>CV and job details</h2>
<label class="file-drop" for="cvFile"><strong>Upload CV PDF</strong><span id="cvFileName">PDF only, max size handled by backend</span><input type="file" id="cvFile" accept="application/pdf" required /></label>
<label><span>Job link</span><input type="url" id="jobUrl" placeholder="https://company.com/careers/job" /></label>
<label><span>Or paste job description</span><textarea id="jobDescription" rows="8" placeholder="Paste the job description if the page cannot be crawled."></textarea></label>
<div class="consent-inline"><input type="checkbox" id="gdprConsent" required /><label for="gdprConsent">I agree that my CV is processed for this matching demo. Do not upload sensitive documents unless you trust the deployment.</label></div>
<button id="matchSubmit" type="submit" class="btn btn-primary">Extract CV and match job</button>
<strong id="matcherMsg" class="form-message"></strong>
</form>
<aside class="ai-panel result-panel">
<span class="eyebrow">Result</span>
<h2>Match analysis</h2>
<div id="matchResult" class="empty-result">Upload a CV and provide a job link or description to generate a result.</div>
</aside>
</div>
</section>
<section class="section contact" id="contact">
<div class="container contact-grid">
<div>
<span class="eyebrow">Contact</span>
<h2>Want this adapted for your workflow?</h2>
<p>This form uses the existing template contact API endpoint.</p>
<div class="contact-list"><div><span>Contact person</span><strong>Mihes Gelu</strong></div><div><span>Phone</span><strong><a href="tel:+40722523764">+40 722-523-764</a></strong></div></div>
</div>
<form class="contact-form" id="contactForm">
<label><span>Name</span><input type="text" id="name" placeholder="Your name" required /></label>
<label><span>Email</span><input type="email" id="email" placeholder="name@company.com" required /></label>
<label><span>Message</span><textarea id="message" rows="6" placeholder="Tell me what you want to build." required></textarea></label>
<button id="submit" type="submit" class="btn btn-primary">Send message</button>
<strong id="msgSubmit" class="form-message"></strong>
</form>
</div>
</section>
</main>
<footer class="footer"><div class="container footer-wrap"><p>© <span id="year"></span> MyAi.ro · All rights reserved</p><div class="footer-links footer-legal"><a href="/legal/terms-en.html" target="_blank">Terms</a><a href="/legal/privacy-en.html" target="_blank">Privacy</a><a href="/legal/cookies-en.html" target="_blank">Cookies</a></div><a href="#top" class="back-to-top btn btn-dark btn-sm shadow">Back to top</a></div></footer>
</div>
<div id="contactLoader" class="loader-overlay" style="display:none;"><div class="loader-box">Sending...</div></div>
<div id="cookieBanner" class="cookie-overlay" style="display:none;"><div class="cookie-box"><div class="cookie-text"><strong>Cookies</strong><br>We use necessary cookies and, with your consent, analytics through Google Tag Manager. <a href="/legal/privacy-en.html" target="_blank">Privacy policy</a>.</div><div class="cookie-actions"><button id="cookieReject" class="btn btn-warning btn-sm">Reject</button><button id="cookieNecessary" class="btn btn-warning btn-sm">Necessary only</button><button id="cookieAccept" class="btn btn-primary btn-sm">Accept analytics</button></div></div></div>
<a href="#" id="cookieManage" class="cookie-manage btn btn-dark btn-sm shadow" style="display:none;">Cookie settings</a>
<script src="/js/vendor/jquery-1.12.4.min.js"></script>
<script src="/js/bootstrap.min.js"></script>
<script src="/js/myai.js"></script>
</body>
</html>