diff --git a/internal/handlers/cv.go b/internal/handlers/cv.go
index 1abc793..bae546a 100644
--- a/internal/handlers/cv.go
+++ b/internal/handlers/cv.go
@@ -185,6 +185,7 @@ func (h *CVHandler) CVContent(w http.ResponseWriter, r *http.Request) {
}
// ExportPDF handles PDF export requests using chromedp
+// TEMPORARILY DISABLED - Work in progress
func (h *CVHandler) ExportPDF(w http.ResponseWriter, r *http.Request) {
// Get language from query parameter
lang := r.URL.Query().Get("lang")
@@ -198,33 +199,90 @@ func (h *CVHandler) ExportPDF(w http.ResponseWriter, r *http.Request) {
return
}
- // Construct URL to generate PDF from
- // Use localhost instead of the actual server address to avoid network overhead
- url := fmt.Sprintf("http://%s/?lang=%s", h.serverAddr, lang)
+ log.Printf("PDF export requested but temporarily disabled (redirecting to print friendly)")
- log.Printf("Generating PDF from URL: %s", url)
-
- // Generate PDF
- pdfData, err := h.pdfGenerator.GenerateFromURL(r.Context(), url)
- if err != nil {
- log.Printf("PDF generation failed: %v", err)
- HandleError(w, r, InternalError(err))
- return
+ // Return HTML with message and redirect to print friendly
+ message := "PDF Export - Work in Progress"
+ body := "The PDF export feature is currently being improved. Please use the Print Friendly button instead (Ctrl+P or Cmd+P to save as PDF)."
+ if lang == "es" {
+ message = "Exportación PDF - En Desarrollo"
+ body = "La función de exportación a PDF está siendo mejorada. Por favor, usa el botón Imprimir Amigable en su lugar (Ctrl+P o Cmd+P para guardar como PDF)."
}
- // Set response headers
- filename := fmt.Sprintf("CV-Juan-Andres-Moreno-Rubio-%s.pdf", lang)
- w.Header().Set("Content-Type", "application/pdf")
- w.Header().Set("Content-Disposition", fmt.Sprintf("attachment; filename=%s", filename))
- w.Header().Set("Content-Length", fmt.Sprintf("%d", len(pdfData)))
+ w.Header().Set("Content-Type", "text/html; charset=utf-8")
+ w.WriteHeader(http.StatusOK)
- // Write PDF data
- if _, err := w.Write(pdfData); err != nil {
- log.Printf("Failed to write PDF response: %v", err)
- return
+ redirectMsg := "Redirecting in 5 seconds..."
+ if lang == "es" {
+ redirectMsg = "Redirigiendo en 5 segundos..."
}
- log.Printf("Successfully generated PDF: %s (%d bytes)", filename, len(pdfData))
+ html := fmt.Sprintf(`
+
+
+
+
+ %s
+
+
+
+
+
+
+`, lang, message, lang, message, body, redirectMsg)
+
+ w.Write([]byte(html))
}
// splitSkills splits skill categories between left (page 1) and right (page 2) sidebars
diff --git a/static/css/main.css b/static/css/main.css
index d52ef6c..30724a3 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -78,6 +78,12 @@ a:hover {
height: 100%;
}
+.site-title-left {
+ display: flex;
+ align-items: center;
+ gap: 0.75rem;
+}
+
.site-icon {
color: #fff;
flex-shrink: 0;
@@ -88,6 +94,14 @@ a:hover {
padding: 0 .5rem 0 1.5rem;
}
+/* Mobile icon hidden by default, shown only on mobile */
+.site-icon-mobile {
+ display: none;
+ color: #fff;
+ flex-shrink: 0;
+ margin-right: 0.5rem;
+}
+
/* Site logo and title links */
.site-logo-link,
.site-title-link {
@@ -236,7 +250,7 @@ iconify-icon {
position: absolute;
width: 24px;
height: 24px;
- left: 3px;
+ left: 2px;
background: white;
border-radius: 50%;
transition: transform 0.3s ease;
@@ -246,7 +260,7 @@ iconify-icon {
}
.icon-toggle input:checked + .icon-toggle-slider::before {
- transform: translateX(45px);
+ transform: translateX(43px);
}
.icon-toggle input:checked + .icon-toggle-slider {
@@ -264,11 +278,11 @@ iconify-icon {
}
.icon-toggle-slider .icon-left {
- left: 8px;
+ left: 6px;
}
.icon-toggle-slider .icon-right {
- right: 7px;
+ right: 6px;
}
.icon-toggle input:not(:checked) + .icon-toggle-slider .icon-left {
@@ -287,7 +301,7 @@ iconify-icon {
}
.icon-toggle input:checked + .icon-toggle-slider .icon-right {
- color: #fff;
+ color: #333;
font-weight: bold;
}
@@ -320,7 +334,8 @@ iconify-icon {
display: inline-flex;
align-items: center;
justify-content: center;
- gap: 0.5rem;
+ /* gap: 0.5rem; */
+ gap: 0rem;
text-decoration: none;
white-space: nowrap;
letter-spacing: -0.01em;
@@ -329,6 +344,7 @@ iconify-icon {
transition: all 0.2s ease;
outline: none !important;
box-shadow: none !important;
+ min-width: 50px!important;
}
.selector-btn:focus,
@@ -520,7 +536,7 @@ iconify-icon {
.theme-clean .cv-main {
grid-column: 1 !important;
- padding: 2rem !important;
+ padding: 2rem 3rem!important;
transition: all 0.3s ease-in-out;
}
@@ -665,7 +681,7 @@ iconify-icon {
.sidebar-content {
font-family: 'Quicksand', sans-serif;
- font-size: 0.95em;
+ font-size: 0.95rem;
font-weight: 400;
line-height: 1.5;
}
@@ -730,6 +746,9 @@ iconify-icon {
.cv-header-left {
flex: 1;
+ position: relative;
+ /* Desktop: Add right padding to make room for the photo */
+ padding-right: 185px; /* Photo width (150px) + gap (35px) */
}
.cv-photo {
@@ -739,12 +758,11 @@ iconify-icon {
overflow: hidden;
border: 3px solid white;
box-shadow: 0 2px 8px rgba(0,0,0,0.15);
-
- /* Colocación a manopla de la foto :) */
- margin: 15px;
- {{/* top: 25px; */}}
- position: relative;
- right: 5px;
+
+ /* Desktop: Position photo in the right padding area */
+ position: absolute;
+ top: 15px;
+ right: 15px; /* Margin from the right edge */
}
.cv-photo img {
@@ -973,7 +991,7 @@ iconify-icon {
.short-desc {
color: var(--text-dark);
- font-size: 0.9rem;
+ font-size: 0.95rem;
line-height: 1.6;
margin-top: 0.5rem;
}
@@ -993,7 +1011,7 @@ iconify-icon {
padding-left: 1.2rem;
margin-bottom: 0.4rem;
position: relative;
- font-size: 0.9rem;
+ font-size: 0.95rem;
color: var(--text-dark);
line-height: 1.5;
}
@@ -1047,7 +1065,7 @@ iconify-icon {
/* Education */
.education-item {
margin-bottom: 1rem;
- font-size: 0.9rem;
+ font-size: 0.95rem;
line-height: 1.6;
color: var(--text-dark);
}
@@ -1061,7 +1079,7 @@ iconify-icon {
}
.language-item {
- font-size: 1.1rem!important;
+ font-size: 0.95rem!important;
color: var(--text-dark);
margin-bottom: 0.3rem!important;
line-height: 1.4!important;
@@ -1258,7 +1276,7 @@ iconify-icon {
}
.project-desc {
- font-size: 0.9rem;
+ font-size: 0.95rem;
color: var(--text-dark);
margin-top: 0.5rem;
line-height: 1.6;
@@ -1276,7 +1294,7 @@ iconify-icon {
margin-top: -1.5rem;
padding-top: 0rem;
text-align: center;
- font-size: 0.95em;
+ font-size: 0.95rem;
color: var(--text-gray);
}
@@ -1298,7 +1316,7 @@ iconify-icon {
margin-bottom: 0!important;
line-height: 1.4!important;
margin-left: 2rem!important;
- font-size: 1.1rem!important;
+ font-size: 0.95rem!important;
}
.reference-item a {
@@ -1422,9 +1440,9 @@ footer {
font-size: 1.8rem;
}
- .cv-photo {
- width: 120px;
- height: 150px;
+ .intro-text {
+ font-size: 0.9em;
+ margin-top: 15px;
}
.action-bar-content {
@@ -1447,11 +1465,6 @@ footer {
gap: 0.25rem;
}
- .intro-text {
- font-size: 0.9em;
- margin-top: 15px;
- }
-
/* ========== Hide header controls, show in menu ========== */
/* Keep language selector visible in header */
.view-controls-center {
@@ -1702,7 +1715,7 @@ a:focus {
margin-bottom: 0!important;
line-height: 1.4!important;
margin-left: 2rem!important;
- font-size: 1.1rem!important;
+ font-size: 0.95rem!important;
}
/* Award item with logo */
@@ -1839,7 +1852,7 @@ a:focus {
.course-desc {
margin-top: 0.5em;
color: var(--text-gray);
- font-size: 0.95em;
+ font-size: 0.95rem;
}
.reference-item {
@@ -1929,6 +1942,11 @@ a:focus {
margin-bottom: 0;
padding: 0;
}
+
+ .site-title {
+ justify-content: space-between;
+ width: 100%;
+ }
}
/* ===============================================
@@ -2082,7 +2100,7 @@ a:focus {
.submenu-content {
position: fixed; /* Changed from absolute to fixed to break out of parent overflow */
- left: 278px; /* Slight overlap with menu to eliminate any gap */
+ left: 232px; /* Slight overlap with menu to eliminate any gap */
background: #ffffff;
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.15);
border-radius: 8px;
@@ -2279,6 +2297,11 @@ html {
padding: 0.75rem 1rem;
font-size: 0.9rem;
}
+
+ .site-title {
+ justify-content: space-between;
+ width: 100%;
+ }
}
/* Hide menu overlay on print */
@@ -2831,3 +2854,281 @@ html {
margin-top: 10px !important;
}
}
+
+/* ========================================
+ Responsive: Small Screens (up to 540px)
+ ======================================== */
+
+/* ========================================
+ Responsive: Tablet Screens - Center Photo (up to 768px)
+ ======================================== */
+
+@media (max-width: 768px) {
+ /* ========================================
+ TYPOGRAPHY - Subtle font size reductions
+ ======================================== */
+ .cv-name {
+ text-align: center;
+ font-size: 1.6rem;
+ }
+
+ .years-experience {
+ text-align: center;
+ font-size: 1.1em;
+ }
+
+ .section-title {
+ font-size: 1.2em;
+ }
+
+ .sidebar-title {
+ font-size: 1.2em;
+ }
+
+ .experience-period,
+ .experience-separator,
+ .experience-location,
+ .experience-duration {
+ font-size: 0.95rem;
+ }
+
+ .position {
+ font-size: 0.95rem;
+ }
+
+ .short-desc,
+ .responsibilities li {
+ font-size: 0.85rem;
+ }
+
+ /* ========================================
+ TEXT ALIGNMENT FIXES - Selective alignment
+ ======================================== */
+ /* Keep justified for intro and skills */
+ .intro-text,
+ .summary-text {
+ text-align: justify;
+ font-size: 0.85rem;
+ line-height: 1.5;
+ }
+
+ .intro-text {
+ margin-top: 0;
+ width: 100%;
+ }
+
+ /* Left-align for course/project descriptions */
+ .course-desc,
+ .project-desc {
+ text-align: left !important;
+ font-size: 0.85rem !important;
+ line-height: 1.5;
+ }
+
+ /* ========================================
+ HEADER LAYOUT - Centered photo
+ ======================================== */
+ .cv-header-content {
+ flex-direction: column;
+ align-items: center;
+ gap: 1rem;
+ }
+
+ .cv-header-left {
+ width: 100%;
+ position: static;
+ padding-right: 0;
+ }
+
+ .cv-photo {
+ position: static;
+ width: auto;
+ height: auto;
+ max-width: 250px;
+ margin: 1.5rem auto;
+ text-align: center;
+ right: auto;
+ top: auto;
+ }
+
+ .cv-photo img {
+ width: 100%;
+ height: auto;
+ max-height: none;
+ }
+
+ /* ========================================
+ UNIFIED LOGO/ICON SIZING - Consistent 60px
+ ======================================== */
+ .company-logo,
+ .course-icon,
+ .project-icon,
+ .award-logo {
+ width: 60px !important;
+ height: 60px !important;
+ flex-shrink: 0;
+ }
+
+ .company-logo img,
+ .course-icon img,
+ .project-icon img,
+ .award-logo img {
+ width: 60px !important;
+ height: 60px !important;
+ object-fit: contain;
+ }
+
+ .default-company-icon,
+ .default-course-icon,
+ .default-project-icon,
+ .default-award-icon {
+ width: 60px !important;
+ height: 60px !important;
+ }
+
+ /* ========================================
+ CONSISTENT ITEM LAYOUT - Uniform spacing
+ ======================================== */
+ .experience-item,
+ .course-item,
+ .project-item,
+ .award-item {
+ display: flex;
+ flex-direction: row;
+ gap: 1rem !important;
+ align-items: flex-start;
+ margin-bottom: 2rem !important;
+ padding-bottom: 1.5rem !important;
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+ }
+
+ .experience-item {
+ margin-bottom: 1.8rem !important;
+ }
+
+ .experience-content,
+ .course-content,
+ .project-content,
+ .award-content {
+ flex: 1;
+ min-width: 0;
+ }
+
+ /* ========================================
+ FONT SIZE CONSISTENCY - Titles and descriptions
+ ======================================== */
+ .course-title,
+ .project-title,
+ .award-item strong {
+ font-size: 0.95rem !important;
+ line-height: 1.4;
+ }
+
+ .course-item small,
+ .project-item small,
+ .award-item small {
+ font-size: 0.8rem !important;
+ }
+
+ .course-desc,
+ .project-desc,
+ .award-desc {
+ font-size: 0.85rem !important;
+ line-height: 1.5;
+ }
+
+ /* ========================================
+ RESPONSIBILITIES MOBILE OPTIMIZATION
+ ======================================== */
+ .responsibilities li:has(img),
+ .responsibilities li:has(iconify-icon) {
+ grid-template-columns: 60px 1fr !important;
+ gap: 0.75rem !important;
+ margin-bottom: 0.75rem !important;
+ }
+
+ .responsibilities li img,
+ .responsibilities li iconify-icon.default-company-icon {
+ width: 60px !important;
+ height: 60px !important;
+ }
+
+ /* ========================================
+ SIDEBAR ITEMS MOBILE OPTIMIZATION
+ ======================================== */
+ .language-item,
+ .reference-item,
+ .other-content {
+ margin-bottom: 0 !important;
+ line-height: 1.4 !important;
+ margin-left: 1rem !important;
+ font-size: 0.85rem !important;
+ }
+}
+
+/* ========================================
+ Responsive: All Mobile Screens (up to 540px)
+ ======================================== */
+
+@media (max-width: 540px) {
+ /* Hide year from title in mobile view */
+ .site-title-year {
+ display: none;
+ }
+
+ /* Hide desktop logo, show mobile icon in title */
+ .site-logo-link {
+ display: none;
+ }
+
+ .site-icon-mobile {
+ display: inline-flex;
+ }
+
+ /* Align language selector to the right */
+ .site-title {
+ justify-content: space-between;
+ width: 100%;
+ }
+
+ .language-selector {
+ margin-left: auto;
+ padding-left: 0;
+ margin-right: 0rem;
+ }
+
+ /* ========== Language Selector - Show Short Names Only ========== */
+ .language-selector .selector-btn {
+ position: relative;
+ padding: 0.4rem 0.75rem;
+ min-width: 40px;
+ font-size: 0; /* Hide actual text */
+ overflow: visible;
+ transition: font-size 0.3s ease;
+ display: inline-flex;
+ justify-content: center;
+ align-items: center;
+ }
+
+ /* Show only short version (EN/ES) */
+ .language-selector .selector-btn::before {
+ content: attr(data-short);
+ font-size: 0.95rem;
+ opacity: 1;
+ transition: opacity 0.3s ease;
+ display: block;
+ width: 100%;
+ text-align: center;
+ }
+
+ /* Keep short names on hover (no expansion) */
+ .language-selector .selector-btn:hover {
+ font-size: 0;
+ min-width: 40px;
+ }
+
+ .language-selector .selector-btn:hover::before {
+ content: attr(data-short);
+ opacity: 1;
+ }
+}
diff --git a/static/css/print.css b/static/css/print.css
index cbd4a3d..6b8f3b1 100644
--- a/static/css/print.css
+++ b/static/css/print.css
@@ -44,22 +44,52 @@
display: none !important;
}
- /* Hide ALL icons in print */
- iconify-icon,
- .section-icon,
- .default-company-icon,
- .default-project-icon,
- .default-course-icon,
- .default-award-icon {
- display: none !important;
+ /* ===================================
+ SHOW ALL ICONS, LOGOS, AND BADGES - Print Default
+ =================================== */
+
+ /* Section title icons - smaller for print */
+ .section-icon {
+ width: 16px !important;
+ height: 16px !important;
+ vertical-align: middle !important;
+ margin-right: 4px !important;
}
- /* Hide company/project/course logos */
+ /* Company/Project/Course logos - compact for print */
.company-logo,
.project-icon,
.course-icon,
.award-logo {
- display: none !important;
+ width: 40px !important;
+ height: 40px !important;
+ flex-shrink: 0 !important;
+ }
+
+ .company-logo img,
+ .project-icon img,
+ .course-icon img,
+ .award-logo img {
+ width: 40px !important;
+ height: 40px !important;
+ object-fit: contain !important;
+ }
+
+ /* Default fallback icons - show at print size */
+ .default-company-icon,
+ .default-project-icon,
+ .default-course-icon,
+ .default-award-icon {
+ width: 40px !important;
+ height: 40px !important;
+ }
+
+ /* Badges - keep visible for print */
+ .current-badge,
+ .expired-badge,
+ .maintained-badge {
+ font-size: 7pt !important;
+ padding: 1px 4px !important;
}
/* ===================================
@@ -191,12 +221,12 @@
PHOTO - FIXED ASPECT RATIO (3:4 Portrait)
=================================== */
.cv-photo {
- width: 60px !important;
- height: 80px !important; /* Maintains 3:4 ratio */
+ width: 90px !important;
+ height: 120px !important; /* Maintains 3:4 ratio */
object-fit: contain !important; /* Show full photo, no crop */
border: none !important; /* Remove border */
box-shadow: none !important;
- margin: 10px 15px 10px 10px !important;
+ margin: 0px 0px 20px 20px !important;
page-break-inside: avoid;
}
@@ -241,10 +271,6 @@
margin-bottom: 3mm !important; /* More space for lists */
}
- .section-icon {
- display: none; /* Hide section icons in print */
- }
-
.summary-text {
font-size: 9pt;
line-height: 1.5;
@@ -254,6 +280,8 @@
EXPERIENCE - REDUCED SPACING (60px → 26px)
=================================== */
.experience-item {
+ display: flex !important; /* Show logos side-by-side with content */
+ gap: 12px !important;
margin-bottom: 4mm !important; /* ~15px, down from 40px */
padding-bottom: 3mm !important; /* ~11px, down from 32px */
border-bottom: 0.5pt solid #dddddd !important;
@@ -305,7 +333,7 @@
line-height: 1.4 !important;
}
- /* All logos already hidden above - no exceptions */
+ /* Logos are visible at 40x40 for compact print layout */
/* ===================================
PROJECTS & COURSES
@@ -313,7 +341,8 @@
.project-item,
.course-item,
.award-item {
- display: block !important; /* Remove flex/grid layouts for print */
+ display: flex !important; /* Show logos side-by-side with content */
+ gap: 12px !important;
margin-bottom: 4mm !important;
padding-bottom: 3mm !important;
border-bottom: 0.5pt solid #dddddd !important;
@@ -345,13 +374,13 @@
font-weight: 600 !important;
}
- /* Icons/logos already hidden - display: none above */
+ /* Logos visible at 40x40 - default icons remain hidden */
/* Consistent item titles */
.project-title,
.course-title,
- .award-item strong,
- .course-item strong {
+ .experience-title,
+ .award-title {
font-size: 10pt !important;
font-weight: 600 !important;
line-height: 1.3 !important;
@@ -382,14 +411,6 @@
margin-left: 0.5mm !important;
}
- /* Course title styling to match experience */
- .course-title {
- font-size: 10pt !important;
- font-weight: 600 !important;
- line-height: 1.3 !important;
- margin-bottom: 0.5mm !important;
- }
-
/* Course metadata (date, location) - match experience style */
.course-period,
.course-location,
@@ -531,15 +552,6 @@
font-weight: 600;
}
- /* ===================================
- BADGES - Hidden for minimal print
- =================================== */
- .current-badge,
- .expired-badge,
- .maintained-badge {
- display: none !important;
- }
-
/* ===================================
CV LENGTH TOGGLE - Force Short Version for Print Friendly
=================================== */
diff --git a/templates/cv-content.html b/templates/cv-content.html
index eaa9f65..2b06446 100644
--- a/templates/cv-content.html
+++ b/templates/cv-content.html
@@ -41,12 +41,15 @@
-
-
-