mirror of
https://github.com/mmahdium/portfolio.git
synced 2026-08-17 05:24:30 +03:30
mahdiarghyani
df9b181a90
- Add print media queries to main.css for proper PDF export formatting - Ensure white background and light color scheme when printing - Refactor ResumeAdditionalInfo component to display skills in categorized format - Remove languages and certifications from additional info section - Add ResumeLanguages component for dedicated language display - Optimize spacing with print-specific margin utilities across all resume sections - Improve text wrapping and hyphenation in ResumeExperience component - Enhance ResumeHeader layout with print-optimized image sizing - Update resume data structure to support new component organization - Add research documentation on mentioning AI skills in resume - Update PDF export endpoint to work with refactored component structure - Remove outdated chat history file
86 lines
1.8 KiB
Vue
86 lines
1.8 KiB
Vue
<script setup lang="ts">
|
|
const { resume } = useResumeData()
|
|
</script>
|
|
|
|
<template>
|
|
<div class="resume-wrapper">
|
|
<!-- A4 Container -->
|
|
<div class="resume-container">
|
|
<!-- Single-column vertical stack -->
|
|
<div class="resume-content">
|
|
<!-- Header with Photo + Name + Contact -->
|
|
<ResumeHeader :basics="resume.basics" />
|
|
|
|
<!-- Summary -->
|
|
<ResumeSummary :summary="resume.basics.summary" />
|
|
|
|
<!-- Skills & Qualifications -->
|
|
<ResumeAdditionalInfo :skills="resume.skills" />
|
|
|
|
<!-- Experience -->
|
|
<ResumeExperience :work="resume.work" />
|
|
|
|
<!-- Education -->
|
|
<ResumeEducation :education="resume.education" />
|
|
|
|
<!-- Languages & Certifications -->
|
|
<ResumeLanguages :languages="resume.languages" :certifications="resume.certificates" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.resume-wrapper {
|
|
background: #f3f4f6;
|
|
display: flex;
|
|
justify-content: center;
|
|
padding: 1rem;
|
|
}
|
|
|
|
.resume-container {
|
|
background: white;
|
|
box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1);
|
|
max-width: 210mm;
|
|
width: 100%;
|
|
}
|
|
|
|
.resume-content {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding: 1.5rem !important;
|
|
}
|
|
|
|
@media print {
|
|
.resume-wrapper {
|
|
background: white !important;
|
|
padding: 0 !important;
|
|
display: block !important;
|
|
}
|
|
|
|
.resume-container {
|
|
width: 210mm !important;
|
|
max-width: none !important;
|
|
box-shadow: none !important;
|
|
border: none !important;
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
}
|
|
|
|
.resume-content {
|
|
padding: 0.75rem !important;
|
|
}
|
|
|
|
* {
|
|
print-color-adjust: exact;
|
|
-webkit-print-color-adjust: exact;
|
|
hyphens: none !important;
|
|
-webkit-hyphens: none !important;
|
|
}
|
|
|
|
section {
|
|
break-inside: avoid;
|
|
}
|
|
}
|
|
</style>
|