Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>ATS Resume Generator — Options</title> | |
| <style> | |
| * { | |
| box-sizing: border-box; | |
| margin: 0; | |
| padding: 0; | |
| } | |
| body { | |
| font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; | |
| background: #f8fafc; | |
| color: #1e293b; | |
| padding: 40px 20px; | |
| font-size: 15px; | |
| line-height: 1.6; | |
| } | |
| .container { | |
| max-width: 600px; | |
| margin: 0 auto; | |
| background: #ffffff; | |
| border-radius: 12px; | |
| box-shadow: 0 1px 4px rgba(0,0,0,0.08); | |
| padding: 36px 40px; | |
| } | |
| h1 { | |
| font-size: 22px; | |
| font-weight: 700; | |
| color: #1e293b; | |
| margin-bottom: 6px; | |
| } | |
| .subtitle { | |
| color: #64748b; | |
| font-size: 13px; | |
| margin-bottom: 32px; | |
| } | |
| .section { | |
| margin-bottom: 28px; | |
| } | |
| .section-title { | |
| font-size: 12px; | |
| font-weight: 600; | |
| text-transform: uppercase; | |
| letter-spacing: 0.06em; | |
| color: #94a3b8; | |
| margin-bottom: 14px; | |
| } | |
| label { | |
| display: block; | |
| font-weight: 500; | |
| font-size: 14px; | |
| color: #374151; | |
| margin-bottom: 6px; | |
| } | |
| input[type="url"], | |
| input[type="password"], | |
| input[type="file"] { | |
| width: 100%; | |
| padding: 10px 14px; | |
| border: 1px solid #d1d5db; | |
| border-radius: 8px; | |
| font-size: 14px; | |
| color: #1e293b; | |
| background: #ffffff; | |
| transition: border-color 0.15s; | |
| margin-bottom: 16px; | |
| } | |
| input[type="url"]:focus, | |
| input[type="password"]:focus { | |
| outline: none; | |
| border-color: #2563eb; | |
| box-shadow: 0 0 0 3px rgba(37,99,235,0.1); | |
| } | |
| input[type="file"] { | |
| padding: 8px 14px; | |
| cursor: pointer; | |
| } | |
| textarea { | |
| width: 100%; | |
| min-height: 160px; | |
| padding: 10px 14px; | |
| border: 1px solid #d1d5db; | |
| border-radius: 8px; | |
| font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace; | |
| font-size: 12.5px; | |
| line-height: 1.5; | |
| color: #1e293b; | |
| background: #ffffff; | |
| resize: vertical; | |
| margin-bottom: 8px; | |
| } | |
| textarea:focus { | |
| outline: none; | |
| border-color: #2563eb; | |
| box-shadow: 0 0 0 3px rgba(37,99,235,0.1); | |
| } | |
| .divider { | |
| display: flex; | |
| align-items: center; | |
| text-align: center; | |
| color: #94a3b8; | |
| font-size: 12px; | |
| margin: 18px 0; | |
| } | |
| .divider::before, .divider::after { | |
| content: ''; | |
| flex: 1; | |
| border-bottom: 1px solid #e2e8f0; | |
| } | |
| .divider span { padding: 0 12px; } | |
| #resume_status { | |
| font-size: 13px; | |
| color: #64748b; | |
| background: #f1f5f9; | |
| border-radius: 6px; | |
| padding: 8px 12px; | |
| margin-top: -8px; | |
| margin-bottom: 16px; | |
| word-break: break-all; | |
| } | |
| #save_btn { | |
| display: inline-block; | |
| background: #2563eb; | |
| color: #ffffff; | |
| font-size: 14px; | |
| font-weight: 600; | |
| padding: 11px 28px; | |
| border: none; | |
| border-radius: 8px; | |
| cursor: pointer; | |
| transition: background 0.15s; | |
| } | |
| #save_btn:hover { | |
| background: #1d4ed8; | |
| } | |
| #save_btn:active { | |
| background: #1e40af; | |
| } | |
| #status_msg { | |
| margin-top: 14px; | |
| font-size: 14px; | |
| min-height: 20px; | |
| } | |
| .note { | |
| font-size: 12px; | |
| color: #94a3b8; | |
| margin-top: 4px; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <div style="display:flex;justify-content:space-between;align-items:center;"> | |
| <h1>ATS Resume Generator</h1> | |
| <span id="ext_version" style="font-size:11px;color:#94a3b8;background:#f1f5f9;padding:2px 8px;border-radius:4px;"></span> | |
| </div> | |
| <p class="subtitle">Configure your resume and API settings. These are stored locally in your browser.</p> | |
| <div class="section"> | |
| <div class="section-title">API Configuration</div> | |
| <label for="api_url">API URL</label> | |
| <input id="api_url" type="url" placeholder="https://your-username-spacename.hf.space"> | |
| <label for="api_token">API Token</label> | |
| <input id="api_token" type="password" placeholder="Paste your API secret token"> | |
| <p class="note">Get your API token from: HF Space → Settings → Repository secrets (API_SECRET_TOKEN).</p> | |
| <button id="test_conn_btn" type="button" style="margin-top:8px;padding:8px 18px;font-size:13px;border:1px solid #d1d5db;border-radius:6px;cursor:pointer;background:#fff;color:#374151;">Test Connection</button> | |
| <span id="test_conn_status" style="margin-left:8px;font-size:13px;"></span> | |
| </div> | |
| <div class="section"> | |
| <div class="section-title">Resume</div> | |
| <label for="resume_latex">Resume LaTeX (recommended)</label> | |
| <textarea id="resume_latex" placeholder="Paste your full resume LaTeX source here (\documentclass ... \end{document}). When provided, it is used for keyword matching and compiled to a clean PDF for download."></textarea> | |
| <p id="latex_status">No LaTeX saved.</p> | |
| <p class="note">When LaTeX is saved, it takes priority: keywords are matched against the LaTeX and the chosen keywords are injected and compiled to a PDF (clean formatting). The PDF below is only used if no LaTeX is saved.</p> | |
| <div class="divider"><span>or</span></div> | |
| <label for="resume_file">Resume PDF (fallback)</label> | |
| <input id="resume_file" type="file" accept=".pdf"> | |
| <p id="resume_status">No resume uploaded.</p> | |
| <p class="note">Upload once. The PDF is stored locally in the extension — it is never sent to any server until you click Run on a job page.</p> | |
| <label for="gen_version_default" style="margin-top:16px;">Default Generation Mode</label> | |
| <select id="gen_version_default" style="width:100%;padding:10px 14px;border:1px solid #d1d5db;border-radius:8px;font-size:14px;margin-bottom:8px;"> | |
| <option value="v3" selected>V3 — Bulk + Structured (recommended)</option> | |
| <option value="v2">V2 — Natural AI</option> | |
| <option value="v1">V1 — Structured (keyword placement)</option> | |
| </select> | |
| <p class="note">V3 adds Bulk Generate on LinkedIn search pages (same V1 ATS pipeline). V2 uses AI rewriting. V1 is deterministic keyword placement only.</p> | |
| </div> | |
| <div class="section"> | |
| <div class="section-title">Cover Letter Template</div> | |
| <label for="cover_letter_latex">Default Cover Letter LaTeX</label> | |
| <textarea id="cover_letter_latex" placeholder="Paste your cover letter LaTeX template here. Use placeholders: [Date], [Job Title], [Company Name], [Company Address / Location], [specific product area / mission]"></textarea> | |
| <p id="cl_latex_status" class="note">No custom template — using built-in default.</p> | |
| </div> | |
| <div class="section"> | |
| <div class="section-title">Application Autofill Profile</div> | |
| <label for="autofill_profile_json">Reusable profile JSON</label> | |
| <textarea id="autofill_profile_json" placeholder='{"full_name":"", "email":"", "phone":"", "location":"", "linkedin_url":"", "portfolio_url":"", "current_title":"", "current_company":"", "years_experience":"", "notice_period":"", "work_authorization":"", "requires_sponsorship":"", "visa_status":"", "expected_salary":"", "current_salary":"", "additional_notes":""}'></textarea> | |
| <p class="note">Used by the extension to fill common application fields instantly. Harder questions are answered from this profile plus your resume LaTeX and the current job description.</p> | |
| </div> | |
| <button id="save_btn">Save Settings</button> | |
| <p id="status_msg"></p> | |
| </div> | |
| <script src="../default_resume.js"></script> | |
| <script src="options.js"></script> | |
| </body> | |
| </html> | |