adamf/web_server
1
1
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases Wiki Activity

Polish CV components: add print button, fade transition, and list styling
All checks were successful
Deploy with Docker Compose / deploy (push) Successful in 19s
Details

Browse Source 
- 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:
Adam French
2026-03-27 14:21:42 +00:00
parent 31d4b4c268
commit f7d69f048e
5 changed files with 76 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
vue/src/views/CV/CV.vue
View File

@@ -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;

25
vue/src/views/CV/CVBackend.vue
View File

@@ -93,8 +93,8 @@ import Project from "./Project.vue";
<p>
CLI tool for building and navigating interactive code
tutorials, with version-traversal semantics inspired by Git.
Designed for robustness with comprehensive error handling and
structured file operations.
Designed for robustness with comprehensive error handling
and structured file operations.
</p>
</Project>
<Project class="border-b border-dotted">
@@ -153,18 +153,14 @@ import Project from "./Project.vue";
<div
class="flex-row flex place-content-between m-auto place-items-center"
>
<small>81.1% — First Class Honours</small>
<small>First Class Honours (81.1%)</small>
<small>2021–2025</small>
</div>
<small
>BSc Computer Science with Mathematics
(International)</small
>
<ul>
<li>Algorithms & Data Structures I & II</li>
<small>BSc Computer Science with Mathematics </small>
<ul class="list-disc list-inside">
<li>Compiler Design and Construction</li>
<li>Graph Algorithms & Complexity Theory</li>
<li>Formal Languages & Finite Automata</li>
<li>Algorithms & Data Structures I & II</li>
<li>Databases · Computer Processors</li>
</ul>
</div>
@@ -176,12 +172,11 @@ import Project from "./Project.vue";
<small>Year abroad</small>
<small>2023–2024</small>
</div>
<ul>
<ul class="list-disc list-inside">
<li>Applied Cryptography</li>
<li>Introduction to Computer Graphics</li>
<li>
Introduction to Rings and Fields with Applications
</li>
<li>Introduction to Rings and Fields with Applications</li>
<li>Formal Languages & Finite Automata</li>
</ul>
</div>
</div>
@@ -209,7 +204,7 @@ import Project from "./Project.vue";
</p>
</Project>
<h2>Interests</h2>
<ul>
<ul class="list-disc list-inside">
<li>Leetcode — daily competitive problem solving</li>
<li>Learning Mandarin</li>
<li>Rhythm Games</li>

19
vue/src/views/CV/CVFrontend.vue
View File

@@ -154,18 +154,13 @@ import Project from "./Project.vue";
<small>81.1% — First Class Honours</small>
<small>2021–2025</small>
</div>
<small
>BSc Computer Science with Mathematics
(International)</small
>
<ul>
<small>BSc Computer Science with Mathematics </small>
<ul class="list-disc list-inside">
<li>Algorithms & Data Structures I & II</li>
<li>Compiler Design and Construction</li>
<li>Formal Languages & Finite Automata</li>
<li>Graph Algorithms & Complexity Theory</li>
<li>
Machine Learning · Databases · Computer Processors
</li>
<li>Machine Learning & Databases & Computer Processors</li>
</ul>
</div>
<div class="flex-1 pl-3">
@@ -176,12 +171,10 @@ import Project from "./Project.vue";
<small>Year abroad</small>
<small>2023–2024</small>
</div>
<ul>
<ul class="list-disc list-inside">
<li>Applied Cryptography</li>
<li>Introduction to Computer Graphics</li>
<li>
Introduction to Rings and Fields with Applications
</li>
<li>Introduction to Rings and Fields with Applications</li>
</ul>
</div>
</div>
@@ -209,7 +202,7 @@ import Project from "./Project.vue";
</p>
</Project>
<h2>Interests</h2>
<ul>
<ul class="list-disc list-inside">
<li>Leetcode — daily competitive problem solving</li>
<li>Learning Mandarin</li>
<li>Rhythm Games</li>

13
vue/src/views/CV/CVGeneral.vue
View File

