Polish CV components: add print button, fade transition, and list styling
All checks were successful
Deploy with Docker Compose / deploy (push) Successful in 19s
All checks were successful
Deploy with Docker Compose / deploy (push) Successful in 19s
- Add Print button and fade transition between CV variants in CV.vue - Fix bullet point styling with list-disc list-inside across all CV variants - Minor content tweaks: reorder modules, fix date range, reformat text Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -22,10 +22,14 @@ function select(index) {
|
||||
selected.value = index;
|
||||
currentComponent.value = templates[index].component;
|
||||
}
|
||||
|
||||
function print() {
|
||||
window.print();
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<div class="cv-root">
|
||||
<div class="no-print cv-selector">
|
||||
<button
|
||||
v-for="(t, i) in templates"
|
||||
@@ -35,12 +39,19 @@ function select(index) {
|
||||
>
|
||||
{{ t.label }}
|
||||
</button>
|
||||
<button class="cv-btn cv-print-btn" @click="print()">Print</button>
|
||||
</div>
|
||||
<component :is="currentComponent" />
|
||||
<Transition name="cv-fade" mode="out-in">
|
||||
<component :is="currentComponent" :key="selected" />
|
||||
</Transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.cv-root {
|
||||
background: white;
|
||||
}
|
||||
|
||||
.cv-selector {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
@@ -73,6 +84,25 @@ function select(index) {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.cv-print-btn {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
||||
.cv-fade-enter-active,
|
||||
.cv-fade-leave-active {
|
||||
transition: opacity 0.15s ease, transform 0.15s ease;
|
||||
}
|
||||
|
||||
.cv-fade-enter-from {
|
||||
opacity: 0;
|
||||
transform: translateY(6px);
|
||||
}
|
||||
|
||||
.cv-fade-leave-to {
|
||||
opacity: 0;
|
||||
transform: translateY(-6px);
|
||||
}
|
||||
|
||||
@media print {
|
||||
.no-print {
|
||||
display: none !important;
|
||||
|
||||
Reference in New Issue
Block a user