mirror of
https://github.com/mmahdium/portfolio.git
synced 2026-08-17 05:24:30 +03:30
- Update section spacing from mb-6 to mb-8 for better visual separation - Enhance heading styles with text-blue-700, increased padding (pb-1.5), and letter-spacing - Improve typography hierarchy by changing font-semibold to font-bold for titles - Increase spacing between list items and skill categories for better readability - Add font-medium styling to dates and institution names for improved emphasis - Enhance bullet point styling with explicit color and font-weight in experience highlights - Reorganize ResumeHeader contact section with improved link styling and layout - Promote Portfolio website link with bold styling and blue color for better visibility - Adjust print-specific spacing to maintain consistency across screen and print layouts - Update resume data with refined content structure - Archive outdated resume content technical specification document
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: 2rem !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: 1rem !important;
|
|
}
|
|
|
|
* {
|
|
print-color-adjust: exact;
|
|
-webkit-print-color-adjust: exact;
|
|
hyphens: none !important;
|
|
-webkit-hyphens: none !important;
|
|
}
|
|
|
|
section {
|
|
break-inside: avoid;
|
|
}
|
|
}
|
|
</style>
|