Resume

Pro Resume Builder

:root { --primary: #2563eb; --dark: #1e293b; }
body { font-family: 'Segoe UI', sans-serif; display: flex; margin: 0; height: 100vh; background: #f1f5f9; }

/* Left Editor */
.editor { width: 40%; padding: 30px; overflow-y: auto; background: white; border-right: 1px solid #cbd5e1; }
h3 { border-left: 4px solid var(--primary); padding-left: 10px; margin-top: 25px; }
input, textarea { width: 100%; padding: 10px; margin: 8px 0; border: 1px solid #cbd5e1; border-radius: 6px; box-sizing: border-box; }
.btn { background: var(--primary); color: white; border: none; padding: 10px 15px; border-radius: 6px; cursor: pointer; margin-top: 10px; transition: 0.2s; }
.btn:hover { opacity: 0.9; }

/* Right Preview */
.preview-container { width: 60%; padding: 20px; display: flex; justify-content: center; overflow-y: auto; }
#resume-page { width: 210mm; background: white; padding: 40px; box-shadow: 0 4px 20px rgba(0,0,0,0.1); min-height: 297mm; position: relative; }

.header-flex { display: flex; align-items: center; gap: 20px; border-bottom: 3px solid var(--primary); padding-bottom: 20px; }
#profile-img { width: 120px; height: 120px; border-radius: 8px; object-fit: cover; background: #e2e8f0; display: none; }
.res-name { font-size: 32px; font-weight: 800; margin: 0; text-transform: uppercase; }

.section-title { color: var(--primary); text-transform: uppercase; font-weight: bold; margin-top: 25px; border-bottom: 1px solid #e2e8f0; }
.job-item { margin-bottom: 15px; }
.job-title { font-weight: bold; margin: 5px 0 0 0; }
.job-company { color: #64748b; font-style: italic; margin: 0; }

@media print { .editor { display: none; } .preview-container { width: 100%; padding: 0; } #resume-page { box-shadow: none; margin: 0; width: 100%; } }

ADITYA

email@example.com

Professional Experience

// 1. Theme Color Logic
function changeTheme(color) {
document.documentElement.style.setProperty('--primary', color);
}

// 2. Photo Upload Logic
function previewPhoto(event) {
const reader = new FileReader();
reader.onload = function() {
const output = document.getElementById('profile-img');
output.src = reader.result;
output.style.display = 'block';
}
reader.readAsDataURL(event.target.files[0]);
}

// 3. Simple Text Update
function updateText(id, val) {
document.getElementById(id).innerText = val || "---";
}

// 4. Dynamic Job Logic
function addJobInput() {
const container = document.getElementById('job-inputs');
const div = document.createElement('div');
div.className = 'job-group';
div.innerHTML = `
<hr style="border:0; border-top:1px solid #eee; margin:10px 0;">
<input type="text" placeholder="Job Title" oninput="updateExperience()">
<input type="text" placeholder="Company/Organization" oninput="updateExperience()">
`;
container.appendChild(div);
}

function updateExperience() {
const container = document.getElementById('out-experience');
const inputs = document.querySelectorAll('.job-group');
container.innerHTML = ''; // Clear preview and rebuild

inputs.forEach(group => {
const title = group.querySelectorAll('input')[0].value;
const company = group.querySelectorAll('input')[1].value;

if(title || company) {
container.innerHTML += `
<div class="job-item">
<p class="job-title">${title || 'Position Title'}</p>
<p class="job-company">${company || 'Company Name'}</p>
</div>
`;
}
});
}

The issue body contains a complete standalone HTML document with inline CSS and JavaScript, but names no repository file, requested change, test, or acceptance criteria. There is no concrete entry point to run or definition of done; clarify the intended feature and target location before work begins.

Written by the indexing model from the issue text.