<script lang="ts">
	import GitLink from '$lib/GitLink.svelte';
	import FullWidthContent from '$lib/content-boxes/FullWidthContent.svelte';
	import Header from '$lib/header.svelte';
	import Logos from '$lib/language-logos/Logos.svelte';

	const title: string = "Stuff I've Done";
</script>

<Header {title} />
<main>
	<FullWidthContent>
		<h1><a href="/articles/owlboard">OwlBoard</a></h1>
		<br />
		<GitLink url={'https://git.fjla.uk/owlboard'} />
		<Logos
			langs={['js', 'ts', 'py', 'go', 'html', 'css']}
			plats={['svelte', 'express', 'mongo', 'redis']}
		/>
		<p>
			Working full time on the 'iron road', left me wanting a faster way to get the information I
			needed. OwlBoard evolved from <a href="/articles/athena">Athena</a> and grew to provide more
			information that frontline rail colleagues need. <a href="">Read more...</a>
		</p>
	</FullWidthContent>
	<FullWidthContent>
		<h1><a href="/articles/map-dots">map-dots</a></h1>
		<br />
		<Logos langs={['go', 'py']} plats={[]} />
		<p>
			I like to collect data, I am just not always sure what to do with that data. map-dots takes in
			location history data and produces imagery. It can also run as a server and the map-dots-fetch
			script can be used to fetch and save configurable images.
		</p>
	</FullWidthContent>
</main>

<style>
	h1 {
		margin-bottom: 8px;
		padding-top: 5px;
		font-family: shadowsintolight;
	}
</style>
