Colophon
I built my first portfolio webpage in 2018, welcome to its 2nd iteration.
Tech stack
This version of the website is built using Svelte (+ Sapper for routing) and is hosted on Vercel. It takes advantage of Github Actions for pulling ~live data from various APIs and updating the corresponding JSON files.
The projects, blog entries etc are written in markdown and parsed as HTML using marked. Here's the guide I used for setting up Netlify CMS with a Sapper app.
Style Guide
I wanted this version of the website to be minimalistic and scalable for years to come and I've tried my best to keep the design somewhat evergreen.
Typefaces
- Akkurat for the main body and content
- SF Mono for code snippets and other highlighted details
- Recoleta for sweg š
CSS Palette
:root {
/* Backgrounds */
--dark-background: #161616;
--light-background: #dadada;
/* Text colours */
--dark-text: #2B2B2B;
--light-text: #dadada;
/* Link underline and hover background */
--link-underline: inset 0 -8px 0;
--link-background: inset 0 -20px 0;
--dark-link-color: #353535;
--dark-link-underline: #93939388;
--dark-link-hover-bg: #939393b7;
--dark-link-hover: #313131;
--light-link-color: #e2e2e2;
--light-link-underline: #81818171;
--light-link-hover-bg: #666666;
--light-link-hover: #f0f0f0;
/* Blockquote background */
--dark-blockquote-background: #dadada28;
--light-blockquote-background: #2B2B2B28;
/* Card shadows */
--light-card-shadow: 7px 7px 21px -10px #000000;
--dark-card-shadow: 7px 7px 21px -10px #252525;
/* Selection colour */
--selection-font: #ffffff;
--selection-background: #00415f73;
}
Licenses
- The complete source-code is liĀcensed unĀder the MIT liĀcense
- All the text conĀtent is liĀcensed unĀder Creative Commons Attribution International 4.0 liĀcense (CC-BY 4.0)
- The website is also copyrighted