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

Making all CV's abide by same styling
Some checks failed
Deploy with Docker Compose / deploy (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Adam French
2026-04-27 11:45:01 +01:00
parent a116ec2614
commit 9bcb21910d
9 changed files with 1205 additions and 2468 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
vue/src/assets/styles.css
View File

@@ -161,17 +161,14 @@ h4 {
h3,
h4 {
font-size: 1.125rem;
line-height: 1.75rem;
}
h1 {
font-size: 1.5rem;
line-height: 2rem;
}
h2 {
font-size: 1.25rem;
line-height: 1.75rem;
}
p {

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

@@ -3,6 +3,7 @@ import { ref, shallowRef } from "vue";
import { RouterLink } from "vue-router";
import CVGeneral from "./CVGeneral.vue";
import CVProgramming from "./CVProgramming.vue";
import CVSecurity from "./CVSecurity.vue";
import CVBackend from "./CVBackend.vue";
import CVFrontend from "./CVFrontend.vue";
import CVTemp from "./CVTemp.vue";
@@ -12,6 +13,7 @@ import CVHospitality from "./CVHospitality.vue";
const templates = [
{ label: "General", component: CVGeneral },
{ label: "Programming", component: CVProgramming },
{ label: "Security", component: CVSecurity },
{ label: "Backend", component: CVBackend },
{ label: "Frontend", component: CVFrontend },
{ label: "Temp", component: CVTemp },
@@ -124,3 +126,5 @@ function print() {
}
}
</style>
<style src="./cv-shared.css"></style>

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

@@ -3,20 +3,21 @@ import Project from "./Project.vue";
</script>
<template>
<main>
<main class="cv-template">
<div class="no-print w-full h-20"></div>
<div class="a4page justify-between">
<section>
<div class="flex flex-col sm:flex-row sm:justify-between">
<h1 class="name">Adam French</h1>
<div class="contact-details sm:text-right">
<div class="contact-details">
<p>London, United Kingdom</p>
<p>+447563266931</p>
<p>adam.a.french@outlook.com</p>
<h4>
<p>
<a href="https://www.adam-french.co.uk">
www.adam-french.co.uk
</a>
</h4>
</p>
</div>
</div>
</section>
@@ -24,12 +25,11 @@ import Project from "./Project.vue";
<section>
<h2>Profile</h2>
<p>
First Class Honours graduate in Computer Science with
Mathematics from the University of Leeds (81.1%), with a
year abroad at the University of Waterloo. Strong background
in systems programming, API design, database management, and
infrastructure automation. Keen to build reliable,
performant backend services in a collaborative engineering
First Class Honours graduate in Computer Science with Mathematics from
the University of Leeds (81.1%), with a year abroad at the University
of Waterloo. Strong background in systems programming, API design,
database management, and infrastructure automation. Keen to build
reliable, performant backend services in a collaborative engineering
team.
</p>
</section>
@@ -39,20 +39,17 @@ import Project from "./Project.vue";
<div class="skills-grid">
<div>
<strong>Languages</strong><br /><small
>Go, Rust, Python, SQL, JavaScript /
TypeScript</small
>Go, Rust, Python, SQL, JavaScript / TypeScript</small
>
</div>
<div>
<strong>Backend</strong><br /><small
>REST, GraphQL, gRPC, JWT Auth, WebSockets,
Middleware</small
>REST, GraphQL, gRPC, JWT Auth, WebSockets, Middleware</small
>
</div>
<div>
<strong>Infrastructure</strong><br /><small
>Docker, Nginx, PostgreSQL, SQLite, Git Actions,
Linux</small
>Docker, Nginx, PostgreSQL, SQLite, Git Actions, Linux</small
>
</div>
</div>
@@ -73,25 +70,22 @@ import Project from "./Project.vue";
</template>
<template v-slot:top>
<small>
Go, Gin, GraphQL, PostgreSQL, GORM, Docker, Nginx,
JWT Auth, Git Actions
Go, Gin, GraphQL, PostgreSQL, GORM, Docker, Nginx, JWT Auth, Git
Actions
</small>
<small>2025</small>
</template>
<p>
Self-hosted personal website with a Go backend serving a
GraphQL API, JWT authentication, Spotify OAuth
integration, and WebSocket messaging. Fully
containerised with Docker Compose and automated CI/CD
via Git Actions.
Self-hosted personal website with a Go backend serving a GraphQL
API, JWT authentication, Spotify OAuth integration, and WebSocket
messaging. Fully containerised with Docker Compose and automated
CI/CD via Git Actions.
</p>
</Project>
<Project class="border-b border-dotted">
<template v-slot:left>
<h4>
<a
href="https://www.adam-french.co.uk/gitea/adamf/tour.git"
>
<a href="https://www.adam-french.co.uk/gitea/adamf/tour.git">
tour.git
</a>
</h4>
@@ -101,10 +95,10 @@ import Project from "./Project.vue";
<small>2026</small>
</template>
<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.
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.
</p>
</Project>
<Project class="border-b border-dotted">
@@ -122,10 +116,9 @@ import Project from "./Project.vue";
<small>2023</small>
</template>
<p>
Parallelised recursive ray tracer leveraging Rust's
ownership model for safe concurrency. Focused on
algorithmic efficiency, low-level memory management, and
multi-core utilisation.
Parallelised recursive ray tracer leveraging Rust's ownership model
for safe concurrency. Focused on algorithmic efficiency, low-level
memory management, and multi-core utilisation.
</p>
</Project>
<Project>
@@ -144,60 +137,51 @@ import Project from "./Project.vue";
<small>2024</small>
</template>
<p>
Research project on Mobile Automata with data
visualisation and academic presentation. Delivered
within a tight deadline in collaboration with academic
mentors.
Research project on Mobile Automata with data visualisation and
academic presentation. Delivered within a tight deadline in
collaboration with academic mentors.
</p>
</Project>
</section>
<section>
<h2>Education</h2>
<div class="w-full h-fit flex flex-col sm:flex-row gap-5">
<div class="flex-1 sm:border-r border-dotted sm:pr-3">
<h3>
<a
href="https://www.adam-french.co.uk/pdf/transcript.pdf"
>
<div class="w-full flex flex-col sm:flex-row gap-5">
<section class="flex-1">
<h2>
<a href="https://www.adam-french.co.uk/pdf/transcript.pdf">
University of Leeds
</a>
</h3>
</h2>
<div
class="flex-row flex place-content-between m-auto place-items-center"
>
<small>First Class Honours (81.1%)</small>
<small>2021–2025</small>
<small>First Class Honors (81.1%)</small>
<small>Sep 2021 – Jun 2025</small>
</div>
<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>Algorithms & Data Structures I & II</li>
<li>Databases · Computer Processors</li>
<li>Compiler Design and Construction</li>
<li>Formal Languages & Finite Automata</li>
<li>Graph Algorithms & Complexity Theory</li>
<li>Computer Processors, Databases, Networks</li>
</ul>
</div>
<div class="flex-1 sm:pl-3">
<h3>University of Waterloo</h3>
</section>
<section class="flex-1">
<h2>University of Waterloo</h2>
<div
class="flex-row flex place-content-between m-auto place-items-center"
>
<small>Year abroad</small>
<small>2023–2024</small>
<small>Sep 2023 – Apr 2024</small>
</div>
<ul class="list-disc list-inside">
<li>Applied Cryptography</li>
<li>Introduction to Rings and Fields with Applications</li>
<li>Introduction to Computer Graphics</li>
<li>
Introduction to Rings and Fields with
Applications
</li>
<li>Formal Languages & Finite Automata</li>
</ul>
</div>
</div>
</section>
</div>
</div>
<div class="no-print w-full h-20"></div>
@@ -214,9 +198,8 @@ import Project from "./Project.vue";
</template>
<p>
Worked at <em>Belgrave Music Hall</em>,
<em>The Crown and Anchor</em>, and
<em>BFI Riverfront Kitchen</em>. Developed
communication, composure under pressure, and reliability
<em>The Crown and Anchor</em>, and <em>BFI Riverfront Kitchen</em>.
Developed communication, composure under pressure, and reliability
in customer-facing roles.
</p>
</Project>
@@ -236,175 +219,3 @@ import Project from "./Project.vue";
<div class="no-print w-full h-20"></div>
</main>
</template>
<style scoped>
/* Fonts */
@font-face {
font-family: "big_noodle_titling";
src: url("/fonts/big_noodle_titling.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "CreatoDisplay";
src: url("/fonts/CreatoDisplay-Bold.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
/* Variables */
* {
--primary: black;
--secondary: #0000ff;
--tertiary: #ff0000;
--quaternary: #cccccc;
--background: white;
--font-heading: big_noodle_titling;
--font-text: CreatoDisplay;
--font-size-name: 2.5em;
--font-size-text: 100%;
--font-size-small: 0.9em;
--font-size-heading: 2.1em;
--font-size-subheading: 1.7em;
--font-size-subsubheading: 1.4em;
}
/* A4 Page */
.a4page {
line-height: 1.6;
font-family: var(--font-text);
width: 210mm;
height: 297mm;
padding: 5mm;
box-sizing: border-box;
background-color: var(--background);
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
border: 1px solid var(--primary);
overflow: hidden;
margin: auto auto;
display: flex;
flex-direction: column;
}
/* Component Styling */
main {
padding: 0px;
display: flex;
flex-direction: column;
height: fit-content;
background-color: white;
}
span {
height: 2em;
}
h1,
h2,
h3,
h4 {
margin: 0px;
border: none;
color: var(--primary);
font-family: var(--font-heading);
text-transform: capitalize;
}
h1 {
font-size: var(--font-size-heading);
}
h2 {
border-bottom: 1px solid var(--primary);
font-size: var(--font-size-subheading);
}
h3 {
font-size: var(--font-size-subsubheading);
}
a:hover {
color: var(--tertiary);
}
a {
background-color: transparent;
color: var(--secondary);
}
p {
margin-bottom: 0.2em;
color: var(--primary);
font-size: var(--font-size-text);
}
table {
color: var(--secondary);
border-collapse: collapse;
border: 1px solid black;
}
td {
color: var(--secondary);
border-top: 1px solid var(--tertiary);
padding: 1px 10px 1px 10px;
font-size: var(--font-size-text);
text-align: left;
}
th {
color: var(--secondary);
border: 2px solid var(--tertiary);
padding: 1px 0px 1px 7px;
font-family: var(--font-heading);
font-size: var(--font-size-subsubheading);
background-color: var(--quaternary);
text-align: left;
}
@media print {
.no-print {
display: none !important;
}
}
small {
font-size: var(--font-size-small);
color: var(--primary);
}
ul {
font-size: var(--font-size-small);
margin: 0;
padding-left: 1.2em;
}
li {
font-size: var(--font-size-small);
color: var(--primary);
}
.skills-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 0.3em 1em;
margin-bottom: 0.2em;
}
@media (max-width: 640px) {
.a4page {
width: 100%;
height: auto;
overflow: visible;
box-shadow: none;
border: none;
}
.skills-grid {
grid-template-columns: 1fr;
}
}
</style>

155
vue/src/views/CV/CVElectrical.vue
View File

@@ -3,21 +3,21 @@ import Project from "./Project.vue";
</script>
<template>
<main>
<main class="cv-template">
<div class="no-print w-full h-20"></div>
<div class="a4page justify-between">
<section>
<div class="flex flex-col sm:flex-row sm:justify-between">
<h1 class="name">Adam French</h1>
<div class="contact-details sm:text-right">
<div class="contact-details">
<p>London, United Kingdom</p>
<p>+447563266931</p>
<p>adam.a.french@outlook.com</p>
<h4>
<p>
<a href="https://www.adam-french.co.uk">
www.adam-french.co.uk
</a>
</h4>
</p>
</div>
</div>
</section>
@@ -174,150 +174,3 @@ import Project from "./Project.vue";
<div class="no-print w-full h-20"></div>
</main>
</template>
<style scoped>
/* Fonts */
@font-face {
font-family: "big_noodle_titling";
src: url("/fonts/big_noodle_titling.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "CreatoDisplay";
src: url("/fonts/CreatoDisplay-Bold.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
/* Variables */
* {
--primary: black;
--secondary: #0000ff;
--tertiary: #ff0000;
--quaternary: #cccccc;
--background: white;
--font-heading: big_noodle_titling;
--font-text: CreatoDisplay;
--font-size-name: 2.5em;
--font-size-text: 100%;
--font-size-small: 0.9em;
--font-size-heading: 2.1em;
--font-size-subheading: 1.6em;
--font-size-subsubheading: 1.3em;
}
/* A4 Page */
.a4page {
line-height: 1.5;
font-family: var(--font-text);
width: 210mm;
height: 297mm;
padding: 8mm;
box-sizing: border-box;
background-color: var(--background);
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
border: 1px solid var(--primary);
overflow: hidden;
margin: auto auto;
display: flex;
flex-direction: column;
justify-content: space-between;
gap: 0.4em;
}
/* Component Styling */
main {
padding: 0px;
display: flex;
flex-direction: column;
height: fit-content;
background-color: white;
}
h1,
h2,
h3,
h4 {
margin: 0px;
border: none;
color: var(--primary);
font-family: var(--font-heading);
text-transform: capitalize;
}
h1 {
font-size: var(--font-size-heading);
}
h2 {
border-bottom: 1px solid var(--primary);
font-size: var(--font-size-subheading);
}
h3,
h4 {
font-size: var(--font-size-subsubheading);
}
a:hover {
color: var(--tertiary);
}
a {
background-color: transparent;
color: var(--secondary);
}
p {
margin-bottom: 0.2em;
color: var(--primary);
font-size: var(--font-size-text);
}
@media print {
.no-print {
display: none !important;
}
}
small {
font-size: var(--font-size-small);
color: var(--primary);
}
ul {
font-size: var(--font-size-small);
margin: 0;
padding-left: 1.2em;
}
li {
font-size: var(--font-size-small);
color: var(--primary);
}
.skills-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 0.3em 1em;
margin-bottom: 0.2em;
}
@media (max-width: 640px) {
.a4page {
width: 100%;
height: auto;
overflow: visible;
box-shadow: none;
border: none;
}
.skills-grid {
grid-template-columns: 1fr;
}
}
</style>

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

@@ -3,20 +3,21 @@ import Project from "./Project.vue";
</script>
<template>
<main>
<main class="cv-template">
<div class="no-print w-full h-20"></div>
<div class="a4page justify-between">
<section>
<div class="flex flex-col sm:flex-row sm:justify-between">
<h1 class="name">Adam French</h1>
<div class="contact-details sm:text-right">
<div class="contact-details">
<p>London, United Kingdom</p>
<p>+447563266931</p>
<p>adam.a.french@outlook.com</p>
<h4>
<p>
<a href="https://www.adam-french.co.uk">
www.adam-french.co.uk
</a>
</h4>
</p>
</div>
</div>
</section>
@@ -24,12 +25,11 @@ import Project from "./Project.vue";
<section>
<h2>Profile</h2>
<p>
First Class Honours graduate in Computer Science with
Mathematics from the University of Leeds (81.1%), with a
year abroad at the University of Waterloo. Passionate about
crafting responsive, accessible, and performant user
interfaces. Experienced across multiple frontend frameworks
with a solid understanding of the full stack.
First Class Honours graduate in Computer Science with Mathematics from
the University of Leeds (81.1%), with a year abroad at the University
of Waterloo. Passionate about crafting responsive, accessible, and
performant user interfaces. Experienced across multiple frontend
frameworks with a solid understanding of the full stack.
</p>
</section>
@@ -38,20 +38,18 @@ import Project from "./Project.vue";
<div class="skills-grid">
<div>
<strong>Frontend</strong><br /><small
>Vue, React / Redux, Svelte, Tailwind CSS, HTML /
CSS, WebAssembly</small
>Vue, React / Redux, Svelte, Tailwind CSS, HTML / CSS,
WebAssembly</small
>
</div>
<div>
<strong>Languages</strong><br /><small
>JavaScript / TypeScript, Rust, Go, Python,
SQL</small
>JavaScript / TypeScript, Rust, Go, Python, SQL</small
>
</div>
<div>
<strong>Tooling / Infra</strong><br /><small
>Vite, Docker, Nginx, Git Actions, PostgreSQL,
Figma</small
>Vite, Docker, Nginx, Git Actions, PostgreSQL, Figma</small
>
</div>
</div>
@@ -72,25 +70,21 @@ import Project from "./Project.vue";
</template>
<template v-slot:top>
<small>
Vue 3, Tailwind CSS, Vite, Pinia, Responsive Design,
Rust → Wasm
Vue 3, Tailwind CSS, Vite, Pinia, Responsive Design, Rust → Wasm
</small>
<small>2025</small>
</template>
<p>
Personal website SPA built with Vue 3, Tailwind CSS, and
Pinia for state management. Features responsive layouts,
dark mode, WebAssembly integration, and a custom
component library. Iterated through Svelte and
React/Redux before settling on Vue.
Personal website SPA built with Vue 3, Tailwind CSS, and Pinia for
state management. Features responsive layouts, dark mode,
WebAssembly integration, and a custom component library. Iterated
through Svelte and React/Redux before settling on Vue.
</p>
</Project>
<Project class="border-b border-dotted">
<template v-slot:left>
<h4>
<a
href="https://www.adam-french.co.uk/gitea/adamf/tour.git"
>
<a href="https://www.adam-french.co.uk/gitea/adamf/tour.git">
tour.git
</a>
</h4>
@@ -100,9 +94,8 @@ import Project from "./Project.vue";
<small>2026</small>
</template>
<p>
CLI tool for building and navigating interactive code
tutorials, with version-traversal semantics inspired by
Git.
CLI tool for building and navigating interactive code tutorials,
with version-traversal semantics inspired by Git.
</p>
</Project>
<Project class="border-b border-dotted">
@@ -120,9 +113,9 @@ import Project from "./Project.vue";
<small>2023</small>
</template>
<p>
Parallelised recursive ray tracer for realistic 3D
rendering. Emphasised algorithmic efficiency and
low-level memory management in Rust.
Parallelised recursive ray tracer for realistic 3D rendering.
Emphasised algorithmic efficiency and low-level memory management in
Rust.
</p>
</Project>
<Project>
@@ -141,30 +134,25 @@ import Project from "./Project.vue";
<small>2024</small>
</template>
<p>
Research project on Mobile Automata with data
visualisation and academic presentation. Delivered
within a tight deadline in collaboration with academic
mentors.
Research project on Mobile Automata with data visualisation and
academic presentation. Delivered within a tight deadline in
collaboration with academic mentors.
</p>
</Project>
</section>
<section>
<h2>Education</h2>
<div class="w-full h-fit flex flex-col sm:flex-row gap-5">
<div class="flex-1 sm:border-r border-dotted sm:pr-3">
<h3>
<a
href="https://www.adam-french.co.uk/pdf/transcript.pdf"
>
<div class="w-full flex flex-col sm:flex-row gap-5">
<section class="flex-1">
<h2>
<a href="https://www.adam-french.co.uk/pdf/transcript.pdf">
University of Leeds
</a>
</h3>
</h2>
<div
class="flex-row flex place-content-between m-auto place-items-center"
>
<small>81.1% — First Class Honours</small>
<small>2021–2025</small>
<small>First Class Honours (81.1%)</small>
<small>Sep 2021 – Jun 2025</small>
</div>
<small>BSc Computer Science with Mathematics </small>
<ul class="list-disc list-inside">
@@ -172,32 +160,25 @@ import Project from "./Project.vue";
<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 sm:pl-3">
<h3>University of Waterloo</h3>
</section>
<section class="flex-1">
<h2>University of Waterloo</h2>
<div
class="flex-row flex place-content-between m-auto place-items-center"
>
<small>Year abroad</small>
<small>2023–2024</small>
<small>Sep 2023 – Apr 2024</small>
</div>
<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>
</section>
</div>
</div>
<div class="no-print w-full h-20"></div>
@@ -214,9 +195,8 @@ import Project from "./Project.vue";
</template>
<p>
Worked at <em>Belgrave Music Hall</em>,
<em>The Crown and Anchor</em>, and
<em>BFI Riverfront Kitchen</em>. Developed
communication, composure under pressure, and reliability
<em>The Crown and Anchor</em>, and <em>BFI Riverfront Kitchen</em>.
Developed communication, composure under pressure, and reliability
in customer-facing roles.
</p>
</Project>
@@ -236,175 +216,3 @@ import Project from "./Project.vue";
<div class="no-print w-full h-20"></div>
</main>
</template>
<style scoped>
/* Fonts */
@font-face {
font-family: "big_noodle_titling";
src: url("/fonts/big_noodle_titling.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "CreatoDisplay";
src: url("/fonts/CreatoDisplay-Bold.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
/* Variables */
* {
--primary: black;
--secondary: #0000ff;
--tertiary: #ff0000;
--quaternary: #cccccc;
--background: white;
--font-heading: big_noodle_titling;
--font-text: CreatoDisplay;
--font-size-name: 2.5em;
--font-size-text: 100%;
--font-size-small: 0.9em;
--font-size-heading: 2.1em;
--font-size-subheading: 1.7em;
--font-size-subsubheading: 1.4em;
}
/* A4 Page */
.a4page {
line-height: 1.6;
font-family: var(--font-text);
width: 210mm;
height: 297mm;
padding: 5mm;
box-sizing: border-box;
background-color: var(--background);
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
border: 1px solid var(--primary);
overflow: hidden;
margin: auto auto;
display: flex;
flex-direction: column;
}
/* Component Styling */
main {
padding: 0px;
display: flex;
flex-direction: column;
height: fit-content;
background-color: white;
}
span {
height: 2em;
}
h1,
h2,
h3,
h4 {
margin: 0px;
border: none;
color: var(--primary);
font-family: var(--font-heading);
text-transform: capitalize;
}
h1 {
font-size: var(--font-size-heading);
}
h2 {
border-bottom: 1px solid var(--primary);
font-size: var(--font-size-subheading);
}
h3 {
font-size: var(--font-size-subsubheading);
}
a:hover {
color: var(--tertiary);
}
a {
background-color: transparent;
color: var(--secondary);
}
p {
margin-bottom: 0.2em;
color: var(--primary);
font-size: var(--font-size-text);
}
table {
color: var(--secondary);
border-collapse: collapse;
border: 1px solid black;
}
td {
color: var(--secondary);
border-top: 1px solid var(--tertiary);
padding: 1px 10px 1px 10px;
font-size: var(--font-size-text);
text-align: left;
}
th {
color: var(--secondary);
border: 2px solid var(--tertiary);
padding: 1px 0px 1px 7px;
font-family: var(--font-heading);
font-size: var(--font-size-subsubheading);
background-color: var(--quaternary);
text-align: left;
}
@media print {
.no-print {
display: none !important;
}
}
small {
font-size: var(--font-size-small);
color: var(--primary);
}
ul {
font-size: var(--font-size-small);
margin: 0;
padding-left: 1.2em;
}
li {
font-size: var(--font-size-small);
color: var(--primary);
}
.skills-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 0.3em 1em;
margin-bottom: 0.2em;
}
@media (max-width: 640px) {
.a4page {
width: 100%;
height: auto;
overflow: visible;
box-shadow: none;
border: none;
}
.skills-grid {
grid-template-columns: 1fr;
}
}
</style>

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

@@ -3,21 +3,21 @@ import Project from "./Project.vue";
</script>
<template>
<main>
<main class="cv-template">
<div class="no-print w-full h-20"></div>
<div class="a4page place-content-between">
<section>
<div class="flex flex-col sm:flex-row sm:justify-between">
<h1 class="content-center name">Adam French</h1>
<div class="contact-details sm:text-right">
<h1 class="name">Adam French</h1>
<div class="contact-details">
<p>London, United Kingdom</p>
<p>+447563266931</p>
<p>adam.a.french@outlook.com</p>
<h4>
<p>
<a href="https://www.adam-french.co.uk">
www.adam-french.co.uk
</a>
</h4>
</p>
</div>
</div>
</section>
@@ -188,156 +188,3 @@ import Project from "./Project.vue";
</div>
</main>
</template>
<style scoped>
/* Fonts */
@font-face {
font-family: "big_noodle_titling";
src: url("/fonts/big_noodle_titling.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "CreatoDisplay";
src: url("/fonts/CreatoDisplay-Bold.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
/* Variables */
* {
--primary: black;
--secondary: #0000ff;
--tertiary: #ff0000;
--quaternary: #cccccc;
--background: white;
--font-heading: big_noodle_titling;
--font-text: CreatoDisplay;
--font-size-name: 3.5em;
--font-size-text: 0.94em;
--font-size-small: 0.9em;
--font-size-heading: 1.9em;
--font-size-subheading: 1.6em;
--font-size-subsubheading: 1.3em;
}
.name {
font-size: var(--font-size-name);
}
/* A4 Page */
.a4page {
line-height: 1.5;
font-family: var(--font-text);
width: 210mm;
height: 297mm;
padding: 8mm;
box-sizing: border-box;
background-color: var(--background);
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
border: 1px solid var(--primary);
overflow: hidden;
margin: auto auto;
display: flex;
flex-direction: column;
gap: 0.4em;
}
/* Component Styling */
main {
padding: 0px;
display: flex;
flex-direction: column;
height: fit-content;
background-color: white;
}
h1,
h2,
h3,
h4 {
margin: 0px;
border: none;
color: var(--primary);
font-family: var(--font-heading);
text-transform: capitalize;
}
h1 {
font-size: var(--font-size-heading);
}
h2 {
border-bottom: 1px solid var(--primary);
font-size: var(--font-size-subheading);
}
h3,
h4 {
font-size: var(--font-size-subsubheading);
}
a:hover {
color: var(--tertiary);
}
a {
background-color: transparent;
color: var(--secondary);
}
p {
margin-bottom: 0.2em;
color: var(--primary);
font-size: var(--font-size-text);
}
@media print {
.no-print {
display: none !important;
}
}
small {
font-size: var(--font-size-small);
color: var(--primary);
}
ul {
font-size: var(--font-size-text);
margin: 0;
padding-left: 1.2em;
}
li {
font-size: var(--font-size-text);
color: var(--primary);
list-style: disc;
}
.skills-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 0.3em 1em;
margin-bottom: 0.2em;
}
/* Inline skills: header flows directly into bullet list on same line */
@media (max-width: 640px) {
.a4page {
width: 100%;
height: auto;
overflow: visible;
box-shadow: none;
border: none;
}
.skills-grid {
grid-template-columns: 1fr;
}
}
</style>

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

@@ -3,20 +3,21 @@ import Project from "./Project.vue";
</script>
<template>
<main>
<main class="cv-template">
<div class="no-print w-full h-20"></div>
<div class="a4page justify-between">
<section>
<div class="flex flex-col sm:flex-row sm:justify-between">
<h1 class="name">Adam French</h1>
<div class="contact-details sm:text-right">
<div class="contact-details">
<p>London, United Kingdom</p>
<p>+447563266931</p>
<p>adam.a.french@outlook.com</p>
<h4>
<p>
<a href="https://www.adam-french.co.uk">
www.adam-french.co.uk
</a>
</h4>
</p>
</div>
</div>
</section>
@@ -24,12 +25,11 @@ import Project from "./Project.vue";
<section>
<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.
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.
</p>
</section>
@@ -45,10 +45,9 @@ import Project from "./Project.vue";
<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">
@@ -60,10 +59,9 @@ 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">
@@ -75,10 +73,10 @@ import Project from "./Project.vue";
<small>2020–2021</small>
</template>
<p>
Worked at a bakery in Eastbourne, preparing freshly
baked goods for display, operating the coffee machine,
and keeping bakery equipment spotless. Built rapport
with regulars and provided attentive, friendly service.
Worked at a bakery in Eastbourne, preparing freshly baked goods for
display, operating the coffee machine, and keeping bakery equipment
spotless. Built rapport with regulars and provided attentive,
friendly service.
</p>
</Project>
<Project>
@@ -90,10 +88,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>
</section>
@@ -103,20 +101,19 @@ 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>
<strong>Soft Skills</strong><br /><small
>Communication, Teamwork, Time management, Composure
under pressure</small
>Communication, Teamwork, Time management, Composure under
pressure</small
>
</div>
<div>
<strong>Technical</strong><br /><small
>EPOS systems, Stock management, Event
coordination</small
>EPOS systems, Stock management, Event coordination</small
>
</div>
</div>
@@ -125,9 +122,7 @@ import Project from "./Project.vue";
<div class="w-full flex flex-col sm:flex-row gap-5">
<section class="flex-1">
<h2>
<a
href="https://www.adam-french.co.uk/pdf/transcript.pdf"
>
<a href="https://www.adam-french.co.uk/pdf/transcript.pdf">
University of Leeds
</a>
</h2>
@@ -164,176 +159,3 @@ import Project from "./Project.vue";
<div class="no-print w-full h-20"></div>
</main>
</template>
<style scoped>
/* Fonts */
@font-face {
font-family: "big_noodle_titling";
src: url("/fonts/big_noodle_titling.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "CreatoDisplay";
src: url("/fonts/CreatoDisplay-Bold.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
/* Variables */
* {
--primary: black;
--secondary: #0000ff;
--tertiary: #ff0000;
--quaternary: #cccccc;
--background: white;
--font-heading: big_noodle_titling;
--font-text: CreatoDisplay;
--font-size-name: 2.5em;
--font-size-text: 100%;
--font-size-small: 0.9em;
--font-size-heading: 2.1em;
--font-size-subheading: 1.7em;
--font-size-subsubheading: 1.4em;
}
/* A4 Page */
.a4page {
line-height: 1.6;
font-family: var(--font-text);
width: 210mm;
height: 297mm;
padding: 5mm;
box-sizing: border-box;
background-color: var(--background);
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
border: 1px solid var(--primary);
overflow: hidden;
margin: auto auto;
display: flex;
flex-direction: column;
justify-content: space-between;
}
/* Component Styling */
main {
padding: 0px;
display: flex;
flex-direction: column;
height: fit-content;
background-color: white;
}
span {
height: 2em;
}
h1,
h2,
h3,
h4 {
margin: 0px;
border: none;
color: var(--primary);
font-family: var(--font-heading);
text-transform: capitalize;
}
h1 {
font-size: var(--font-size-heading);
}
h2 {
border-bottom: 1px solid var(--primary);
font-size: var(--font-size-subheading);
}
h3 {
font-size: var(--font-size-subsubheading);
}
a:hover {
color: var(--tertiary);
}
a {
background-color: transparent;
color: var(--secondary);
}
p {
margin-bottom: 0.2em;
color: var(--primary);
font-size: var(--font-size-text);
}
table {
color: var(--secondary);
border-collapse: collapse;
border: 1px solid black;
}
td {
color: var(--secondary);
border-top: 1px solid var(--tertiary);
padding: 1px 10px 1px 10px;
font-size: var(--font-size-text);
text-align: left;
}
th {
color: var(--secondary);
border: 2px solid var(--tertiary);
padding: 1px 0px 1px 7px;
font-family: var(--font-heading);
font-size: var(--font-size-subsubheading);
background-color: var(--quaternary);
text-align: left;
}
@media print {
.no-print {
display: none !important;
}
}
small {
font-size: var(--font-size-small);
color: var(--primary);
}
ul {
font-size: var(--font-size-small);
margin: 0;
padding-left: 1.2em;
}
li {
font-size: var(--font-size-small);
color: var(--primary);
}
.skills-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 0.3em 1em;
margin-bottom: 0.2em;
}
@media (max-width: 640px) {
.a4page {
width: 100%;
height: auto;
overflow: visible;
box-shadow: none;
border: none;
}
.skills-grid {
grid-template-columns: 1fr;
}
}
</style>

275
vue/src/views/CV/CVProgramming.vue
View File

@@ -3,12 +3,12 @@ import Project from "./Project.vue";
</script>
<template>
<main>
<main class="cv-template">
<div class="no-print w-full h-20"></div>
<div class="a4page justify-between">
<section>
<div class="flex flex-col sm:flex-row sm:justify-between">
<h1 class="flex-1 name">Adam French</h1>
<h1 class="name">Adam French</h1>
<div class="contact-details">
<p>London, United Kingdom</p>
<p>+447563266931</p>
@@ -25,15 +25,13 @@ import Project from "./Project.vue";
<section>
<h2>Profile</h2>
<p contenteditable="true">
Full Stack Developer with a First Class Honours degree in
Computer Science with Mathematics from the University of
Leeds (81.1%) and a year abroad at the University of
Waterloo. Proficient in full-stack development, systems
programming, and CI/CD automation. Strong problem-solving
and organisational skills. Eager to contribute to a
collaborative engineering team, apply strong academic
foundations to real-world problems, and grow through
hands-on experience.
Full Stack Developer with a First Class Honours degree in Computer
Science with Mathematics from the University of Leeds (81.1%) and a
year abroad at the University of Waterloo. Proficient in full-stack
development, systems programming, and CI/CD automation. Strong
problem-solving and organisational skills. Eager to contribute to a
collaborative engineering team, apply strong academic foundations to
real-world problems, and grow through hands-on experience.
</p>
</section>
@@ -42,20 +40,17 @@ import Project from "./Project.vue";
<div class="skills-grid">
<div>
<strong>Languages</strong><br /><small
>Go, Rust, Python, JavaScript / TypeScript,
SQL</small
>Go, Rust, Python, JavaScript / TypeScript, SQL</small
>
</div>
<div>
<strong>Frontend / Web Design</strong><br /><small
>Vue, React / Redux, Svelte, Tailwind CSS,
WebAssembly</small
>Vue, React / Redux, Svelte, Tailwind CSS, WebAssembly</small
>
</div>
<div>
<strong>Backend / Infra</strong><br /><small
>Nginx, Docker, PostgreSQL, SQLite, JWT Auth, Git
Actions</small
>Nginx, Docker, PostgreSQL, SQLite, JWT Auth, Git Actions</small
>
</div>
</div>
@@ -76,24 +71,21 @@ import Project from "./Project.vue";
</template>
<template v-slot:top>
<small>
Nginx, Vue, Postgres, Docker, Go, Python, Rust,
Wasm, Git Actions, JWT Auth
Nginx, Vue, Postgres, Docker, Go, Python, Rust, Wasm, Git Actions,
JWT Auth
</small>
<small>2025</small>
</template>
<p contenteditable="true">
Self-hosted personal website with a fully automated
CI/CD pipeline. Iterated across diverse tech stacks
including Svelte, React/Redux, SQLite, Rust Actix, and
Deno.
Self-hosted personal website with a fully automated CI/CD pipeline.
Iterated across diverse tech stacks including Svelte, React/Redux,
SQLite, Rust Actix, and Deno.
</p>
</Project>
<Project class="border-b border-dotted">
<template v-slot:left>
<h4>
<a
href="https://www.adam-french.co.uk/gitea/adamf/tour.git"
>
<a href="https://www.adam-french.co.uk/gitea/adamf/tour.git">
tour.git
</a>
</h4>
@@ -103,9 +95,8 @@ import Project from "./Project.vue";
<small>2026</small>
</template>
<p contenteditable="true">
CLI tool for building and navigating interactive code
tutorials, with version-traversal semantics inspired by
Git.
CLI tool for building and navigating interactive code tutorials,
with version-traversal semantics inspired by Git.
</p>
</Project>
<Project class="border-b border-dotted">
@@ -123,9 +114,9 @@ import Project from "./Project.vue";
<small>2023</small>
</template>
<p contenteditable="true">
Parallelised recursive ray tracer for realistic 3D
rendering. Emphasised algorithmic efficiency and
low-level memory management in Rust.
Parallelised recursive ray tracer for realistic 3D rendering.
Emphasised algorithmic efficiency and low-level memory management in
Rust.
</p>
</Project>
<Project>
@@ -144,10 +135,9 @@ import Project from "./Project.vue";
<small>2024</small>
</template>
<p contenteditable="true">
Research project on Mobile Automata with data
visualisation and academic presentation. Delivered
within a tight deadline in collaboration with academic
mentors.
Research project on Mobile Automata with data visualisation and
academic presentation. Delivered within a tight deadline in
collaboration with academic mentors.
</p>
</Project>
</section>
@@ -155,9 +145,7 @@ import Project from "./Project.vue";
<div class="w-full flex flex-col sm:flex-row gap-5">
<section class="flex-1">
<h2>
<a
href="https://www.adam-french.co.uk/pdf/transcript.pdf"
>
<a href="https://www.adam-french.co.uk/pdf/transcript.pdf">
University of Leeds
</a>
</h2>
@@ -173,9 +161,7 @@ import Project from "./Project.vue";
<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>
</section>
<section class="flex-1">
@@ -189,9 +175,7 @@ import Project from "./Project.vue";
<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>
</section>
</div>
@@ -213,9 +197,8 @@ import Project from "./Project.vue";
<p contenteditable="true">
Worked at <strong>Belgrave Music Hall</strong>,
<strong>The Crown and Anchor</strong>, and
<strong>BFI Riverfront Kitchen</strong>. Developed
communication, composure under pressure, and reliability
in customer-facing roles.
<strong>BFI Riverfront Kitchen</strong>. Developed communication,
composure under pressure, and reliability in customer-facing roles.
</p>
</Project>
</section>
@@ -246,199 +229,3 @@ import Project from "./Project.vue";
<div class="no-print w-full h-20"></div>
</main>
</template>
<style scoped>
/* Fonts */
@font-face {
font-family: "big_noodle_titling";
src: url("/fonts/big_noodle_titling.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "CreatoDisplay";
src: url("/fonts/CreatoDisplay-Bold.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
/* Variables */
* {
--primary: black;
--secondary: #0000ff;
--tertiary: #ff0000;
--quaternary: #cccccc;
--background: white;
--font-heading: big_noodle_titling;
--font-text: CreatoDisplay;
--font-size-text: 1em;
--font-size-small: 0.9em;
--font-size-heading: 1.5em;
--font-size-subheading: 1.5em;
--font-size-subsubheading: 1.3em;
}
/* A4 Page */
.a4page {
line-height: 1.6;
font-family: var(--font-text);
width: 210mm;
height: 297mm;
padding: 10mm;
box-sizing: border-box;
background-color: var(--background);
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
border: 1px solid var(--primary);
overflow: hidden;
margin: auto auto;
display: flex;
flex-direction: column;
}
.name {
font-size: 2em;
font-weight: bold;
justify-content: center;
align-content: center;
}
/* Component Styling */
main {
padding: 0px;
display: flex;
flex-direction: column;
height: fit-content;
background-color: white;
}
strong {
font-weight: 900;
}
span {
height: 2em;
}
h1,
h2,
h3,
h4 {
margin: 0px 0px 0.2em 0px;
border: none;
color: var(--primary);
font-family: var(--font-heading);
text-transform: uppercase;
}
h1 {
font-size: var(--font-size-heading);
}
h2 {
border-bottom: 1px solid var(--primary);
font-size: var(--font-size-subheading);
}
h3,
h4 {
font-size: var(--font-size-subsubheading);
}
a:hover {
color: var(--tertiary);
}
a {
background-color: transparent;
color: var(--secondary);
font-family: inherit;
font-size: var(--font-size-text);
}
p {
margin-bottom: 0.2em;
color: var(--primary);
font-size: var(--font-size-text);
}
table {
color: var(--secondary);
border-collapse: collapse;
border: 1px solid black;
}
td {
color: var(--secondary);
border-top: 1px solid var(--tertiary);
padding: 1px 10px 1px 10px;
font-size: var(--font-size-text);
text-align: left;
}
th {
color: var(--secondary);
border: 2px solid var(--tertiary);
padding: 1px 0px 1px 7px;
font-family: var(--font-heading);
font-size: var(--font-size-subsubheading);
background-color: var(--quaternary);
text-align: left;
}
@media print {
.no-print {
display: none !important;
}
}
small {
font-size: var(--font-size-small);
color: var(--primary);
}
ul {
font-size: var(--font-size-small);
margin: 0;
padding-left: 1.2em;
}
li {
font-size: var(--font-size-small);
color: var(--primary);
}
.skills-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 0.3em 1em;
margin-bottom: 0.2em;
}
p[contenteditable] {
outline: none;
cursor: text;
}
p[contenteditable]:focus {
outline: none;
background-color: rgba(0, 0, 255, 0.05);
}
@media (max-width: 640px) {
.a4page {
width: 100%;
height: auto;
overflow: visible;
box-shadow: none;
border: none;
}
.skills-grid {
grid-template-columns: 1fr;
}
}
</style>

294
vue/src/views/CV/CVTemp.vue
View File

@@ -3,33 +3,31 @@ import Project from "./Project.vue";
</script>
<template>
<main>
<main class="cv-template">
<div class="no-print w-full h-20"></div>
<div class="a4page justify-between">
<section class="flex flex-col sm:flex-row sm:justify-between">
<h1 class="name">Adam French</h1>
<div class="contact-details sm:text-right">
<div class="contact-details">
<p>London, United Kingdom</p>
<p>+447563266931</p>
<p>adam.a.french@outlook.com</p>
<h4>
<a href="https://www.adam-french.co.uk">
www.adam-french.co.uk
</a>
</h4>
<p>
<a href="https://www.adam-french.co.uk"> www.adam-french.co.uk </a>
</p>
</div>
</section>
<section>
<h2>Profile</h2>
<p>
First Class Honours graduate in Computer Science with
Mathematics from the University of Leeds (81.1%), with a
year abroad at the University of Waterloo. Passionate about
developer productivity, automation infrastructure, and
software testing at scale. Experienced building CI/CD
pipelines, automation tooling, and scalable backend
services. Eager to apply rigorous engineering discipline
within a collaborative platform team.
First Class Honours graduate in Computer Science with Mathematics from
the University of Leeds (81.1%), with a year abroad at the University
of Waterloo. Passionate about developer productivity, automation
infrastructure, and software testing at scale. Experienced building
CI/CD pipelines, automation tooling, and scalable backend services.
Eager to apply rigorous engineering discipline within a collaborative
platform team.
</p>
</section>
@@ -38,20 +36,19 @@ import Project from "./Project.vue";
<div class="skills-grid">
<div>
<strong>Languages</strong><br /><small
>Python, Go, Rust, Swift, JavaScript / TypeScript,
SQL</small
>Python, Go, Rust, Swift, JavaScript / TypeScript, SQL</small
>
</div>
<div>
<strong>Automation &amp; Testing</strong><br /><small
>CI/CD Pipelines, GitHub Actions, Docker, Unit &amp;
Integration Testing, WebAssembly</small
>CI/CD Pipelines, GitHub Actions, Docker, Unit &amp; Integration
Testing, WebAssembly</small
>
</div>
<div>
<strong>Infrastructure</strong><br /><small
>Nginx, PostgreSQL, SQLite, JWT Auth, REST &amp;
GraphQL APIs</small
>Nginx, PostgreSQL, SQLite, JWT Auth, REST &amp; GraphQL
APIs</small
>
</div>
</div>
@@ -72,26 +69,23 @@ import Project from "./Project.vue";
</template>
<template v-slot:top>
<small>
GitHub Actions, Docker, Nginx, Go, Python, Rust →
Wasm, Postgres, JWT Auth
GitHub Actions, Docker, Nginx, Go, Python, Rust → Wasm, Postgres,
JWT Auth
</small>
<small>2025</small>
</template>
<p>
Self-hosted personal website with a fully automated
CI/CD pipeline: lint, build, test, and deploy on every
push. Designed for zero-downtime deployments on
constrained Raspberry Pi hardware. Iterated across
diverse stacks to evaluate tradeoffs in infrastructure
and developer experience.
Self-hosted personal website with a fully automated CI/CD pipeline:
lint, build, test, and deploy on every push. Designed for
zero-downtime deployments on constrained Raspberry Pi hardware.
Iterated across diverse stacks to evaluate tradeoffs in
infrastructure and developer experience.
</p>
</Project>
<Project class="border-b border-dotted">
<template v-slot:left>
<h4>
<a
href="https://www.adam-french.co.uk/gitea/adamf/tour.git"
>
<a href="https://www.adam-french.co.uk/gitea/adamf/tour.git">
tour.git
</a>
</h4>
@@ -101,11 +95,10 @@ import Project from "./Project.vue";
<small>2026</small>
</template>
<p>
Developer productivity CLI for building and navigating
interactive code tutorials with Git-inspired version
traversal. Designed as a reusable automation library
with a clean API surface for embedding in larger
toolchains.
Developer productivity CLI for building and navigating interactive
code tutorials with Git-inspired version traversal. Designed as a
reusable automation library with a clean API surface for embedding
in larger toolchains.
</p>
</Project>
<Project class="border-b border-dotted">
@@ -123,9 +116,9 @@ import Project from "./Project.vue";
<small>2023</small>
</template>
<p>
Parallelised recursive ray tracer for realistic 3D
rendering. Emphasised algorithmic efficiency and
low-level memory management in Rust.
Parallelised recursive ray tracer for realistic 3D rendering.
Emphasised algorithmic efficiency and low-level memory management in
Rust.
</p>
</Project>
<Project>
@@ -144,10 +137,9 @@ import Project from "./Project.vue";
<small>2024</small>
</template>
<p>
Research project on Mobile Automata with data
visualisation and academic presentation. Delivered
within a tight deadline in collaboration with academic
mentors.
Research project on Mobile Automata with data visualisation and
academic presentation. Delivered within a tight deadline in
collaboration with academic mentors.
</p>
</Project>
</section>
@@ -156,22 +148,18 @@ import Project from "./Project.vue";
<div class="no-print w-full h-20"></div>
<div class="a4page gap-10">
<section>
<h2>Education</h2>
<div class="w-full h-fit flex flex-col sm:flex-row gap-5">
<div class="flex-1 sm:border-r border-dotted sm:pr-3">
<h3>
<a
href="https://www.adam-french.co.uk/pdf/transcript.pdf"
>
<div class="w-full flex flex-col sm:flex-row gap-5">
<section class="flex-1">
<h2>
<a href="https://www.adam-french.co.uk/pdf/transcript.pdf">
University of Leeds
</a>
</h3>
</h2>
<div
class="flex-row flex place-content-between m-auto place-items-center"
>
<small>First Class Honours (81.1%)</small>
<small>2021–2025</small>
<small>Sep 2021 – Jun 2025</small>
</div>
<small>BSc Computer Science with Mathematics </small>
<ul class="list-disc list-inside">
@@ -179,31 +167,24 @@ import Project from "./Project.vue";
<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 sm:pl-3">
<h3>University of Waterloo</h3>
</section>
<section class="flex-1">
<h2>University of Waterloo</h2>
<div
class="flex-row flex place-content-between m-auto place-items-center"
>
<small>Year abroad</small>
<small>2023–2024</small>
<small>Sep 2023 – Apr 2024</small>
</div>
<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>
</section>
</div>
<section>
<h2>Experience</h2>
<Project>
@@ -216,9 +197,8 @@ import Project from "./Project.vue";
</template>
<p>
Worked at <em>Belgrave Music Hall</em>,
<em>The Crown and Anchor</em>, and
<em>BFI Riverfront Kitchen</em>. Developed
communication, composure under pressure, and reliability
<em>The Crown and Anchor</em>, and <em>BFI Riverfront Kitchen</em>.
Developed communication, composure under pressure, and reliability
in customer-facing roles.
</p>
</Project>
@@ -237,175 +217,3 @@ import Project from "./Project.vue";
<div class="no-print w-full h-20"></div>
</main>
</template>
<style scoped>
/* Fonts */
@font-face {
font-family: "big_noodle_titling";
src: url("/fonts/big_noodle_titling.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "CreatoDisplay";
src: url("/fonts/CreatoDisplay-Bold.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
/* Variables */
* {
--primary: black;
--secondary: #0000ff;
--tertiary: #ff0000;
--quaternary: #cccccc;
--background: white;
--font-heading: big_noodle_titling;
--font-text: CreatoDisplay;
--font-size-name: 2.5em;
--font-size-text: 100%;
--font-size-small: 0.9em;
--font-size-heading: 2.1em;
--font-size-subheading: 1.7em;
--font-size-subsubheading: 1.4em;
}
/* A4 Page */
.a4page {
line-height: 1.6;
font-family: var(--font-text);
width: 210mm;
height: 297mm;
padding: 5mm;
box-sizing: border-box;
background-color: var(--background);
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
border: 1px solid var(--primary);
overflow: hidden;
margin: auto auto;
display: flex;
flex-direction: column;
}
/* Component Styling */
main {
padding: 0px;
display: flex;
flex-direction: column;
height: fit-content;
background-color: white;
}
span {
height: 2em;
}
h1,
h2,
h3,
h4 {
border: none;
color: var(--primary);
font-family: var(--font-heading);
text-transform: capitalize;
margin: 0px;
}
h1 {
font-size: var(--font-size-heading);
}
h2 {
border-bottom: 1px solid var(--primary);
font-size: var(--font-size-subheading);
}
h3 {
font-size: var(--font-size-subsubheading);
}
a:hover {
color: var(--tertiary);
}
a {
background-color: transparent;
color: var(--secondary);
}
p {
margin-bottom: 0.2em;
color: var(--primary);
font-size: var(--font-size-text);
}
table {
color: var(--secondary);
border-collapse: collapse;
border: 1px solid black;
}
td {
color: var(--secondary);
border-top: 1px solid var(--tertiary);
padding: 1px 10px 1px 10px;
font-size: var(--font-size-text);
text-align: left;
}
th {
color: var(--secondary);
border: 2px solid var(--tertiary);
padding: 1px 0px 1px 7px;
font-family: var(--font-heading);
font-size: var(--font-size-subsubheading);
background-color: var(--quaternary);
text-align: left;
}
@media print {
.no-print {
display: none !important;
}
}
small {
font-size: var(--font-size-small);
color: var(--primary);
}
ul {
font-size: var(--font-size-small);
margin: 0;
padding-left: 1.2em;
}
li {
font-size: var(--font-size-small);
color: var(--primary);
}
.skills-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 0.3em 1em;
margin-bottom: 0.2em;
}
@media (max-width: 640px) {
.a4page {
width: 100%;
height: auto;
overflow: visible;
box-shadow: none;
border: none;
}
.skills-grid {
grid-template-columns: 1fr;
}
}
</style>