@@ -150,14 +150,11 @@ import Project from "./Project.vue";
<div
class="flex-row flex place-content-between m-auto place-items-center"
>
<small>81.1% — First Class Honours</small>
<small>First Class Honours (81.1%)</small>
<small>2021–2025</small>
</div>
<small
>BSc Computer Science with Mathematics
(International)</small
>
<ul>
<small>BSc Computer Science with Mathematics </small>
<ul class="list-disc list-inside">
<li>Algorithms & Data Structures I & II</li>
<li>Compiler Design and Construction</li>
<li>Formal Languages & Finite Automata</li>
@@ -175,7 +172,7 @@ import Project from "./Project.vue";
<small>Year abroad</small>
<small>2023–2024</small>
</div>
<ul>
<ul class="list-disc list-inside">
<li>Applied Cryptography</li>
<li>Introduction to Computer Graphics</li>
<li>
@@ -208,7 +205,7 @@ import Project from "./Project.vue";
</p>
</Project>
<h2>Interests</h2>
<ul>
<ul class="list-disc list-inside">
<li>Leetcode — daily competitive problem solving</li>
<li>Learning Mandarin</li>
<li>Rhythm Games</li>

49
vue/src/views/CV/CVHospitality.vue
View File

@@ -22,11 +22,11 @@ import Project from "./Project.vue";
<h2>Profile</h2>
<p>
First Class Honours graduate in Computer Science with
Mathematics from the University of Leeds (81.1%). Dependable
and personable team player with five years of hospitality
experience across busy bars, restaurants, and event venues.
Thrives under pressure, communicates clearly, and takes
pride in providing excellent customer service.
Mathematics from the University of Leeds (81.1%). Dependable and
personable team player with five years of hospitality experience
across busy bars, restaurants, and event venues. Thrives under
pressure, communicates clearly, and takes pride in providing
excellent customer service.
</p>
<h2>Experience</h2>
@@ -37,13 +37,13 @@ import Project from "./Project.vue";
</template>
<template #top>
<small>Bartender & Waiter</small>
<small>2021–2023</small>
<small>2021–2025</small>
</template>
<p>
Served food and drinks in a high-volume live-music venue
in Leeds. Handled busy weekend shifts, managed multiple
tables simultaneously, and maintained a calm, friendly
demeanour during peak hours.
Served food and drinks in a high-volume live-music venue in
Leeds. Handled busy weekend shifts, managed multiple tables
simultaneously, and maintained a calm, friendly demeanour
during peak hours.
</p>
</Project>
<Project class="border-b border-dotted">
@@ -55,10 +55,10 @@ import Project from "./Project.vue";
<small>2020–2021</small>
</template>
<p>
Worked front-of-house at a busy pub, pulling pints,
taking orders, and ensuring a welcoming atmosphere.
Built rapport with regulars and adapted quickly to
changing priorities during service.
Worked front-of-house at a busy pub, pulling pints, taking
orders, and ensuring a welcoming atmosphere. Built rapport
with regulars and adapted quickly to changing priorities
during service.
</p>
</Project>
<Project class="border-b border-dotted">
@@ -70,10 +70,10 @@ import Project from "./Project.vue";
<small>2018–2020</small>
</template>
<p>
Operated the till, served customers, and helped
coordinate table service at a café on London's South
Bank. Developed strong cash-handling accuracy and
customer interaction skills in a fast-paced environment.
Operated the till, served customers, and helped coordinate
table service at a café on London's South Bank. Developed
strong cash-handling accuracy and customer interaction
skills in a fast-paced environment.
</p>
</Project>
@@ -81,8 +81,8 @@ import Project from "./Project.vue";
<div class="skills-grid">
<div>
<strong>Service</strong><br /><small
>Bar work, Table service, Cash handling, Till
operation, Food hygiene</small
>Bar work, Table service, Cash handling, Till operation,
Food hygiene</small
>
</div>
<div>
@@ -112,13 +112,10 @@ import Project from "./Project.vue";
<div
class="flex-row flex place-content-between m-auto place-items-center"
>
<small>81.1% — First Class Honours</small>
<small>First Class Honours (81.1%)</small>
<small>2021–2025</small>
</div>
<small
>BSc Computer Science with Mathematics
(International)</small
>
<small>BSc Computer Science with Mathematics </small>
</div>
<div class="flex-1 pl-3">
<h3>University of Waterloo</h3>
@@ -132,7 +129,7 @@ import Project from "./Project.vue";
</div>
<h2>Interests</h2>
<ul>
<ul class="list-disc list-inside">
<li>Leetcode — daily competitive problem solving</li>
<li>Learning Mandarin</li>
<li>Rhythm Games</li>