cd5d5cff02
Features: - Profile photo display (right side, inline with header) - Company logos for all major employers (8 logos downloaded) - Short/Long CV toggle for condensed/detailed view - Short descriptions (1-2 lines) for quick overview - Experience separators with border lines Photo Implementation: - Circular photo (120px) on right side of header - Placeholder SVG if photo not uploaded - Instructions in ADDING-YOUR-PHOTO.md - Photo stored in static/images/profile/ Company Logos: - Olympic Broadcasting Services, AENA, SAP, Gigya - Accenture, Everis, Indra, Megabanner - 40px logos displayed inline with experience - Auto-hide if logo missing - Mobile: logos hidden for cleaner layout Short/Long Toggle: - Toggle buttons in action bar (Corto/Largo) - Short mode: shows shortDescription only - Long mode: shows full responsibilities + technologies - CSS-based show/hide (no page reload) - Defaults to short view Layout Updates: - Header: text left, photo right, inline alignment - Experience items: separated by border lines - Responsive: photo centers on mobile - Print-optimized: smaller photo in PDF Data Updates: - Added shortDescription field to Experience struct - 13 short descriptions for all positions (EN/ES) - Added companyLogo field with filename mapping - JSON updated with all new fields Tech: - Pure CSS toggle (no HTMX needed) - Vanilla JavaScript for button states - Maintains bilingual support (ES/EN)
154 lines
4.9 KiB
HTML
154 lines
4.9 KiB
HTML
<!-- CV Content Template - Minimal Design -->
|
|
<div class="cv-header">
|
|
<div class="cv-header-left">
|
|
<div class="cv-header-main">
|
|
<h1 class="cv-name">{{.CV.Personal.Name}}</h1>
|
|
<h2 class="cv-title">{{.CV.Personal.Title}}</h2>
|
|
</div>
|
|
<div class="cv-contact">
|
|
<div class="contact-item">{{.CV.Personal.Location}}</div>
|
|
<div class="contact-item"><a href="mailto:{{.CV.Personal.Email}}">{{.CV.Personal.Email}}</a></div>
|
|
<div class="contact-item">{{.CV.Personal.Phone}}</div>
|
|
<div class="contact-item"><a href="{{.CV.Personal.LinkedIn}}" target="_blank">LinkedIn</a></div>
|
|
<div class="contact-item"><a href="{{.CV.Personal.GitHub}}" target="_blank">GitHub</a></div>
|
|
</div>
|
|
</div>
|
|
<div class="cv-header-right">
|
|
<div class="cv-photo">
|
|
<img src="/static/images/profile/photo.jpg" alt="{{.CV.Personal.Name}}" onerror="this.src='/static/images/profile/placeholder.svg'">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Summary -->
|
|
<section class="cv-section">
|
|
<h3 class="section-title">{{if eq .Lang "es"}}Resumen{{else}}Summary{{end}}</h3>
|
|
<p class="summary-text">{{.CV.Summary}}</p>
|
|
</section>
|
|
|
|
<!-- Experience -->
|
|
<section class="cv-section">
|
|
<h3 class="section-title">{{if eq .Lang "es"}}Experiencia Laboral{{else}}Work History{{end}}</h3>
|
|
|
|
{{range .CV.Experience}}
|
|
<div class="experience-item">
|
|
<div class="experience-header">
|
|
{{if .CompanyLogo}}
|
|
<div class="company-logo">
|
|
<img src="/static/images/companies/{{.CompanyLogo}}" alt="{{.Company}}" onerror="this.style.display='none'">
|
|
</div>
|
|
{{end}}
|
|
<div class="experience-title">
|
|
<h4 class="position">{{.Position}}</h4>
|
|
<div class="company">{{.Company}}, {{.Location}}</div>
|
|
</div>
|
|
<div class="experience-period">
|
|
{{.StartDate}} - {{if .Current}}{{if eq $.Lang "es"}}Presente{{else}}Present{{end}}{{else}}{{.EndDate}}{{end}}
|
|
</div>
|
|
</div>
|
|
|
|
{{if .ShortDescription}}
|
|
<p class="short-desc">{{.ShortDescription}}</p>
|
|
{{end}}
|
|
|
|
<ul class="responsibilities long-only">
|
|
{{range .Responsibilities}}
|
|
<li>{{.}}</li>
|
|
{{end}}
|
|
</ul>
|
|
|
|
{{if .Technologies}}
|
|
<div class="technologies long-only">
|
|
{{range $index, $tech := .Technologies}}{{if $index}}, {{end}}{{$tech}}{{end}}
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
{{end}}
|
|
</section>
|
|
|
|
<!-- Education -->
|
|
<section class="cv-section">
|
|
<h3 class="section-title">{{if eq .Lang "es"}}Formación{{else}}Education{{end}}</h3>
|
|
|
|
{{range .CV.Education}}
|
|
<div class="education-item">
|
|
<div class="education-header">
|
|
<h4 class="degree">{{.Degree}}</h4>
|
|
<div class="education-period">{{.StartDate}} - {{.EndDate}}</div>
|
|
</div>
|
|
<div class="institution">{{.Institution}}, {{.Location}}</div>
|
|
</div>
|
|
{{end}}
|
|
</section>
|
|
|
|
<!-- Skills -->
|
|
<section class="cv-section">
|
|
<h3 class="section-title">{{if eq .Lang "es"}}Competencias{{else}}Skills{{end}}</h3>
|
|
|
|
{{range .CV.Skills.Technical}}
|
|
<div class="skill-block">
|
|
<h4 class="skill-title">{{.Category}}</h4>
|
|
<p class="skill-list">
|
|
{{range $index, $item := .Items}}{{if $index}}, {{end}}{{$item}}{{end}}
|
|
</p>
|
|
</div>
|
|
{{end}}
|
|
</section>
|
|
|
|
<!-- Projects -->
|
|
{{if .CV.Projects}}
|
|
<section class="cv-section">
|
|
<h3 class="section-title">{{if eq .Lang "es"}}Proyectos{{else}}Projects{{end}}</h3>
|
|
|
|
{{range .CV.Projects}}
|
|
<div class="project-item">
|
|
<div class="project-header">
|
|
<h4 class="project-name">{{.Name}}</h4>
|
|
<div class="project-period">{{.Period}}</div>
|
|
</div>
|
|
<div class="project-role">{{.Role}}</div>
|
|
<p class="project-description">{{.Description}}</p>
|
|
</div>
|
|
{{end}}
|
|
</section>
|
|
{{end}}
|
|
|
|
<!-- Certifications -->
|
|
{{if .CV.Certifications}}
|
|
<section class="cv-section">
|
|
<h3 class="section-title">{{if eq .Lang "es"}}Certificaciones{{else}}Certifications{{end}}</h3>
|
|
|
|
{{range .CV.Certifications}}
|
|
<div class="cert-item">
|
|
<strong>{{.Name}}</strong> - {{.Issuer}} ({{.Date}})
|
|
</div>
|
|
{{end}}
|
|
</section>
|
|
{{end}}
|
|
|
|
<!-- Awards -->
|
|
{{if .CV.Awards}}
|
|
<section class="cv-section">
|
|
<h3 class="section-title">{{if eq .Lang "es"}}Premios{{else}}Awards{{end}}</h3>
|
|
|
|
{{range .CV.Awards}}
|
|
<div class="award-item">
|
|
<strong>{{.Title}}</strong> - {{.Issuer}} ({{.Date}})
|
|
</div>
|
|
{{end}}
|
|
</section>
|
|
{{end}}
|
|
|
|
<!-- Languages -->
|
|
<section class="cv-section">
|
|
<h3 class="section-title">{{if eq .Lang "es"}}Idiomas{{else}}Languages{{end}}</h3>
|
|
|
|
<div class="languages-list">
|
|
{{range .CV.Languages}}
|
|
<div class="language-item">
|
|
<strong>{{.Language}}</strong>: {{.Proficiency}}
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
</section>
|