Initial pass on print CV
This commit is contained in:
Max Franklin
parent
f8ec65a103
commit
98572eafa4
212
_content/cv.json
Normal file
212
_content/cv.json
Normal file
@ -0,0 +1,212 @@
|
||||
{
|
||||
"header": {
|
||||
"name": "Max Franklin",
|
||||
"email": "mx@suroh.tk",
|
||||
"phone": "+33 (0) 7 66 14 33 99",
|
||||
"website": "https://work.suroh.tk/",
|
||||
"git": [
|
||||
"https://github.com/m3astwood",
|
||||
"https://git.suroh.tk/"
|
||||
],
|
||||
"summary": "Developer and designer excited by web standards, and open source culture. Previously an educator of Web, UX and UI design and currently working as a fullstack developer, looking to embed themselves in a team where they can integrate and continue to grow. Skilled in TypeScript, CSS, Angular, WebComponents, Node, some experience with Ruby, Lua, Vue, Svelte, Deno, Sass, Docker and git. Very proficient using Figma and PenPot, Adobe Suite (and open source equivalents), and applying user experience principals with an attention to good accessibility practices."
|
||||
},
|
||||
"experience": [
|
||||
{
|
||||
"title": "Professional Experience",
|
||||
"slug": "professional-experience",
|
||||
"items": [
|
||||
{
|
||||
"title": "Arturia",
|
||||
"summary": "Fullstack developer within the internal tools team. Primary focus working on application to manage data across many different services within all areas of the company.",
|
||||
"dates": [
|
||||
"March 2024",
|
||||
"April 2025"
|
||||
],
|
||||
"location": "Montbonnot-Saint-Martin, FR",
|
||||
"position": "Fullstack Developer",
|
||||
"skills": [
|
||||
"Typescript", "Angular", "Ruby", "HTML", "CSS", "AGILE"
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "Rooms for Listening & Looking",
|
||||
"summary": "Touch screen interface presenting additional video and sound art not included in the Meredith Monk: Calling exhibition. Interface was offline, limited access within the gallery space.",
|
||||
"dates": [
|
||||
"September 2022"
|
||||
],
|
||||
"location": "Amsterdam, NL",
|
||||
"position": "Freelance Web Developer",
|
||||
"skills": [
|
||||
"Interaction Design", "SPA", "WebComponents", "HTML", "CSS"
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "Fondation Meyer",
|
||||
"summary": "Update and modernisation for website to make responsive maintaining lightweight tools with simple deployment.",
|
||||
"dates": [
|
||||
"September 2022"
|
||||
],
|
||||
"location": "Paris, FR",
|
||||
"position": "Freelance Web Developer",
|
||||
"skills": [
|
||||
"HTML", "CSS", "JavaScript", "IndexedDB"
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "NOOR Images: Green Shoots",
|
||||
"summary": "Website development for an online photo exhibition during the pandemic.",
|
||||
"dates": [
|
||||
"May 2022"
|
||||
],
|
||||
"location": "Paris, FR",
|
||||
"position": "Freelance Web Developer",
|
||||
"skills": [
|
||||
"HTML", "CSS", "JavaScript", "PHP"
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "World Press Photo",
|
||||
"summary": "Introduction animation design and development for online exhibition during the pandemic.",
|
||||
"dates": [
|
||||
"May 2021"
|
||||
],
|
||||
"location": "Paris, FR",
|
||||
"position": "Freelance Developer",
|
||||
"skills": [
|
||||
"GSAP", "HTML", "CSS", "JavaScript"
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "stone throw",
|
||||
"summary": "Online art work simulating the degradation of digital files as if they were scanned documents, which in turn progresses a generative musical composition.",
|
||||
"dates": [
|
||||
"July 2020"
|
||||
],
|
||||
"location": "Rotterdam, NL",
|
||||
"position": "Freelance Developer",
|
||||
"skills": [
|
||||
"NodeJS", "Express", "Socket.io", "WebComponents", "HTML", "CSS", "JavaScript", "Icecast", "Pure Data"
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "Performance Lab",
|
||||
"summary": "Web design and development for an art organisation based in Rotterdam, NL. Website to serve primarily as an online archive of outcomes from live public events.",
|
||||
"dates": [
|
||||
"June 2020"
|
||||
],
|
||||
"location": "Rotterdam, NL",
|
||||
"position": "Freelance Developer",
|
||||
"skills": [
|
||||
"HTML", "CSS", "JavaScript", "PHP"
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "Willem de Kooning Academy",
|
||||
"summary": "Tutor of the second year graphic design bachelor. Followed students working towards projects developing their design thinking, research and experimentation skills",
|
||||
"dates": [
|
||||
"August 2020",
|
||||
"July 2022"
|
||||
],
|
||||
"location": "Rotterdam, NL",
|
||||
"position": "Graphic Design Tutor",
|
||||
"skills": [
|
||||
"Course design", "Teaching", "Design Thinking", "UX/UI Theory"
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "Paris College of Art",
|
||||
"summary": "Organised courses within the undegraduate Communication Design department, and Masters of Transdisciplinary New Media program. UX/UI design covering the conceptual and practical application of user experience principals with a particular focus on accessibility. Web design & development covering basic HTML and CSS. Sound design elective covering recording, editing, production and synthesis.",
|
||||
"dates": [
|
||||
"September 2018",
|
||||
"May 2022"
|
||||
],
|
||||
"location": "Paris, FR",
|
||||
"position": "Tutor",
|
||||
"skills": [
|
||||
"Course design", "Teaching", "UX/UI Theory & application", "Web Design", "Sound Design"
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "LISAA",
|
||||
"summary": "Running year long class on UX/UI design applying conceptual user experience skills in Figma and web design covering the basics of HTML and CSS.",
|
||||
"dates": [
|
||||
"September 2020",
|
||||
"June 2021"
|
||||
],
|
||||
"location": "Paris, FR",
|
||||
"position": "UX/UI & Web Design Tutor",
|
||||
"skills": [
|
||||
"Course design", "Teaching", "UX/UI Theory & application", "Web Design"
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "École Européean des Métiers de l'Internet",
|
||||
"summary": "Tutor of design fundamentals for first year students across all disciplines.",
|
||||
"dates": [
|
||||
"September 2018",
|
||||
"June 2019"
|
||||
],
|
||||
"location": "Paris, FR",
|
||||
"position": "Graphic Design Tutor",
|
||||
"skills": [
|
||||
"Course design", "Teaching", "Design Fundamentals"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "Personal Projects",
|
||||
"slug": "personal-projects",
|
||||
"items": [
|
||||
{
|
||||
"title": "Quickdial Firefox Extension",
|
||||
"summary": "Minimalist tab quickdial link page that saves links and categories as bookmarks and folders. Exercise to learn browser extension API using bookmarks as storage, and learning the Firefox developer pipeline.",
|
||||
"dates": [
|
||||
"2023"
|
||||
],
|
||||
"position": "Frontend/Web Extension Development",
|
||||
"skills": [
|
||||
"WebComponents", "Web Extensions", "JavaScript", "HTML", "CSS"
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "Ethermap",
|
||||
"summary": "Collaborative map tool inspired by Etherpad. Built as a constant need to easily collaborate on, and share maps, and to further develop fullstack skills.",
|
||||
"dates": [
|
||||
"2023"
|
||||
],
|
||||
"position": "Fullstack Development",
|
||||
"skills": [
|
||||
"NodeJs", "Express", "Socket.io", "Objection.js", "jest", "WebComponents", "TypeScript", "HTML", "CSS"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "Education",
|
||||
"slug": "education",
|
||||
"items": [
|
||||
{
|
||||
"title": "Master Fine Art & Design : Experimental Publishing",
|
||||
"summary": "Master concerned with the inquiry and participation into the technological frameworks, political context and cultural processes through which things are made public; and how these are, or can be, used to create publics.",
|
||||
"dates": [
|
||||
"September 2016",
|
||||
"May 2018"
|
||||
],
|
||||
"location": "Piet Zwart Institute, Rotterdam NL",
|
||||
"skills": []
|
||||
},
|
||||
{
|
||||
"title": "Bachelor of Music : Jazz Performance (Saxophone) & Creative Sound Engineering",
|
||||
"summary": "",
|
||||
"dates": [
|
||||
"2006",
|
||||
"2010"
|
||||
],
|
||||
"location": "Conservatorium of Music, Sydney University, Sydney AU",
|
||||
"skills": []
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
327
_content/cv.md
327
_content/cv.md
@ -1,169 +1,168 @@
|
||||
---
|
||||
title: cv
|
||||
layout: page.webc
|
||||
layout: cv.webc
|
||||
category: root
|
||||
---
|
||||
|
||||
## Max Franklin
|
||||
|
||||
_mx[at]suroh.tk_\
|
||||
_+33 (0) 7 66 14 33 99_\
|
||||
_[@suroh@post.lurk.org](https://post.lurk.org/@suroh)_
|
||||
|
||||
### Development
|
||||
|
||||
Arturia\
|
||||
2024 - Current // Grenoble, FR\
|
||||
Fullstack developer
|
||||
|
||||
### Freelance
|
||||
|
||||
_Meredith Monk : Rooms for Listening & Looking_\
|
||||
Oude Kerk\
|
||||
2023 // Amsterdam, NL\
|
||||
Development of application to showcase video and audio work
|
||||
|
||||
_Fondation Meyer_\
|
||||
2022 // Paris, FR\
|
||||
Website development
|
||||
|
||||
_Green-Shoots_\
|
||||
NOOR Images\
|
||||
2022 // Paris, FR\
|
||||
Website development
|
||||
|
||||
_World Press Photo_\
|
||||
2021 // Paris, FR\
|
||||
Website development for online exhibition
|
||||
|
||||
_Performance Lab Workshop Series_\
|
||||
2019 // Rotterdam, NL\
|
||||
Website design & development
|
||||
|
||||
### Teaching
|
||||
|
||||
_Willem de Kooning Academie_\
|
||||
2020 - 2023 // Rotterdam, NL\
|
||||
Tutor within the Graphic Design Major
|
||||
|
||||
_Paris College of Art_\
|
||||
2014 - 2022 // Paris, FR\
|
||||
Faculty Member within the Communication Design department
|
||||
|
||||
_LISAA Graphic Design_\
|
||||
2020 - 2021 // Paris, FR\
|
||||
Faculty Member within the Graphic Design department
|
||||
|
||||
_École Européenne des Métiers de l'Internet_\
|
||||
2018 - 2019 // Paris, FR\
|
||||
Faculty Member within the Graphic Design department
|
||||
|
||||
### Sound
|
||||
|
||||
#### Performances
|
||||
_alternative echelons_\
|
||||
2020 // UBIK, Rotterdam, NL\
|
||||
|
||||
_Design Days Finnisage_\
|
||||
Espace 15\
|
||||
2019 // Paris, FR
|
||||
|
||||
_Read My Lips: No New Taxes_\
|
||||
Galerie Lecq\
|
||||
2019 // Rotterdam, NL
|
||||
|
||||
_E-ARTHA_\
|
||||
DePlayer\
|
||||
2018 // Rotterdam, NL
|
||||
|
||||
_North Sea Jazz Around Town_\
|
||||
VARIA\
|
||||
2018 // Rotterdam, NL
|
||||
|
||||
_POST TOAST_\
|
||||
Red Light Radio\
|
||||
2018 // Amsterdam, NL
|
||||
|
||||
#### Soundtracks
|
||||
|
||||
_Dragon Hunt_\
|
||||
by _Marko Gutić Mižimakov_\
|
||||
2023 // Brussels, BE\
|
||||
|
||||
_alternative echelons_ (trailer)\
|
||||
by Amy Pickles\
|
||||
2019
|
||||
|
||||
_Ghost Terminal_\
|
||||
by Ryan Cherewaty\
|
||||
2019
|
||||
|
||||
_Memory of Death's Dream_\
|
||||
by Ryan Cherewaty\
|
||||
2019
|
||||
|
||||
#### Studio Experience
|
||||
|
||||
_Linear Recording_\
|
||||
2009 – 2010 // Sydney, AU\
|
||||
Assistant Sound Engineer
|
||||
|
||||
### Selected Exhibitions & Events
|
||||
|
||||
_Sounds to See_\
|
||||
Sign Gallery\
|
||||
2019 // Groningen, NL\
|
||||
Group exhibition. Presented _A Container in Two Movements_.
|
||||
|
||||
_Autonomous Archive_\
|
||||
Het Nieuw Instituut\
|
||||
2017 // Rotterdam, NL\
|
||||
Archival machine, installation and research project centred around autonomous living and archival practices. Presented alongside the Architecture of Appropriation exhibition.
|
||||
|
||||
_TGC#3 : Euclid_\
|
||||
De Player\
|
||||
2017 // Rotterdam, NL\
|
||||
Experimental sound publication object and performative instrument. Collaborative project between De Player and the Piet Zwart Experimental Publishing unit.
|
||||
|
||||
_LowTechLabLondon2016_\
|
||||
Saatchi Gallery\
|
||||
2016 // London, UK\
|
||||
International art lab organised by Raul Marroquin around the theme of Low Tech.
|
||||
|
||||
_Festival de Projets Scolaires_\
|
||||
La Gaîté lyrique\
|
||||
2016 // Paris, FR\
|
||||
Partnership workshop show with Paris College of Art students and faculty.
|
||||
|
||||
_IDENTITE REVE(L)EE_\
|
||||
*Mi Gallery\
|
||||
Paris Digital Week\
|
||||
2015 // Paris, FR\
|
||||
Collaborative piece presented at *Mi Gallery as part of Paris Digital Week.
|
||||
|
||||
_Barcu Art Fair_\
|
||||
2015 // Bogota, CO\
|
||||
Presentation via Skype on Collaborative Art, Interactivity and Improvisation.
|
||||
|
||||
### Recent Programmes & Resdencies
|
||||
|
||||
_Thresholds of the Algorithmic_\
|
||||
Algorithms that Matter\
|
||||
2018 // Bergen, NO\
|
||||
Workshop-in-Exposition is a hybrid format that places the workshop inside an exhibition context, where the exposed works and artefacts form the basis of the workshop’s activity.
|
||||
|
||||
_Get a Room Residency_\
|
||||
Frontyard\
|
||||
2018 // Sydney, AU\
|
||||
Research residency around Master's research on Software and Improvisation.
|
||||
|
||||
### Education
|
||||
|
||||
_Piet Zwart Institute_\
|
||||
2016 - 2018 // Rotterdam, NL\
|
||||
Master's in Media Design : Experimental Publishing
|
||||
|
||||
_Conservatorium of Sydney (University of Sydney)_\
|
||||
2009 // Sydney, AU\
|
||||
Bachelor Jazz Performance (Saxophone) & Creative Sound Engineering
|
||||
|
||||
<!-- ## Max Franklin -->
|
||||
<!---->
|
||||
<!-- _mx[at]suroh.tk_\ -->
|
||||
<!-- _+33 (0) 7 66 14 33 99_\ -->
|
||||
<!-- _[@suroh@post.lurk.org](https://post.lurk.org/@suroh)_ -->
|
||||
<!---->
|
||||
<!-- ### Education -->
|
||||
<!---->
|
||||
<!-- _Piet Zwart Institute_\ -->
|
||||
<!-- 2016 - 2018 // Rotterdam, NL\ -->
|
||||
<!-- Master's in Media Design : Experimental Publishing -->
|
||||
<!---->
|
||||
<!-- _Conservatorium of Sydney (University of Sydney)_\ -->
|
||||
<!-- 2009 // Sydney, AU\ -->
|
||||
<!-- Bachelor Jazz Performance (Saxophone) & Creative Sound Engineering -->
|
||||
<!---->
|
||||
<!-- ### Development -->
|
||||
<!---->
|
||||
<!-- Arturia\ -->
|
||||
<!-- 2024 - Current // Grenoble, FR\ -->
|
||||
<!-- Fullstack developer -->
|
||||
<!---->
|
||||
<!-- ### Freelance -->
|
||||
<!---->
|
||||
<!-- _Meredith Monk : Rooms for Listening & Looking_\ -->
|
||||
<!-- Oude Kerk\ -->
|
||||
<!-- 2023 // Amsterdam, NL\ -->
|
||||
<!-- Development of application to showcase video and audio work -->
|
||||
<!---->
|
||||
<!-- _Fondation Meyer_\ -->
|
||||
<!-- 2022 // Paris, FR\ -->
|
||||
<!-- Website development -->
|
||||
<!---->
|
||||
<!-- _Green-Shoots_\ -->
|
||||
<!-- NOOR Images\ -->
|
||||
<!-- 2022 // Paris, FR\ -->
|
||||
<!-- Website development -->
|
||||
<!---->
|
||||
<!-- _World Press Photo_\ -->
|
||||
<!-- 2021 // Paris, FR\ -->
|
||||
<!-- Website development for online exhibition -->
|
||||
<!---->
|
||||
<!-- _Performance Lab Workshop Series_\ -->
|
||||
<!-- 2019 // Rotterdam, NL\ -->
|
||||
<!-- Website design & development -->
|
||||
<!---->
|
||||
<!-- ### Teaching -->
|
||||
<!---->
|
||||
<!-- _Willem de Kooning Academie_\ -->
|
||||
<!-- 2020 - 2023 // Rotterdam, NL\ -->
|
||||
<!-- Tutor within the Graphic Design Major -->
|
||||
<!---->
|
||||
<!-- _Paris College of Art_\ -->
|
||||
<!-- 2014 - 2022 // Paris, FR\ -->
|
||||
<!-- Faculty Member within the Communication Design department -->
|
||||
<!---->
|
||||
<!-- _LISAA Graphic Design_\ -->
|
||||
<!-- 2020 - 2021 // Paris, FR\ -->
|
||||
<!-- Faculty Member within the Graphic Design department -->
|
||||
<!---->
|
||||
<!-- _École Européenne des Métiers de l'Internet_\ -->
|
||||
<!-- 2018 - 2019 // Paris, FR\ -->
|
||||
<!-- Faculty Member within the Graphic Design department -->
|
||||
<!---->
|
||||
<!-- ### Sound -->
|
||||
<!---->
|
||||
<!-- #### Performances -->
|
||||
<!-- _alternative echelons_\ -->
|
||||
<!-- 2020 // UBIK, Rotterdam, NL\ -->
|
||||
<!---->
|
||||
<!-- _Design Days Finnisage_\ -->
|
||||
<!-- Espace 15\ -->
|
||||
<!-- 2019 // Paris, FR -->
|
||||
<!---->
|
||||
<!-- _Read My Lips: No New Taxes_\ -->
|
||||
<!-- Galerie Lecq\ -->
|
||||
<!-- 2019 // Rotterdam, NL -->
|
||||
<!---->
|
||||
<!-- _E-ARTHA_\ -->
|
||||
<!-- DePlayer\ -->
|
||||
<!-- 2018 // Rotterdam, NL -->
|
||||
<!---->
|
||||
<!-- _North Sea Jazz Around Town_\ -->
|
||||
<!-- VARIA\ -->
|
||||
<!-- 2018 // Rotterdam, NL -->
|
||||
<!---->
|
||||
<!-- _POST TOAST_\ -->
|
||||
<!-- Red Light Radio\ -->
|
||||
<!-- 2018 // Amsterdam, NL -->
|
||||
<!---->
|
||||
<!-- #### Soundtracks -->
|
||||
<!---->
|
||||
<!-- _Dragon Hunt_\ -->
|
||||
<!-- by _Marko Gutić Mižimakov_\ -->
|
||||
<!-- 2023 // Brussels, BE\ -->
|
||||
<!---->
|
||||
<!-- _alternative echelons_ (trailer)\ -->
|
||||
<!-- by Amy Pickles\ -->
|
||||
<!-- 2019 -->
|
||||
<!---->
|
||||
<!-- _Ghost Terminal_\ -->
|
||||
<!-- by Ryan Cherewaty\ -->
|
||||
<!-- 2019 -->
|
||||
<!---->
|
||||
<!-- _Memory of Death's Dream_\ -->
|
||||
<!-- by Ryan Cherewaty\ -->
|
||||
<!-- 2019 -->
|
||||
<!---->
|
||||
<!-- #### Studio Experience -->
|
||||
<!---->
|
||||
<!-- _Linear Recording_\ -->
|
||||
<!-- 2009 – 2010 // Sydney, AU\ -->
|
||||
<!-- Assistant Sound Engineer -->
|
||||
<!---->
|
||||
<!-- ### Selected Exhibitions & Events -->
|
||||
<!---->
|
||||
<!-- _Sounds to See_\ -->
|
||||
<!-- Sign Gallery\ -->
|
||||
<!-- 2019 // Groningen, NL\ -->
|
||||
<!-- Group exhibition. Presented _A Container in Two Movements_. -->
|
||||
<!---->
|
||||
<!-- _Autonomous Archive_\ -->
|
||||
<!-- Het Nieuw Instituut\ -->
|
||||
<!-- 2017 // Rotterdam, NL\ -->
|
||||
<!-- Archival machine, installation and research project centred around autonomous living and archival practices. Presented alongside the Architecture of Appropriation exhibition. -->
|
||||
<!---->
|
||||
<!-- _TGC#3 : Euclid_\ -->
|
||||
<!-- De Player\ -->
|
||||
<!-- 2017 // Rotterdam, NL\ -->
|
||||
<!-- Experimental sound publication object and performative instrument. Collaborative project between De Player and the Piet Zwart Experimental Publishing unit. -->
|
||||
<!---->
|
||||
<!-- _LowTechLabLondon2016_\ -->
|
||||
<!-- Saatchi Gallery\ -->
|
||||
<!-- 2016 // London, UK\ -->
|
||||
<!-- International art lab organised by Raul Marroquin around the theme of Low Tech. -->
|
||||
<!---->
|
||||
<!-- _Festival de Projets Scolaires_\ -->
|
||||
<!-- La Gaîté lyrique\ -->
|
||||
<!-- 2016 // Paris, FR\ -->
|
||||
<!-- Partnership workshop show with Paris College of Art students and faculty. -->
|
||||
<!---->
|
||||
<!-- _IDENTITE REVE(L)EE_\ -->
|
||||
<!-- *Mi Gallery\ -->
|
||||
<!-- Paris Digital Week\ -->
|
||||
<!-- 2015 // Paris, FR\ -->
|
||||
<!-- Collaborative piece presented at *Mi Gallery as part of Paris Digital Week. -->
|
||||
<!---->
|
||||
<!-- _Barcu Art Fair_\ -->
|
||||
<!-- 2015 // Bogota, CO\ -->
|
||||
<!-- Presentation via Skype on Collaborative Art, Interactivity and Improvisation. -->
|
||||
<!---->
|
||||
<!-- ### Recent Programmes & Resdencies -->
|
||||
<!---->
|
||||
<!-- _Thresholds of the Algorithmic_\ -->
|
||||
<!-- Algorithms that Matter\ -->
|
||||
<!-- 2018 // Bergen, NO\ -->
|
||||
<!-- Workshop-in-Exposition is a hybrid format that places the workshop inside an exhibition context, where the exposed works and artefacts form the basis of the workshop’s activity. -->
|
||||
<!---->
|
||||
<!-- _Get a Room Residency_\ -->
|
||||
<!-- Frontyard\ -->
|
||||
<!-- 2018 // Sydney, AU\ -->
|
||||
<!-- Research residency around Master's research on Software and Improvisation. -->
|
||||
|
||||
54
_includes/cv.webc
Normal file
54
_includes/cv.webc
Normal file
@ -0,0 +1,54 @@
|
||||
---
|
||||
layout: base.webc
|
||||
---
|
||||
|
||||
<section class="cv">
|
||||
<h2 @text="header.name"></h2>
|
||||
|
||||
<div class="sub">
|
||||
<div class="links">
|
||||
<a :href="header.website" @text="header.website"></a>
|
||||
<div class="gits">
|
||||
<a webc:for="git of header.git" :href="git" @text="git"></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="contact">
|
||||
<a :href="'mailto:' + header.email" @text="header.email"></a>
|
||||
<span @text="header.phone"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p @text="header.summary"></p>
|
||||
|
||||
<template webc:for="x of experience" webc:nokeep>
|
||||
<h3 @text="x.title" :id="x.slug"></h3>
|
||||
|
||||
<section webc:for="i of x.items" class="experience-item">
|
||||
<header>
|
||||
<h4 @text="i.title"></h4>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<p @text="i.summary"></p>
|
||||
|
||||
<ul class="skills">
|
||||
<li webc:for="skill of i.skills" @text="skill"></li>
|
||||
</ul>
|
||||
</main>
|
||||
|
||||
<aside>
|
||||
<div class="position" @text="i.position"></div>
|
||||
<div class="dates">
|
||||
<span @text="i.dates[0]"></span>
|
||||
<span webc:if="i.dates[1]" @text="' - ' + i.dates[1]"></span>
|
||||
</div>
|
||||
<div class="location" webc:if="i.location" @text="i.location"></div>
|
||||
</aside>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<!-- <section class="text" @raw="content"> -->
|
||||
<!-- </section> -->
|
||||
</section>
|
||||
|
||||
@ -36,6 +36,8 @@ html {
|
||||
--primary-colour-25: var(--neutral-900-25);
|
||||
--bg-colour: #fcfcfcff;
|
||||
--bg-colour-25: #fcfcfc33;
|
||||
|
||||
--max-char-width: 90ch;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
@ -73,7 +75,7 @@ input {
|
||||
}
|
||||
|
||||
p {
|
||||
max-width: 80ch;
|
||||
max-width: var(--max-char-width);
|
||||
}
|
||||
|
||||
p > img:first-of-type {
|
||||
@ -333,6 +335,129 @@ section.page h1 {
|
||||
|
||||
}
|
||||
|
||||
/* CV & PRINT */
|
||||
.cv {
|
||||
display: grid;
|
||||
gap: 1em;
|
||||
padding: 1em;
|
||||
max-width: var(--max-char-width);
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.sub {
|
||||
display: grid;
|
||||
gap: 0.25em;
|
||||
grid-template-columns: 1fr .4fr;
|
||||
|
||||
.contact > * {
|
||||
display: block;
|
||||
width: fit-content;
|
||||
}
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.experience-item {
|
||||
display: grid;
|
||||
grid-template-areas:
|
||||
'h h'
|
||||
'a m';
|
||||
grid-template-columns: 30ch 1fr;
|
||||
gap: 1em;
|
||||
|
||||
border-bottom: thin solid var(--primary-colour);
|
||||
|
||||
h4 {
|
||||
margin: 0;
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
.skills {
|
||||
list-style: none;
|
||||
margin: 1em 0;
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
li:before {
|
||||
padding: .25em;
|
||||
}
|
||||
}
|
||||
|
||||
header {
|
||||
grid-area: h;
|
||||
}
|
||||
|
||||
aside {
|
||||
grid-area: a;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.position {
|
||||
/* font-weight: 900; */
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.dates, .location {
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
.dates {
|
||||
margin-block-start: auto;
|
||||
}
|
||||
|
||||
.dates:last-child, .location {
|
||||
margin-block-end: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
main {
|
||||
grid-area: m;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media print {
|
||||
@page {
|
||||
margin: 15mm 2mm 19mm;
|
||||
}
|
||||
|
||||
body > *:not(section.cv) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.cv {
|
||||
font-size: 12pt;
|
||||
font-family: sans-serif;
|
||||
line-height: 1.25;
|
||||
|
||||
h2 {
|
||||
font-size: 2.5em;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
h3, h4 {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
h2, h3 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.experience-item {
|
||||
border-block-end-style: dotted;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* ANIMATIONS */
|
||||
|
||||
@keyframes fadeIn {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user