homepage/index.html

210 lines
7.4 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<html>
<head>
<title>Adam Burgess</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
box-sizing: border-box;
}
body {
background-image: url(assets/laputa.webp);
/* todo: revist image-set */
background-position-x: center;
background-size: cover;
color: white;
margin-top: 2em;
font-family: Inter, sans-serif;
font-size: 14px;
text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.25);
}
.container {
max-width: 1400px;
margin: 0 auto;
padding: 1em;
}
body, h1, h2, h3, p {
margin: 0;
}
h1, h2, [role="doc-subtitle"], h3 {
font-family: Merriweather, serif;
font-style: normal;
}
h3 {
font-family: sans-serif;
font-weight: 400;
font-size: 18px;
margin-bottom: 4px;
}
h1 {
font-weight: 900;
font-size: 96px;
margin-bottom: 48px;
}
[role="doc-subtitle"] {
font-weight: 300;
font-size: 36px;
}
h2 {
font-weight: 400;
font-size: 24px;
margin-bottom: 0.5em;
}
.box {
background: rgba(0, 0, 0, 0.25);
backdrop-filter: blur(6px);
border-radius: 6px;
padding: 8px;
position: relative;
left: -8px;
margin-bottom: 8px;
max-width: 700px;
text-shadow: 0px 0px 2px black;
}
footer {
text-align: right;
font-style: italic;
}
a, a:visited {
color: white;
}
code {
font-family: Consolas, monospace;
}
@font-face {
font-family: 'Merriweather';
font-style: normal;
font-weight: 400;
font-display: block;
src: url(assets/merriweather-regular.woff2) format('woff2');
}
@font-face {
font-family: 'Merriweather';
font-style: normal;
font-weight: 300;
font-display: block;
src: url(assets/merriweather-light.woff2) format('woff2');
}
@font-face {
font-family: 'Merriweather';
font-style: normal;
font-weight: 900;
font-display: block;
src: url(assets/merriweather-black.woff2) format('woff2');
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 400;
font-display: block;
src: url(assets/inter-regular.woff2) format('woff2');
}
</style>
<!--
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Merriweather:wght@300;400;900&display=swap&text=Software Developer in Sydney Projects" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Inter&display=swap" rel="stylesheet">
-->
</head>
<body>
<div class="container">
<h1>
Adam Burgess
<div role="doc-subtitle">Software Developer in&nbsp;Sydney</div>
</h1>
<h2>Projects</h2>
<div class="box">
<h3><a href="https://github.com/adamburgess/linq#readme">https://github.com/adamburgess/linq</a> - <a href="https://www.npmjs.com/package/@adamburgess/linq">@adamburgess/linq</a> on npm</h3>
<p>
I use C#'s <code>IEnumerable</code> extensions quite a lot, and the javascript version, <code>linq.js</code>, is very large.<br/>
My version is 1.25kb.
</p>
</div>
<div class="box">
<h3><a href="https://github.com/adamburgess/alpine-apk#readme">https://github.com/adamburgess/alpine-apk</a> - <a href="https://www.npmjs.com/package/alpine-apk">alpine-apk</a> on npm</h3>
<p>
Alpine Linux is a minimal linux distro, great for docker.<br/>
I wanted to query its package manager, APK, from Node.
</p>
</div>
<div class="box">
<h3><a href="https://github.com/adamburgess/nr#readme">https://github.com/adamburgess/nr</a> - <a href="https://www.npmjs.com/package/@adamburgess/nr">@adamburgess/nr</a> on npm</h3>
<p>
NPM's package.json <code>scripts</code> is quite convenient for running things.<br/>
Yet, <code>npm run X</code> and <code>yarn X</code> are fairly slow - 150ms+.<br/>
nr is a simple bash script using jq to run scripts. 30ms. Much faster.
</p>
</div>
<div class="box">
<h3><a href="https://github.com/adamburgess/celeste-high-frame-rate#readme">https://github.com/adamburgess/celeste-high-frame-rate</a></h3>
<p>
Celeste is a fun platformer, with a banger soundtrack.<br/>
The developers lock the ingame framerate to 60 fps, which is in my opinion <b>painful</b>.<br/>
This small patch overrides that limitation, and the game easily hits 240fps.
</p>
</div>
<div class="box">
<h3><a href="https://tarkov-time.adam.id.au">https://tarkov-time.adam.id.au</a> - source at <a href="https://github.com/adamburgess/tarkov-time">https://github.com/adamburgess/tarkov-time</a></h3>
<p>
Escape from Tarkov has a day/night cycle.<br/>
This site shows you the time, and how long it will be to a future time. Deployed on netlify.
</p>
</div>
<div class="box">
<h3><a href="https://crop.adam.id.au">https://crop.adam.id.au</a></h3>
<p>
A helper for <code>ffmpeg</code>'s <code>crop</code> filter.<br/>
Drag and drop an image and select it to get a crop filter in the correct format.
</p>
</div>
<div class="box">
<h3><a href="https://bundlephobia.fly.adam.id.au/size/@adamburgess/linq">https://bundlephobia.fly.adam.id.au/size/@adamburgess/linq</a></h3>
<p>
bundlephobia.com uses webpack. I've found it gives slightly inaccurate results because of this.<br/>
I also wanted to get the brotlified sizes for my packages.<br/>
This builds the package with rollup. Deployed on fly.io.<br/>
No UI as of yet, but it also generates <a href="https://bundlephobia.fly.adam.id.au/size/@adamburgess/linq?shield&brotli">shields</a> see the readme of my linq package above for examples.
</p>
</div>
<div class="box">
<h3><a href="https://github.com/adamburgess/image-builder">https://github.com/adamburgess/image-builder</a></h3>
<p>
I build a lot (all) of my projects with Docker, so I've made my own base images. <br/>
Using Github Actions and a generated Makefile, they automatically update whenever a dependency changes whether it be the docker image, an alpine package, a github/lab repo, or an npm package.
</p>
</div>
<footer>
Background: Studio Ghibli - Laputa
</footer>
</div>
</body>
</html>