Making all CV's abide by same styling
Some checks failed
Deploy with Docker Compose / deploy (push) Has been cancelled
Some checks failed
Deploy with Docker Compose / deploy (push) Has been cancelled
This commit is contained in:
@@ -3,230 +3,227 @@
|
|||||||
/* Route transitions */
|
/* Route transitions */
|
||||||
.slide-enter-active,
|
.slide-enter-active,
|
||||||
.slide-leave-active {
|
.slide-leave-active {
|
||||||
transition:
|
transition:
|
||||||
transform 0.3s ease,
|
transform 0.3s ease,
|
||||||
opacity 0.3s ease;
|
opacity 0.3s ease;
|
||||||
}
|
}
|
||||||
.slide-enter-from {
|
.slide-enter-from {
|
||||||
transform: translateX(30px);
|
transform: translateX(30px);
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
.slide-leave-to {
|
.slide-leave-to {
|
||||||
transform: translateX(-30px);
|
transform: translateX(-30px);
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* PRINTING */
|
/* PRINTING */
|
||||||
@media print {
|
@media print {
|
||||||
.no-print,
|
.no-print,
|
||||||
.no-print * {
|
.no-print * {
|
||||||
display: none !important;
|
display: none !important;
|
||||||
margin: 0px;
|
margin: 0px;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
width: 0x;
|
width: 0x;
|
||||||
height: 0px;
|
height: 0px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* END OF PRINTING */
|
/* END OF PRINTING */
|
||||||
|
|
||||||
/* FONTS */
|
/* FONTS */
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: "big_noodle_titling";
|
font-family: "big_noodle_titling";
|
||||||
src: url("/fonts/big_noodle_titling.woff2") format("woff2");
|
src: url("/fonts/big_noodle_titling.woff2") format("woff2");
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-display: swap;
|
font-display: swap;
|
||||||
}
|
}
|
||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: "CreatoDisplay";
|
font-family: "CreatoDisplay";
|
||||||
src: url("/fonts/CreatoDisplay-Bold.woff2") format("woff2");
|
src: url("/fonts/CreatoDisplay-Bold.woff2") format("woff2");
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-display: swap;
|
font-display: swap;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* END OF FONTS */
|
/* END OF FONTS */
|
||||||
|
|
||||||
/* VARIABLES */
|
/* VARIABLES */
|
||||||
:root {
|
:root {
|
||||||
/* RED, WHITE, BLACK are standard*/
|
/* RED, WHITE, BLACK are standard*/
|
||||||
--portal_grey: #dddddd;
|
--portal_grey: #dddddd;
|
||||||
--portal_orange: #ff9a00;
|
--portal_orange: #ff9a00;
|
||||||
--portal_light_orange: #ff5d00;
|
--portal_light_orange: #ff5d00;
|
||||||
--portal_blue: #0065ff;
|
--portal_blue: #0065ff;
|
||||||
--portal_light_blue: #00a2ff;
|
--portal_light_blue: #00a2ff;
|
||||||
|
|
||||||
/* MAIN COLORS */
|
/* MAIN COLORS */
|
||||||
--primary: #55ffbb;
|
--primary: #55ffbb;
|
||||||
--secondary: #62ff57;
|
--secondary: #62ff57;
|
||||||
--tertiary: #ff579a;
|
--tertiary: #ff579a;
|
||||||
--quaternary: #024942;
|
--quaternary: #024942;
|
||||||
|
|
||||||
/* BACKGROUND COLORS */
|
/* BACKGROUND COLORS */
|
||||||
--bg_primary: #1b110e;
|
--bg_primary: #1b110e;
|
||||||
--bg_secondary: #04080f;
|
--bg_secondary: #04080f;
|
||||||
--bg_tertiary: #0c1c10;
|
--bg_tertiary: #0c1c10;
|
||||||
--link: #222;
|
--link: #222;
|
||||||
|
|
||||||
--bdr: 2px;
|
--bdr: 2px;
|
||||||
|
|
||||||
--spacing: 3px;
|
--spacing: 3px;
|
||||||
|
|
||||||
/* FONTS USED */
|
/* FONTS USED */
|
||||||
--font_heading: big_noodle_titling;
|
--font_heading: big_noodle_titling;
|
||||||
--font_default: CreatoDisplay;
|
--font_default: CreatoDisplay;
|
||||||
}
|
}
|
||||||
|
|
||||||
@theme {
|
@theme {
|
||||||
--color-primary: var(--primary);
|
--color-primary: var(--primary);
|
||||||
--color-secondary: var(--secondary);
|
--color-secondary: var(--secondary);
|
||||||
--color-tertiary: var(--tertiary);
|
--color-tertiary: var(--tertiary);
|
||||||
--color-quaternary: var(--quaternary);
|
--color-quaternary: var(--quaternary);
|
||||||
|
|
||||||
--color-bg_primary: var(--bg_primary);
|
--color-bg_primary: var(--bg_primary);
|
||||||
--color-bg_secondary: var(--bg_secondary);
|
--color-bg_secondary: var(--bg_secondary);
|
||||||
--color-link: var(--link);
|
--color-link: var(--link);
|
||||||
|
|
||||||
--borderWidth-primary: var(--primary);
|
--borderWidth-primary: var(--primary);
|
||||||
--borderWidth-secondary: var(--secondary);
|
--borderWidth-secondary: var(--secondary);
|
||||||
--borderWidth-tertiary: var(--tertiary);
|
--borderWidth-tertiary: var(--tertiary);
|
||||||
|
|
||||||
--font-heading: var(--font_heading);
|
--font-heading: var(--font_heading);
|
||||||
--default-font-family: var(--font_default);
|
--default-font-family: var(--font_default);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* END OF VARIABLES */
|
/* END OF VARIABLES */
|
||||||
/* ELEMENTS */
|
/* ELEMENTS */
|
||||||
body {
|
body {
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
scrollbar-width: thin;
|
scrollbar-width: thin;
|
||||||
scrollbar-color: var(--primary) var(--bg_secondary);
|
scrollbar-color: var(--primary) var(--bg_secondary);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Chrome/Edge scrollbar styling */
|
/* Chrome/Edge scrollbar styling */
|
||||||
::-webkit-scrollbar {
|
::-webkit-scrollbar {
|
||||||
width: 6px;
|
width: 6px;
|
||||||
height: 6px;
|
height: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar-track {
|
::-webkit-scrollbar-track {
|
||||||
background: var(--bg_secondary);
|
background: var(--bg_secondary);
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar-thumb {
|
::-webkit-scrollbar-thumb {
|
||||||
background: var(--quaternary);
|
background: var(--quaternary);
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar-thumb:hover {
|
::-webkit-scrollbar-thumb:hover {
|
||||||
background: var(--primary);
|
background: var(--primary);
|
||||||
}
|
}
|
||||||
|
|
||||||
input {
|
input {
|
||||||
color: var(--secondary);
|
color: var(--secondary);
|
||||||
border-color: var(--primary);
|
border-color: var(--primary);
|
||||||
border-width: 1px;
|
border-width: 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
small {
|
small {
|
||||||
color: var(--tertiary);
|
color: var(--tertiary);
|
||||||
}
|
}
|
||||||
|
|
||||||
code {
|
code {
|
||||||
color: var(--tertiary);
|
color: var(--tertiary);
|
||||||
}
|
}
|
||||||
|
|
||||||
ul {
|
ul {
|
||||||
color: var(--tertiary);
|
color: var(--tertiary);
|
||||||
}
|
}
|
||||||
|
|
||||||
li {
|
li {
|
||||||
color: var(--tertiary);
|
color: var(--tertiary);
|
||||||
}
|
}
|
||||||
|
|
||||||
h1,
|
h1,
|
||||||
h2,
|
h2,
|
||||||
h3,
|
h3,
|
||||||
h4 {
|
h4 {
|
||||||
margin: 0.25rem;
|
margin: 0.25rem;
|
||||||
font-family: var(--font_heading);
|
font-family: var(--font_heading);
|
||||||
color: var(--primary);
|
color: var(--primary);
|
||||||
}
|
}
|
||||||
|
|
||||||
h3,
|
h3,
|
||||||
h4 {
|
h4 {
|
||||||
font-size: 1.125rem;
|
font-size: 1.125rem;
|
||||||
line-height: 1.75rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
font-size: 1.5rem;
|
font-size: 1.5rem;
|
||||||
line-height: 2rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
h2 {
|
h2 {
|
||||||
font-size: 1.25rem;
|
font-size: 1.25rem;
|
||||||
line-height: 1.75rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
p {
|
p {
|
||||||
color: var(--secondary);
|
color: var(--secondary);
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: var(--primary);
|
color: var(--primary);
|
||||||
background-color: var(--link);
|
background-color: var(--link);
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-family: var(--font_heading);
|
font-family: var(--font_heading);
|
||||||
letter-spacing: 0.025em;
|
letter-spacing: 0.025em;
|
||||||
}
|
}
|
||||||
|
|
||||||
input,
|
input,
|
||||||
textarea {
|
textarea {
|
||||||
color: var(--primary);
|
color: var(--primary);
|
||||||
border-width: 1px;
|
border-width: 1px;
|
||||||
padding: 0.5rem;
|
padding: 0.5rem;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
input::placeholder,
|
input::placeholder,
|
||||||
textarea::placeholder {
|
textarea::placeholder {
|
||||||
color: var(--secondary);
|
color: var(--secondary);
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
}
|
}
|
||||||
|
|
||||||
table {
|
table {
|
||||||
border-color: var(--primary);
|
border-color: var(--primary);
|
||||||
border-width: 1px;
|
border-width: 1px;
|
||||||
color: var(--primary);
|
color: var(--primary);
|
||||||
}
|
}
|
||||||
|
|
||||||
td {
|
td {
|
||||||
gap: 0.25rem;
|
gap: 0.25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
tr {
|
tr {
|
||||||
border-color: var(--primary);
|
border-color: var(--primary);
|
||||||
border-bottom-width: 1px;
|
border-bottom-width: 1px;
|
||||||
color: var(--primary);
|
color: var(--primary);
|
||||||
}
|
}
|
||||||
|
|
||||||
th {
|
th {
|
||||||
padding-right: 0.75rem;
|
padding-right: 0.75rem;
|
||||||
padding-left: 0.75rem;
|
padding-left: 0.75rem;
|
||||||
border-right-width: 1px;
|
border-right-width: 1px;
|
||||||
border-style: dotted;
|
border-style: dotted;
|
||||||
border-color: var(--tertiary);
|
border-color: var(--tertiary);
|
||||||
}
|
}
|
||||||
|
|
||||||
td {
|
td {
|
||||||
padding-right: 0.75rem;
|
padding-right: 0.75rem;
|
||||||
padding-left: 0.75rem;
|
padding-left: 0.75rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* END OF ELEMENTS */
|
/* END OF ELEMENTS */
|
||||||
@@ -234,146 +231,146 @@ td {
|
|||||||
/* CLASSES */
|
/* CLASSES */
|
||||||
|
|
||||||
.img-stamp {
|
.img-stamp {
|
||||||
width: 99px;
|
width: 99px;
|
||||||
height: 55px;
|
height: 55px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* BORDERS */
|
/* BORDERS */
|
||||||
.bdr-1 {
|
.bdr-1 {
|
||||||
border-width: 30px;
|
border-width: 30px;
|
||||||
border-image: url("/img/borders/border1.gif") 30 round;
|
border-image: url("/img/borders/border1.gif") 30 round;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bdr-1-inv {
|
.bdr-1-inv {
|
||||||
border-width: 30px;
|
border-width: 30px;
|
||||||
border-image: url("/img/borders/border1inv.gif") 30 round;
|
border-image: url("/img/borders/border1inv.gif") 30 round;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bdr-2 {
|
.bdr-2 {
|
||||||
border-width: 5px;
|
border-width: 5px;
|
||||||
border-image: url("/img/borders/border4.gif") 7 round;
|
border-image: url("/img/borders/border4.gif") 7 round;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bdr-cv {
|
.bdr-cv {
|
||||||
border-width: 30px;
|
border-width: 30px;
|
||||||
border-image: url("/img/borders/bordercv.png") 30 round;
|
border-image: url("/img/borders/bordercv.png") 30 round;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* A5 Page */
|
/* A5 Page */
|
||||||
.a5page-landscape {
|
.a5page-landscape {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
box-sizing: content-box;
|
box-sizing: content-box;
|
||||||
height: 148mm;
|
height: 148mm;
|
||||||
width: 210mm;
|
width: 210mm;
|
||||||
}
|
}
|
||||||
|
|
||||||
.a5page-portrait {
|
.a5page-portrait {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
box-sizing: content-box;
|
box-sizing: content-box;
|
||||||
width: 148mm;
|
width: 148mm;
|
||||||
height: 210mm;
|
height: 210mm;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* A4 Page */
|
/* A4 Page */
|
||||||
.a4page-portrait {
|
.a4page-portrait {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
box-sizing: content-box;
|
box-sizing: content-box;
|
||||||
width: 210mm;
|
width: 210mm;
|
||||||
height: 297mm;
|
height: 297mm;
|
||||||
}
|
}
|
||||||
|
|
||||||
.a4page-landscape {
|
.a4page-landscape {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
box-sizing: content-box;
|
box-sizing: content-box;
|
||||||
height: 210mm;
|
height: 210mm;
|
||||||
width: 297mm;
|
width: 297mm;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* END OF CLASSES */
|
/* END OF CLASSES */
|
||||||
|
|
||||||
/* PHONE */
|
/* PHONE */
|
||||||
@media (max-width: 850px) {
|
@media (max-width: 850px) {
|
||||||
.a4page-portrait {
|
.a4page-portrait {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
/* fill mobile width */
|
/* fill mobile width */
|
||||||
height: fit-content;
|
height: fit-content;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
/* center horizontally */
|
/* center horizontally */
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
.a4page-landscape {
|
.a4page-landscape {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
/* fill mobile width */
|
/* fill mobile width */
|
||||||
height: fit-content;
|
height: fit-content;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
/* center horizontally */
|
/* center horizontally */
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 600px) {
|
@media (max-width: 600px) {
|
||||||
.a5page-portrait {
|
.a5page-portrait {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: fit-content;
|
height: fit-content;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
.a5page-landscape {
|
.a5page-landscape {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: fit-content;
|
height: fit-content;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.tl {
|
.tl {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tr {
|
.tr {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bl {
|
.bl {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.br {
|
.br {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.background {
|
.background {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
}
|
}
|
||||||
|
|
||||||
.halftone {
|
.halftone {
|
||||||
--dot_size: 4px;
|
--dot_size: 4px;
|
||||||
--bg_size: 12px;
|
--bg_size: 12px;
|
||||||
--bg_pos: calc(var(--bg_size) / 2);
|
--bg_pos: calc(var(--bg_size) / 2);
|
||||||
--blur: 0%;
|
--blur: 0%;
|
||||||
|
|
||||||
background-color: var(--bg_secondary);
|
background-color: var(--bg_secondary);
|
||||||
background-image:
|
background-image:
|
||||||
linear-gradient(to top, transparent 0%, var(--bg_primary) 100%),
|
linear-gradient(to top, transparent 0%, var(--bg_primary) 100%),
|
||||||
radial-gradient(
|
radial-gradient(
|
||||||
circle at center,
|
circle at center,
|
||||||
var(--bg_tertiary) var(--dot_size),
|
var(--bg_tertiary) var(--dot_size),
|
||||||
transparent var(--blur)
|
transparent var(--blur)
|
||||||
);
|
);
|
||||||
background-size:
|
background-size:
|
||||||
100% 100%,
|
100% 100%,
|
||||||
var(--bg_size) var(--bg_size);
|
var(--bg_size) var(--bg_size);
|
||||||
background-position:
|
background-position:
|
||||||
0 0,
|
0 0,
|
||||||
0 0;
|
0 0;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -3,6 +3,7 @@ import { ref, shallowRef } from "vue";
|
|||||||
import { RouterLink } from "vue-router";
|
import { RouterLink } from "vue-router";
|
||||||
import CVGeneral from "./CVGeneral.vue";
|
import CVGeneral from "./CVGeneral.vue";
|
||||||
import CVProgramming from "./CVProgramming.vue";
|
import CVProgramming from "./CVProgramming.vue";
|
||||||
|
import CVSecurity from "./CVSecurity.vue";
|
||||||
import CVBackend from "./CVBackend.vue";
|
import CVBackend from "./CVBackend.vue";
|
||||||
import CVFrontend from "./CVFrontend.vue";
|
import CVFrontend from "./CVFrontend.vue";
|
||||||
import CVTemp from "./CVTemp.vue";
|
import CVTemp from "./CVTemp.vue";
|
||||||
@@ -12,6 +13,7 @@ import CVHospitality from "./CVHospitality.vue";
|
|||||||
const templates = [
|
const templates = [
|
||||||
{ label: "General", component: CVGeneral },
|
{ label: "General", component: CVGeneral },
|
||||||
{ label: "Programming", component: CVProgramming },
|
{ label: "Programming", component: CVProgramming },
|
||||||
|
{ label: "Security", component: CVSecurity },
|
||||||
{ label: "Backend", component: CVBackend },
|
{ label: "Backend", component: CVBackend },
|
||||||
{ label: "Frontend", component: CVFrontend },
|
{ label: "Frontend", component: CVFrontend },
|
||||||
{ label: "Temp", component: CVTemp },
|
{ label: "Temp", component: CVTemp },
|
||||||
@@ -124,3 +126,5 @@ function print() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
<style src="./cv-shared.css"></style>
|
||||||
|
|||||||
@@ -3,408 +3,219 @@ import Project from "./Project.vue";
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<main>
|
<main class="cv-template">
|
||||||
<div class="no-print w-full h-20"></div>
|
<div class="no-print w-full h-20"></div>
|
||||||
<div class="a4page justify-between">
|
<div class="a4page justify-between">
|
||||||
<section>
|
<section>
|
||||||
<div class="flex flex-col sm:flex-row sm:justify-between">
|
<div class="flex flex-col sm:flex-row sm:justify-between">
|
||||||
<h1 class="name">Adam French</h1>
|
<h1 class="name">Adam French</h1>
|
||||||
<div class="contact-details sm:text-right">
|
<div class="contact-details">
|
||||||
<p>+447563266931</p>
|
<p>London, United Kingdom</p>
|
||||||
<p>adam.a.french@outlook.com</p>
|
<p>+447563266931</p>
|
||||||
<h4>
|
<p>adam.a.french@outlook.com</p>
|
||||||
<a href="https://www.adam-french.co.uk">
|
<p>
|
||||||
www.adam-french.co.uk
|
<a href="https://www.adam-french.co.uk">
|
||||||
</a>
|
www.adam-french.co.uk
|
||||||
</h4>
|
</a>
|
||||||
</div>
|
</p>
|
||||||
</div>
|
</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. 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>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<h2>Skills</h2>
|
|
||||||
<div class="skills-grid">
|
|
||||||
<div>
|
|
||||||
<strong>Languages</strong><br /><small
|
|
||||||
>Go, Rust, Python, SQL, JavaScript /
|
|
||||||
TypeScript</small
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<strong>Backend</strong><br /><small
|
|
||||||
>REST, GraphQL, gRPC, JWT Auth, WebSockets,
|
|
||||||
Middleware</small
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<strong>Infrastructure</strong><br /><small
|
|
||||||
>Docker, Nginx, PostgreSQL, SQLite, Git Actions,
|
|
||||||
Linux</small
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<h2>Projects</h2>
|
|
||||||
|
|
||||||
<Project class="border-b border-dotted">
|
|
||||||
<template v-slot:left>
|
|
||||||
<h4>
|
|
||||||
<a
|
|
||||||
href="https://www.adam-french.co.uk/gitea/adamf/web_server.git"
|
|
||||||
>
|
|
||||||
web_server.git
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template v-slot:top>
|
|
||||||
<small>
|
|
||||||
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.
|
|
||||||
</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"
|
|
||||||
>
|
|
||||||
tour.git
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template v-slot:top>
|
|
||||||
<small>Rust, CLI, File I/O</small>
|
|
||||||
<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.
|
|
||||||
</p>
|
|
||||||
</Project>
|
|
||||||
<Project class="border-b border-dotted">
|
|
||||||
<template v-slot:left>
|
|
||||||
<h4>
|
|
||||||
<a
|
|
||||||
href="https://www.adam-french.co.uk/gitea/adamf/rust-raytracer.git"
|
|
||||||
>
|
|
||||||
rust-raytracer.git
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template v-slot:top>
|
|
||||||
<small>Rust, Multithreading, Performance</small>
|
|
||||||
<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.
|
|
||||||
</p>
|
|
||||||
</Project>
|
|
||||||
<Project>
|
|
||||||
<template #left>
|
|
||||||
<h4>
|
|
||||||
<a
|
|
||||||
class="text-center w-full"
|
|
||||||
href="https://community.wolfram.com/groups/-/m/t/3210947"
|
|
||||||
>
|
|
||||||
Wolfram Summer School
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template #top>
|
|
||||||
<small>Wolfram Mathematica</small>
|
|
||||||
<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.
|
|
||||||
</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"
|
|
||||||
>
|
|
||||||
University of Leeds
|
|
||||||
</a>
|
|
||||||
</h3>
|
|
||||||
<div
|
|
||||||
class="flex-row flex place-content-between m-auto place-items-center"
|
|
||||||
>
|
|
||||||
<small>First Class Honours (81.1%)</small>
|
|
||||||
<small>2021–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>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="flex-1 sm:pl-3">
|
|
||||||
<h3>University of Waterloo</h3>
|
|
||||||
<div
|
|
||||||
class="flex-row flex place-content-between m-auto place-items-center"
|
|
||||||
>
|
|
||||||
<small>Year abroad</small>
|
|
||||||
<small>2023–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>Formal Languages & Finite Automata</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</div>
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div class="no-print w-full h-20"></div>
|
<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
|
||||||
|
team.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div class="a4page gap-10">
|
<section>
|
||||||
<section>
|
<h2>Skills</h2>
|
||||||
<h2>Experience</h2>
|
<div class="skills-grid">
|
||||||
<Project>
|
<div>
|
||||||
<template #left>
|
<strong>Languages</strong><br /><small
|
||||||
<p>Hospitality</p>
|
>Go, Rust, Python, SQL, JavaScript / TypeScript</small
|
||||||
</template>
|
>
|
||||||
<template #top>
|
</div>
|
||||||
<small>Cashier, Bartender, Waiter</small>
|
<div>
|
||||||
<small>2018–2023</small>
|
<strong>Backend</strong><br /><small
|
||||||
</template>
|
>REST, GraphQL, gRPC, JWT Auth, WebSockets, Middleware</small
|
||||||
<p>
|
>
|
||||||
Worked at <em>Belgrave Music Hall</em>,
|
</div>
|
||||||
<em>The Crown and Anchor</em>, and
|
<div>
|
||||||
<em>BFI Riverfront Kitchen</em>. Developed
|
<strong>Infrastructure</strong><br /><small
|
||||||
communication, composure under pressure, and reliability
|
>Docker, Nginx, PostgreSQL, SQLite, Git Actions, Linux</small
|
||||||
in customer-facing roles.
|
>
|
||||||
</p>
|
</div>
|
||||||
</Project>
|
|
||||||
</section>
|
|
||||||
<section>
|
|
||||||
<h2>Interests</h2>
|
|
||||||
<ul class="list-disc list-inside">
|
|
||||||
<li>Leetcode — daily competitive problem solving</li>
|
|
||||||
<li>Learning Mandarin</li>
|
|
||||||
<li>Rhythm Games</li>
|
|
||||||
<li>Climbing · Gym</li>
|
|
||||||
<li>Board games · Meetup.com</li>
|
|
||||||
</ul>
|
|
||||||
</section>
|
|
||||||
</div>
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div class="no-print w-full h-20"></div>
|
<section>
|
||||||
</main>
|
<h2>Projects</h2>
|
||||||
|
|
||||||
|
<Project class="border-b border-dotted">
|
||||||
|
<template v-slot:left>
|
||||||
|
<h4>
|
||||||
|
<a
|
||||||
|
href="https://www.adam-french.co.uk/gitea/adamf/web_server.git"
|
||||||
|
>
|
||||||
|
web_server.git
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template v-slot:top>
|
||||||
|
<small>
|
||||||
|
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.
|
||||||
|
</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">
|
||||||
|
tour.git
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template v-slot:top>
|
||||||
|
<small>Rust, CLI, File I/O</small>
|
||||||
|
<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.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
<Project class="border-b border-dotted">
|
||||||
|
<template v-slot:left>
|
||||||
|
<h4>
|
||||||
|
<a
|
||||||
|
href="https://www.adam-french.co.uk/gitea/adamf/rust-raytracer.git"
|
||||||
|
>
|
||||||
|
rust-raytracer.git
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template v-slot:top>
|
||||||
|
<small>Rust, Multithreading, Performance</small>
|
||||||
|
<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.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
<Project>
|
||||||
|
<template #left>
|
||||||
|
<h4>
|
||||||
|
<a
|
||||||
|
class="text-center w-full"
|
||||||
|
href="https://community.wolfram.com/groups/-/m/t/3210947"
|
||||||
|
>
|
||||||
|
Wolfram Summer School
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template #top>
|
||||||
|
<small>Wolfram Mathematica</small>
|
||||||
|
<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.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<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>
|
||||||
|
</h2>
|
||||||
|
<div
|
||||||
|
class="flex-row flex place-content-between m-auto place-items-center"
|
||||||
|
>
|
||||||
|
<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>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>Computer Processors, Databases, Networks</li>
|
||||||
|
</ul>
|
||||||
|
</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>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>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="no-print w-full h-20"></div>
|
||||||
|
|
||||||
|
<div class="a4page gap-10">
|
||||||
|
<section>
|
||||||
|
<h2>Experience</h2>
|
||||||
|
<Project>
|
||||||
|
<template #left>
|
||||||
|
<p>Hospitality</p>
|
||||||
|
</template>
|
||||||
|
<template #top>
|
||||||
|
<small>Cashier, Bartender, Waiter</small>
|
||||||
|
<small>2018–2023</small>
|
||||||
|
</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
|
||||||
|
in customer-facing roles.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
</section>
|
||||||
|
<section>
|
||||||
|
<h2>Interests</h2>
|
||||||
|
<ul class="list-disc list-inside">
|
||||||
|
<li>Leetcode — daily competitive problem solving</li>
|
||||||
|
<li>Learning Mandarin</li>
|
||||||
|
<li>Rhythm Games</li>
|
||||||
|
<li>Climbing · Gym</li>
|
||||||
|
<li>Board games · Meetup.com</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="no-print w-full h-20"></div>
|
||||||
|
</main>
|
||||||
</template>
|
</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>
|
|
||||||
|
|||||||
@@ -3,21 +3,21 @@ import Project from "./Project.vue";
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<main>
|
<main class="cv-template">
|
||||||
<div class="no-print w-full h-20"></div>
|
<div class="no-print w-full h-20"></div>
|
||||||
<div class="a4page justify-between">
|
<div class="a4page justify-between">
|
||||||
<section>
|
<section>
|
||||||
<div class="flex flex-col sm:flex-row sm:justify-between">
|
<div class="flex flex-col sm:flex-row sm:justify-between">
|
||||||
<h1 class="name">Adam French</h1>
|
<h1 class="name">Adam French</h1>
|
||||||
<div class="contact-details sm:text-right">
|
<div class="contact-details">
|
||||||
<p>London, United Kingdom</p>
|
<p>London, United Kingdom</p>
|
||||||
<p>+447563266931</p>
|
<p>+447563266931</p>
|
||||||
<p>adam.a.french@outlook.com</p>
|
<p>adam.a.french@outlook.com</p>
|
||||||
<h4>
|
<p>
|
||||||
<a href="https://www.adam-french.co.uk">
|
<a href="https://www.adam-french.co.uk">
|
||||||
www.adam-french.co.uk
|
www.adam-french.co.uk
|
||||||
</a>
|
</a>
|
||||||
</h4>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
@@ -174,150 +174,3 @@ import Project from "./Project.vue";
|
|||||||
<div class="no-print w-full h-20"></div>
|
<div class="no-print w-full h-20"></div>
|
||||||
</main>
|
</main>
|
||||||
</template>
|
</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>
|
|
||||||
|
|||||||
@@ -3,408 +3,216 @@ import Project from "./Project.vue";
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<main>
|
<main class="cv-template">
|
||||||
<div class="no-print w-full h-20"></div>
|
<div class="no-print w-full h-20"></div>
|
||||||
<div class="a4page justify-between">
|
<div class="a4page justify-between">
|
||||||
<section>
|
<section>
|
||||||
<div class="flex flex-col sm:flex-row sm:justify-between">
|
<div class="flex flex-col sm:flex-row sm:justify-between">
|
||||||
<h1 class="name">Adam French</h1>
|
<h1 class="name">Adam French</h1>
|
||||||
<div class="contact-details sm:text-right">
|
<div class="contact-details">
|
||||||
<p>+447563266931</p>
|
<p>London, United Kingdom</p>
|
||||||
<p>adam.a.french@outlook.com</p>
|
<p>+447563266931</p>
|
||||||
<h4>
|
<p>adam.a.french@outlook.com</p>
|
||||||
<a href="https://www.adam-french.co.uk">
|
<p>
|
||||||
www.adam-french.co.uk
|
<a href="https://www.adam-french.co.uk">
|
||||||
</a>
|
www.adam-french.co.uk
|
||||||
</h4>
|
</a>
|
||||||
</div>
|
</p>
|
||||||
</div>
|
</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
|
|
||||||
crafting responsive, accessible, and performant user
|
|
||||||
interfaces. Experienced across multiple frontend frameworks
|
|
||||||
with a solid understanding of the full stack.
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<h2>Skills</h2>
|
|
||||||
<div class="skills-grid">
|
|
||||||
<div>
|
|
||||||
<strong>Frontend</strong><br /><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
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<strong>Tooling / Infra</strong><br /><small
|
|
||||||
>Vite, Docker, Nginx, Git Actions, PostgreSQL,
|
|
||||||
Figma</small
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<h2>Projects</h2>
|
|
||||||
|
|
||||||
<Project class="border-b border-dotted">
|
|
||||||
<template v-slot:left>
|
|
||||||
<h4>
|
|
||||||
<a
|
|
||||||
href="https://www.adam-french.co.uk/gitea/adamf/web_server.git"
|
|
||||||
>
|
|
||||||
web_server.git
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template v-slot:top>
|
|
||||||
<small>
|
|
||||||
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.
|
|
||||||
</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"
|
|
||||||
>
|
|
||||||
tour.git
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template v-slot:top>
|
|
||||||
<small>Rust</small>
|
|
||||||
<small>2026</small>
|
|
||||||
</template>
|
|
||||||
<p>
|
|
||||||
CLI tool for building and navigating interactive code
|
|
||||||
tutorials, with version-traversal semantics inspired by
|
|
||||||
Git.
|
|
||||||
</p>
|
|
||||||
</Project>
|
|
||||||
<Project class="border-b border-dotted">
|
|
||||||
<template v-slot:left>
|
|
||||||
<h4>
|
|
||||||
<a
|
|
||||||
href="https://www.adam-french.co.uk/gitea/adamf/rust-raytracer.git"
|
|
||||||
>
|
|
||||||
rust-raytracer.git
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template v-slot:top>
|
|
||||||
<small>Rust, Linear Algebra, Multithreading</small>
|
|
||||||
<small>2023</small>
|
|
||||||
</template>
|
|
||||||
<p>
|
|
||||||
Parallelised recursive ray tracer for realistic 3D
|
|
||||||
rendering. Emphasised algorithmic efficiency and
|
|
||||||
low-level memory management in Rust.
|
|
||||||
</p>
|
|
||||||
</Project>
|
|
||||||
<Project>
|
|
||||||
<template #left>
|
|
||||||
<h4>
|
|
||||||
<a
|
|
||||||
class="text-center w-full"
|
|
||||||
href="https://community.wolfram.com/groups/-/m/t/3210947"
|
|
||||||
>
|
|
||||||
Wolfram Summer School
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template #top>
|
|
||||||
<small>Wolfram Mathematica</small>
|
|
||||||
<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.
|
|
||||||
</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"
|
|
||||||
>
|
|
||||||
University of Leeds
|
|
||||||
</a>
|
|
||||||
</h3>
|
|
||||||
<div
|
|
||||||
class="flex-row flex place-content-between m-auto place-items-center"
|
|
||||||
>
|
|
||||||
<small>81.1% — First Class Honours</small>
|
|
||||||
<small>2021–2025</small>
|
|
||||||
</div>
|
|
||||||
<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>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="flex-1 sm:pl-3">
|
|
||||||
<h3>University of Waterloo</h3>
|
|
||||||
<div
|
|
||||||
class="flex-row flex place-content-between m-auto place-items-center"
|
|
||||||
>
|
|
||||||
<small>Year abroad</small>
|
|
||||||
<small>2023–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>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</div>
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div class="no-print w-full h-20"></div>
|
<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.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div class="a4page gap-10">
|
<section>
|
||||||
<section>
|
<h2>Skills</h2>
|
||||||
<h2>Experience</h2>
|
<div class="skills-grid">
|
||||||
<Project>
|
<div>
|
||||||
<template #left>
|
<strong>Frontend</strong><br /><small
|
||||||
<p>Hospitality</p>
|
>Vue, React / Redux, Svelte, Tailwind CSS, HTML / CSS,
|
||||||
</template>
|
WebAssembly</small
|
||||||
<template #top>
|
>
|
||||||
<small>Cashier, Bartender, Waiter</small>
|
</div>
|
||||||
<small>2018–2023</small>
|
<div>
|
||||||
</template>
|
<strong>Languages</strong><br /><small
|
||||||
<p>
|
>JavaScript / TypeScript, Rust, Go, Python, SQL</small
|
||||||
Worked at <em>Belgrave Music Hall</em>,
|
>
|
||||||
<em>The Crown and Anchor</em>, and
|
</div>
|
||||||
<em>BFI Riverfront Kitchen</em>. Developed
|
<div>
|
||||||
communication, composure under pressure, and reliability
|
<strong>Tooling / Infra</strong><br /><small
|
||||||
in customer-facing roles.
|
>Vite, Docker, Nginx, Git Actions, PostgreSQL, Figma</small
|
||||||
</p>
|
>
|
||||||
</Project>
|
</div>
|
||||||
</section>
|
|
||||||
<section>
|
|
||||||
<h2>Interests</h2>
|
|
||||||
<ul class="list-disc list-inside">
|
|
||||||
<li>Leetcode — daily competitive problem solving</li>
|
|
||||||
<li>Learning Mandarin</li>
|
|
||||||
<li>Rhythm Games</li>
|
|
||||||
<li>Climbing · Gym</li>
|
|
||||||
<li>Board games · Meetup.com</li>
|
|
||||||
</ul>
|
|
||||||
</section>
|
|
||||||
</div>
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div class="no-print w-full h-20"></div>
|
<section>
|
||||||
</main>
|
<h2>Projects</h2>
|
||||||
|
|
||||||
|
<Project class="border-b border-dotted">
|
||||||
|
<template v-slot:left>
|
||||||
|
<h4>
|
||||||
|
<a
|
||||||
|
href="https://www.adam-french.co.uk/gitea/adamf/web_server.git"
|
||||||
|
>
|
||||||
|
web_server.git
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template v-slot:top>
|
||||||
|
<small>
|
||||||
|
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.
|
||||||
|
</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">
|
||||||
|
tour.git
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template v-slot:top>
|
||||||
|
<small>Rust</small>
|
||||||
|
<small>2026</small>
|
||||||
|
</template>
|
||||||
|
<p>
|
||||||
|
CLI tool for building and navigating interactive code tutorials,
|
||||||
|
with version-traversal semantics inspired by Git.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
<Project class="border-b border-dotted">
|
||||||
|
<template v-slot:left>
|
||||||
|
<h4>
|
||||||
|
<a
|
||||||
|
href="https://www.adam-french.co.uk/gitea/adamf/rust-raytracer.git"
|
||||||
|
>
|
||||||
|
rust-raytracer.git
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template v-slot:top>
|
||||||
|
<small>Rust, Linear Algebra, Multithreading</small>
|
||||||
|
<small>2023</small>
|
||||||
|
</template>
|
||||||
|
<p>
|
||||||
|
Parallelised recursive ray tracer for realistic 3D rendering.
|
||||||
|
Emphasised algorithmic efficiency and low-level memory management in
|
||||||
|
Rust.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
<Project>
|
||||||
|
<template #left>
|
||||||
|
<h4>
|
||||||
|
<a
|
||||||
|
class="text-center w-full"
|
||||||
|
href="https://community.wolfram.com/groups/-/m/t/3210947"
|
||||||
|
>
|
||||||
|
Wolfram Summer School
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template #top>
|
||||||
|
<small>Wolfram Mathematica</small>
|
||||||
|
<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.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<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>
|
||||||
|
</h2>
|
||||||
|
<div
|
||||||
|
class="flex-row flex place-content-between m-auto place-items-center"
|
||||||
|
>
|
||||||
|
<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">
|
||||||
|
<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>
|
||||||
|
</ul>
|
||||||
|
</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>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>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="no-print w-full h-20"></div>
|
||||||
|
|
||||||
|
<div class="a4page gap-10">
|
||||||
|
<section>
|
||||||
|
<h2>Experience</h2>
|
||||||
|
<Project>
|
||||||
|
<template #left>
|
||||||
|
<p>Hospitality</p>
|
||||||
|
</template>
|
||||||
|
<template #top>
|
||||||
|
<small>Cashier, Bartender, Waiter</small>
|
||||||
|
<small>2018–2023</small>
|
||||||
|
</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
|
||||||
|
in customer-facing roles.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
</section>
|
||||||
|
<section>
|
||||||
|
<h2>Interests</h2>
|
||||||
|
<ul class="list-disc list-inside">
|
||||||
|
<li>Leetcode — daily competitive problem solving</li>
|
||||||
|
<li>Learning Mandarin</li>
|
||||||
|
<li>Rhythm Games</li>
|
||||||
|
<li>Climbing · Gym</li>
|
||||||
|
<li>Board games · Meetup.com</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="no-print w-full h-20"></div>
|
||||||
|
</main>
|
||||||
</template>
|
</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>
|
|
||||||
|
|||||||
@@ -3,21 +3,21 @@ import Project from "./Project.vue";
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<main>
|
<main class="cv-template">
|
||||||
<div class="no-print w-full h-20"></div>
|
<div class="no-print w-full h-20"></div>
|
||||||
<div class="a4page place-content-between">
|
<div class="a4page place-content-between">
|
||||||
<section>
|
<section>
|
||||||
<div class="flex flex-col sm:flex-row sm:justify-between">
|
<div class="flex flex-col sm:flex-row sm:justify-between">
|
||||||
<h1 class="content-center name">Adam French</h1>
|
<h1 class="name">Adam French</h1>
|
||||||
<div class="contact-details sm:text-right">
|
<div class="contact-details">
|
||||||
<p>London, United Kingdom</p>
|
<p>London, United Kingdom</p>
|
||||||
<p>+447563266931</p>
|
<p>+447563266931</p>
|
||||||
<p>adam.a.french@outlook.com</p>
|
<p>adam.a.french@outlook.com</p>
|
||||||
<h4>
|
<p>
|
||||||
<a href="https://www.adam-french.co.uk">
|
<a href="https://www.adam-french.co.uk">
|
||||||
www.adam-french.co.uk
|
www.adam-french.co.uk
|
||||||
</a>
|
</a>
|
||||||
</h4>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
@@ -188,156 +188,3 @@ import Project from "./Project.vue";
|
|||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
</template>
|
</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>
|
|
||||||
|
|||||||
@@ -3,337 +3,159 @@ import Project from "./Project.vue";
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<main>
|
<main class="cv-template">
|
||||||
<div class="no-print w-full h-20"></div>
|
<div class="no-print w-full h-20"></div>
|
||||||
<div class="a4page justify-between">
|
<div class="a4page justify-between">
|
||||||
<section>
|
<section>
|
||||||
<div class="flex flex-col sm:flex-row sm:justify-between">
|
<div class="flex flex-col sm:flex-row sm:justify-between">
|
||||||
<h1 class="name">Adam French</h1>
|
<h1 class="name">Adam French</h1>
|
||||||
<div class="contact-details sm:text-right">
|
<div class="contact-details">
|
||||||
<p>+447563266931</p>
|
<p>London, United Kingdom</p>
|
||||||
<p>adam.a.french@outlook.com</p>
|
<p>+447563266931</p>
|
||||||
<h4>
|
<p>adam.a.french@outlook.com</p>
|
||||||
<a href="https://www.adam-french.co.uk">
|
<p>
|
||||||
www.adam-french.co.uk
|
<a href="https://www.adam-french.co.uk">
|
||||||
</a>
|
www.adam-french.co.uk
|
||||||
</h4>
|
</a>
|
||||||
</div>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
|
||||||
|
|
||||||
<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.
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<h2>Experience</h2>
|
|
||||||
|
|
||||||
<Project class="border-b border-dotted">
|
|
||||||
<template #left>
|
|
||||||
<h4>Belgrave Music Hall</h4>
|
|
||||||
</template>
|
|
||||||
<template #top>
|
|
||||||
<small>Bartender & Waiter</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.
|
|
||||||
</p>
|
|
||||||
</Project>
|
|
||||||
<Project class="border-b border-dotted">
|
|
||||||
<template #left>
|
|
||||||
<h4>The Crown and Anchor</h4>
|
|
||||||
</template>
|
|
||||||
<template #top>
|
|
||||||
<small>Bartender & Waiter</small>
|
|
||||||
<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.
|
|
||||||
</p>
|
|
||||||
</Project>
|
|
||||||
<Project class="border-b border-dotted">
|
|
||||||
<template #left>
|
|
||||||
<h4>To The Rise Bakery</h4>
|
|
||||||
</template>
|
|
||||||
<template #top>
|
|
||||||
<small>Barista & Front of House</small>
|
|
||||||
<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.
|
|
||||||
</p>
|
|
||||||
</Project>
|
|
||||||
<Project>
|
|
||||||
<template #left>
|
|
||||||
<h4>BFI Riverfront Kitchen</h4>
|
|
||||||
</template>
|
|
||||||
<template #top>
|
|
||||||
<small>Cashier & Waiter</small>
|
|
||||||
<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.
|
|
||||||
</p>
|
|
||||||
</Project>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<h2>Skills</h2>
|
|
||||||
<div class="skills-grid">
|
|
||||||
<div>
|
|
||||||
<strong>Service</strong><br /><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
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<strong>Technical</strong><br /><small
|
|
||||||
>EPOS systems, Stock management, Event
|
|
||||||
coordination</small
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<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>
|
|
||||||
</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>
|
|
||||||
</div>
|
|
||||||
<small>BSc Computer Science with Mathematics </small>
|
|
||||||
</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>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<h2>Interests</h2>
|
|
||||||
<ul class="list-disc list-inside">
|
|
||||||
<li>Leetcode</li>
|
|
||||||
<li>Rhythm Games</li>
|
|
||||||
<li>Climbing, Gym</li>
|
|
||||||
<li>Board games, Meetup.com</li>
|
|
||||||
</ul>
|
|
||||||
</section>
|
|
||||||
</div>
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div class="no-print w-full h-20"></div>
|
<section>
|
||||||
</main>
|
<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.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<h2>Experience</h2>
|
||||||
|
|
||||||
|
<Project class="border-b border-dotted">
|
||||||
|
<template #left>
|
||||||
|
<h4>Belgrave Music Hall</h4>
|
||||||
|
</template>
|
||||||
|
<template #top>
|
||||||
|
<small>Bartender & Waiter</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.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
<Project class="border-b border-dotted">
|
||||||
|
<template #left>
|
||||||
|
<h4>The Crown and Anchor</h4>
|
||||||
|
</template>
|
||||||
|
<template #top>
|
||||||
|
<small>Bartender & Waiter</small>
|
||||||
|
<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.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
<Project class="border-b border-dotted">
|
||||||
|
<template #left>
|
||||||
|
<h4>To The Rise Bakery</h4>
|
||||||
|
</template>
|
||||||
|
<template #top>
|
||||||
|
<small>Barista & Front of House</small>
|
||||||
|
<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.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
<Project>
|
||||||
|
<template #left>
|
||||||
|
<h4>BFI Riverfront Kitchen</h4>
|
||||||
|
</template>
|
||||||
|
<template #top>
|
||||||
|
<small>Cashier & Waiter</small>
|
||||||
|
<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.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<h2>Skills</h2>
|
||||||
|
<div class="skills-grid">
|
||||||
|
<div>
|
||||||
|
<strong>Service</strong><br /><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
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<strong>Technical</strong><br /><small
|
||||||
|
>EPOS systems, Stock management, Event coordination</small
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<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>
|
||||||
|
</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>
|
||||||
|
</div>
|
||||||
|
<small>BSc Computer Science with Mathematics </small>
|
||||||
|
</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>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<h2>Interests</h2>
|
||||||
|
<ul class="list-disc list-inside">
|
||||||
|
<li>Leetcode</li>
|
||||||
|
<li>Rhythm Games</li>
|
||||||
|
<li>Climbing, Gym</li>
|
||||||
|
<li>Board games, Meetup.com</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="no-print w-full h-20"></div>
|
||||||
|
</main>
|
||||||
</template>
|
</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>
|
|
||||||
|
|||||||
@@ -3,442 +3,229 @@ import Project from "./Project.vue";
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<main>
|
<main class="cv-template">
|
||||||
<div class="no-print w-full h-20"></div>
|
<div class="no-print w-full h-20"></div>
|
||||||
<div class="a4page justify-between">
|
<div class="a4page justify-between">
|
||||||
<section>
|
<section>
|
||||||
<div class="flex flex-col sm:flex-row sm:justify-between">
|
<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">
|
<div class="contact-details">
|
||||||
<p>London, United Kingdom</p>
|
<p>London, United Kingdom</p>
|
||||||
<p>+447563266931</p>
|
<p>+447563266931</p>
|
||||||
<p>adam.a.french@outlook.com</p>
|
<p>adam.a.french@outlook.com</p>
|
||||||
<p>
|
<p>
|
||||||
<a href="https://www.adam-french.co.uk">
|
<a href="https://www.adam-french.co.uk">
|
||||||
www.adam-french.co.uk
|
www.adam-french.co.uk
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<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.
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<h2>Skills</h2>
|
|
||||||
<div class="skills-grid">
|
|
||||||
<div>
|
|
||||||
<strong>Languages</strong><br /><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
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<strong>Backend / Infra</strong><br /><small
|
|
||||||
>Nginx, Docker, PostgreSQL, SQLite, JWT Auth, Git
|
|
||||||
Actions</small
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<h2>Projects</h2>
|
|
||||||
|
|
||||||
<Project class="border-b border-dotted">
|
|
||||||
<template v-slot:left>
|
|
||||||
<h4>
|
|
||||||
<a
|
|
||||||
href="https://www.adam-french.co.uk/gitea/adamf/web_server.git"
|
|
||||||
>
|
|
||||||
web_server.git
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template v-slot:top>
|
|
||||||
<small>
|
|
||||||
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.
|
|
||||||
</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"
|
|
||||||
>
|
|
||||||
tour.git
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template v-slot:top>
|
|
||||||
<small>Rust</small>
|
|
||||||
<small>2026</small>
|
|
||||||
</template>
|
|
||||||
<p contenteditable="true">
|
|
||||||
CLI tool for building and navigating interactive code
|
|
||||||
tutorials, with version-traversal semantics inspired by
|
|
||||||
Git.
|
|
||||||
</p>
|
|
||||||
</Project>
|
|
||||||
<Project class="border-b border-dotted">
|
|
||||||
<template v-slot:left>
|
|
||||||
<h4>
|
|
||||||
<a
|
|
||||||
href="https://www.adam-french.co.uk/gitea/adamf/rust-raytracer.git"
|
|
||||||
>
|
|
||||||
rust-raytracer.git
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template v-slot:top>
|
|
||||||
<small>Rust, Linear Algebra, Multithreading</small>
|
|
||||||
<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.
|
|
||||||
</p>
|
|
||||||
</Project>
|
|
||||||
<Project>
|
|
||||||
<template #left>
|
|
||||||
<h4>
|
|
||||||
<a
|
|
||||||
class="text-center w-full"
|
|
||||||
href="https://community.wolfram.com/groups/-/m/t/3210947"
|
|
||||||
>
|
|
||||||
Wolfram Summer School
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template #top>
|
|
||||||
<small>Wolfram Mathematica</small>
|
|
||||||
<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.
|
|
||||||
</p>
|
|
||||||
</Project>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<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>
|
|
||||||
</h2>
|
|
||||||
<div
|
|
||||||
class="flex-row flex place-content-between m-auto place-items-center"
|
|
||||||
>
|
|
||||||
<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">
|
|
||||||
<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>
|
|
||||||
</ul>
|
|
||||||
</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>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>
|
|
||||||
</ul>
|
|
||||||
</section>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div class="no-print w-full h-20"></div>
|
<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.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div class="a4page gap-10">
|
<section>
|
||||||
<section>
|
<h2>Skills</h2>
|
||||||
<h2>Experience</h2>
|
<div class="skills-grid">
|
||||||
<Project>
|
<div>
|
||||||
<template #left>
|
<strong>Languages</strong><br /><small
|
||||||
<h4>Hospitality</h4>
|
>Go, Rust, Python, JavaScript / TypeScript, SQL</small
|
||||||
</template>
|
>
|
||||||
<template #top>
|
</div>
|
||||||
<small>Cashier, Bartender, Waiter</small>
|
<div>
|
||||||
<small>Jan 2018 – Dec 2023</small>
|
<strong>Frontend / Web Design</strong><br /><small
|
||||||
</template>
|
>Vue, React / Redux, Svelte, Tailwind CSS, WebAssembly</small
|
||||||
<p contenteditable="true">
|
>
|
||||||
Worked at <strong>Belgrave Music Hall</strong>,
|
</div>
|
||||||
<strong>The Crown and Anchor</strong>, and
|
<div>
|
||||||
<strong>BFI Riverfront Kitchen</strong>. Developed
|
<strong>Backend / Infra</strong><br /><small
|
||||||
communication, composure under pressure, and reliability
|
>Nginx, Docker, PostgreSQL, SQLite, JWT Auth, Git Actions</small
|
||||||
in customer-facing roles.
|
>
|
||||||
</p>
|
</div>
|
||||||
</Project>
|
|
||||||
</section>
|
|
||||||
<div class="w-full flex flex-col sm:flex-row gap-5">
|
|
||||||
<section class="flex-1">
|
|
||||||
<h2>Soft Skills</h2>
|
|
||||||
<ul class="list-disc list-inside">
|
|
||||||
<li>Communication & collaboration</li>
|
|
||||||
<li>Attention to detail</li>
|
|
||||||
<li>Problem solving</li>
|
|
||||||
<li>Adaptability</li>
|
|
||||||
<li>Time management</li>
|
|
||||||
</ul>
|
|
||||||
</section>
|
|
||||||
<section class="flex-1">
|
|
||||||
<h2>Interests</h2>
|
|
||||||
<ul class="list-disc list-inside">
|
|
||||||
<li>Leetcode</li>
|
|
||||||
<li>Learning Mandarin</li>
|
|
||||||
<li>Rhythm Games</li>
|
|
||||||
<li>Climbing, Gym</li>
|
|
||||||
<li>Board games, Meetup.com</li>
|
|
||||||
</ul>
|
|
||||||
</section>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div class="no-print w-full h-20"></div>
|
<section>
|
||||||
</main>
|
<h2>Projects</h2>
|
||||||
|
|
||||||
|
<Project class="border-b border-dotted">
|
||||||
|
<template v-slot:left>
|
||||||
|
<h4>
|
||||||
|
<a
|
||||||
|
href="https://www.adam-french.co.uk/gitea/adamf/web_server.git"
|
||||||
|
>
|
||||||
|
web_server.git
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template v-slot:top>
|
||||||
|
<small>
|
||||||
|
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.
|
||||||
|
</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">
|
||||||
|
tour.git
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template v-slot:top>
|
||||||
|
<small>Rust</small>
|
||||||
|
<small>2026</small>
|
||||||
|
</template>
|
||||||
|
<p contenteditable="true">
|
||||||
|
CLI tool for building and navigating interactive code tutorials,
|
||||||
|
with version-traversal semantics inspired by Git.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
<Project class="border-b border-dotted">
|
||||||
|
<template v-slot:left>
|
||||||
|
<h4>
|
||||||
|
<a
|
||||||
|
href="https://www.adam-french.co.uk/gitea/adamf/rust-raytracer.git"
|
||||||
|
>
|
||||||
|
rust-raytracer.git
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template v-slot:top>
|
||||||
|
<small>Rust, Linear Algebra, Multithreading</small>
|
||||||
|
<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.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
<Project>
|
||||||
|
<template #left>
|
||||||
|
<h4>
|
||||||
|
<a
|
||||||
|
class="text-center w-full"
|
||||||
|
href="https://community.wolfram.com/groups/-/m/t/3210947"
|
||||||
|
>
|
||||||
|
Wolfram Summer School
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template #top>
|
||||||
|
<small>Wolfram Mathematica</small>
|
||||||
|
<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.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<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>
|
||||||
|
</h2>
|
||||||
|
<div
|
||||||
|
class="flex-row flex place-content-between m-auto place-items-center"
|
||||||
|
>
|
||||||
|
<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">
|
||||||
|
<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>
|
||||||
|
</ul>
|
||||||
|
</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>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>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="no-print w-full h-20"></div>
|
||||||
|
|
||||||
|
<div class="a4page gap-10">
|
||||||
|
<section>
|
||||||
|
<h2>Experience</h2>
|
||||||
|
<Project>
|
||||||
|
<template #left>
|
||||||
|
<h4>Hospitality</h4>
|
||||||
|
</template>
|
||||||
|
<template #top>
|
||||||
|
<small>Cashier, Bartender, Waiter</small>
|
||||||
|
<small>Jan 2018 – Dec 2023</small>
|
||||||
|
</template>
|
||||||
|
<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.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
</section>
|
||||||
|
<div class="w-full flex flex-col sm:flex-row gap-5">
|
||||||
|
<section class="flex-1">
|
||||||
|
<h2>Soft Skills</h2>
|
||||||
|
<ul class="list-disc list-inside">
|
||||||
|
<li>Communication & collaboration</li>
|
||||||
|
<li>Attention to detail</li>
|
||||||
|
<li>Problem solving</li>
|
||||||
|
<li>Adaptability</li>
|
||||||
|
<li>Time management</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
<section class="flex-1">
|
||||||
|
<h2>Interests</h2>
|
||||||
|
<ul class="list-disc list-inside">
|
||||||
|
<li>Leetcode</li>
|
||||||
|
<li>Learning Mandarin</li>
|
||||||
|
<li>Rhythm Games</li>
|
||||||
|
<li>Climbing, Gym</li>
|
||||||
|
<li>Board games, Meetup.com</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="no-print w-full h-20"></div>
|
||||||
|
</main>
|
||||||
</template>
|
</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>
|
|
||||||
|
|||||||
@@ -3,409 +3,217 @@ import Project from "./Project.vue";
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<main>
|
<main class="cv-template">
|
||||||
<div class="no-print w-full h-20"></div>
|
<div class="no-print w-full h-20"></div>
|
||||||
<div class="a4page justify-between">
|
<div class="a4page justify-between">
|
||||||
<section class="flex flex-col sm:flex-row sm:justify-between">
|
<section class="flex flex-col sm:flex-row sm:justify-between">
|
||||||
<h1 class="name">Adam French</h1>
|
<h1 class="name">Adam French</h1>
|
||||||
<div class="contact-details sm:text-right">
|
<div class="contact-details">
|
||||||
<p>+447563266931</p>
|
<p>London, United Kingdom</p>
|
||||||
<p>adam.a.french@outlook.com</p>
|
<p>+447563266931</p>
|
||||||
<h4>
|
<p>adam.a.french@outlook.com</p>
|
||||||
<a href="https://www.adam-french.co.uk">
|
<p>
|
||||||
www.adam-french.co.uk
|
<a href="https://www.adam-french.co.uk"> www.adam-french.co.uk </a>
|
||||||
</a>
|
</p>
|
||||||
</h4>
|
|
||||||
</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.
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<h2>Skills</h2>
|
|
||||||
<div class="skills-grid">
|
|
||||||
<div>
|
|
||||||
<strong>Languages</strong><br /><small
|
|
||||||
>Python, Go, Rust, Swift, JavaScript / TypeScript,
|
|
||||||
SQL</small
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<strong>Automation & Testing</strong><br /><small
|
|
||||||
>CI/CD Pipelines, GitHub Actions, Docker, Unit &
|
|
||||||
Integration Testing, WebAssembly</small
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<strong>Infrastructure</strong><br /><small
|
|
||||||
>Nginx, PostgreSQL, SQLite, JWT Auth, REST &
|
|
||||||
GraphQL APIs</small
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<h2>Projects</h2>
|
|
||||||
|
|
||||||
<Project class="border-b border-dotted">
|
|
||||||
<template v-slot:left>
|
|
||||||
<h4>
|
|
||||||
<a
|
|
||||||
href="https://www.adam-french.co.uk/gitea/adamf/web_server.git"
|
|
||||||
>
|
|
||||||
web_server.git
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template v-slot:top>
|
|
||||||
<small>
|
|
||||||
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.
|
|
||||||
</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"
|
|
||||||
>
|
|
||||||
tour.git
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template v-slot:top>
|
|
||||||
<small>Rust, Developer Tooling, CLI</small>
|
|
||||||
<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.
|
|
||||||
</p>
|
|
||||||
</Project>
|
|
||||||
<Project class="border-b border-dotted">
|
|
||||||
<template v-slot:left>
|
|
||||||
<h4>
|
|
||||||
<a
|
|
||||||
href="https://www.adam-french.co.uk/gitea/adamf/rust-raytracer.git"
|
|
||||||
>
|
|
||||||
rust-raytracer.git
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template v-slot:top>
|
|
||||||
<small>Rust, Linear Algebra, Multithreading</small>
|
|
||||||
<small>2023</small>
|
|
||||||
</template>
|
|
||||||
<p>
|
|
||||||
Parallelised recursive ray tracer for realistic 3D
|
|
||||||
rendering. Emphasised algorithmic efficiency and
|
|
||||||
low-level memory management in Rust.
|
|
||||||
</p>
|
|
||||||
</Project>
|
|
||||||
<Project>
|
|
||||||
<template #left>
|
|
||||||
<h4>
|
|
||||||
<a
|
|
||||||
class="text-center w-full"
|
|
||||||
href="https://community.wolfram.com/groups/-/m/t/3210947"
|
|
||||||
>
|
|
||||||
Wolfram Summer School
|
|
||||||
</a>
|
|
||||||
</h4>
|
|
||||||
</template>
|
|
||||||
<template #top>
|
|
||||||
<small>Wolfram Mathematica</small>
|
|
||||||
<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.
|
|
||||||
</p>
|
|
||||||
</Project>
|
|
||||||
</section>
|
|
||||||
</div>
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div class="no-print w-full h-20"></div>
|
<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.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div class="a4page gap-10">
|
<section>
|
||||||
<section>
|
<h2>Skills</h2>
|
||||||
<h2>Education</h2>
|
<div class="skills-grid">
|
||||||
<div class="w-full h-fit flex flex-col sm:flex-row gap-5">
|
<div>
|
||||||
<div class="flex-1 sm:border-r border-dotted sm:pr-3">
|
<strong>Languages</strong><br /><small
|
||||||
<h3>
|
>Python, Go, Rust, Swift, JavaScript / TypeScript, SQL</small
|
||||||
<a
|
>
|
||||||
href="https://www.adam-french.co.uk/pdf/transcript.pdf"
|
</div>
|
||||||
>
|
<div>
|
||||||
University of Leeds
|
<strong>Automation & Testing</strong><br /><small
|
||||||
</a>
|
>CI/CD Pipelines, GitHub Actions, Docker, Unit & Integration
|
||||||
</h3>
|
Testing, WebAssembly</small
|
||||||
<div
|
>
|
||||||
class="flex-row flex place-content-between m-auto place-items-center"
|
</div>
|
||||||
>
|
<div>
|
||||||
<small>First Class Honours (81.1%)</small>
|
<strong>Infrastructure</strong><br /><small
|
||||||
<small>2021–2025</small>
|
>Nginx, PostgreSQL, SQLite, JWT Auth, REST & GraphQL
|
||||||
</div>
|
APIs</small
|
||||||
<small>BSc Computer Science with Mathematics </small>
|
>
|
||||||
<ul class="list-disc list-inside">
|
</div>
|
||||||
<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>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="flex-1 sm:pl-3">
|
|
||||||
<h3>University of Waterloo</h3>
|
|
||||||
<div
|
|
||||||
class="flex-row flex place-content-between m-auto place-items-center"
|
|
||||||
>
|
|
||||||
<small>Year abroad</small>
|
|
||||||
<small>2023–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>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section>
|
|
||||||
<h2>Experience</h2>
|
|
||||||
<Project>
|
|
||||||
<template #left>
|
|
||||||
<p>Hospitality</p>
|
|
||||||
</template>
|
|
||||||
<template #top>
|
|
||||||
<small>Cashier, Bartender, Waiter</small>
|
|
||||||
<small>2018–2023</small>
|
|
||||||
</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
|
|
||||||
in customer-facing roles.
|
|
||||||
</p>
|
|
||||||
</Project>
|
|
||||||
<h2>Interests</h2>
|
|
||||||
<ul class="list-disc list-inside">
|
|
||||||
<li>Leetcode — daily competitive problem solving</li>
|
|
||||||
<li>iOS/macOS development — personal Swift projects</li>
|
|
||||||
<li>Learning Mandarin</li>
|
|
||||||
<li>Rhythm Games</li>
|
|
||||||
<li>Climbing · Gym</li>
|
|
||||||
<li>Board games · Meetup.com</li>
|
|
||||||
</ul>
|
|
||||||
</section>
|
|
||||||
</div>
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div class="no-print w-full h-20"></div>
|
<section>
|
||||||
</main>
|
<h2>Projects</h2>
|
||||||
|
|
||||||
|
<Project class="border-b border-dotted">
|
||||||
|
<template v-slot:left>
|
||||||
|
<h4>
|
||||||
|
<a
|
||||||
|
href="https://www.adam-french.co.uk/gitea/adamf/web_server.git"
|
||||||
|
>
|
||||||
|
web_server.git
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template v-slot:top>
|
||||||
|
<small>
|
||||||
|
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.
|
||||||
|
</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">
|
||||||
|
tour.git
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template v-slot:top>
|
||||||
|
<small>Rust, Developer Tooling, CLI</small>
|
||||||
|
<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.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
<Project class="border-b border-dotted">
|
||||||
|
<template v-slot:left>
|
||||||
|
<h4>
|
||||||
|
<a
|
||||||
|
href="https://www.adam-french.co.uk/gitea/adamf/rust-raytracer.git"
|
||||||
|
>
|
||||||
|
rust-raytracer.git
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template v-slot:top>
|
||||||
|
<small>Rust, Linear Algebra, Multithreading</small>
|
||||||
|
<small>2023</small>
|
||||||
|
</template>
|
||||||
|
<p>
|
||||||
|
Parallelised recursive ray tracer for realistic 3D rendering.
|
||||||
|
Emphasised algorithmic efficiency and low-level memory management in
|
||||||
|
Rust.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
<Project>
|
||||||
|
<template #left>
|
||||||
|
<h4>
|
||||||
|
<a
|
||||||
|
class="text-center w-full"
|
||||||
|
href="https://community.wolfram.com/groups/-/m/t/3210947"
|
||||||
|
>
|
||||||
|
Wolfram Summer School
|
||||||
|
</a>
|
||||||
|
</h4>
|
||||||
|
</template>
|
||||||
|
<template #top>
|
||||||
|
<small>Wolfram Mathematica</small>
|
||||||
|
<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.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="no-print w-full h-20"></div>
|
||||||
|
|
||||||
|
<div class="a4page gap-10">
|
||||||
|
<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>
|
||||||
|
</h2>
|
||||||
|
<div
|
||||||
|
class="flex-row flex place-content-between m-auto place-items-center"
|
||||||
|
>
|
||||||
|
<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">
|
||||||
|
<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>
|
||||||
|
</ul>
|
||||||
|
</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>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>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
<section>
|
||||||
|
<h2>Experience</h2>
|
||||||
|
<Project>
|
||||||
|
<template #left>
|
||||||
|
<p>Hospitality</p>
|
||||||
|
</template>
|
||||||
|
<template #top>
|
||||||
|
<small>Cashier, Bartender, Waiter</small>
|
||||||
|
<small>2018–2023</small>
|
||||||
|
</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
|
||||||
|
in customer-facing roles.
|
||||||
|
</p>
|
||||||
|
</Project>
|
||||||
|
<h2>Interests</h2>
|
||||||
|
<ul class="list-disc list-inside">
|
||||||
|
<li>Leetcode — daily competitive problem solving</li>
|
||||||
|
<li>iOS/macOS development — personal Swift projects</li>
|
||||||
|
<li>Learning Mandarin</li>
|
||||||
|
<li>Rhythm Games</li>
|
||||||
|
<li>Climbing · Gym</li>
|
||||||
|
<li>Board games · Meetup.com</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="no-print w-full h-20"></div>
|
||||||
|
</main>
|
||||||
</template>
|
</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>
|
|
||||||
|
|||||||
Reference in New Issue
Block a user