Add about page

content/.obsidian/workspace

@@ -4,12 +4,12 @@
     "type": "split",
     "children": [
       {
-        "id": "25a79872dfa9b9bf",
+        "id": "a52c87ba4e7df223",
         "type": "leaf",
         "state": {
           "type": "markdown",
           "state": {
-            "file": "Fake Dog.md",
+            "file": "About.md",
             "mode": "source",
             "source": false
           }
@@ -69,7 +69,7 @@
             "state": {
               "type": "backlink",
               "state": {
-                "file": "Fake Dog.md",
+                "file": "About.md",
                 "collapseAll": false,
                 "extraContext": false,
                 "sortOrder": "alphabetical",
@@ -86,7 +86,7 @@
             "state": {
               "type": "outline",
               "state": {
-                "file": "Fake Dog.md"
+                "file": "About.md"
               }
             }
           }
@@ -97,17 +97,17 @@
     "direction": "horizontal",
     "width": 300
   },
-  "active": "25a79872dfa9b9bf",
+  "active": "a52c87ba4e7df223",
   "lastOpenFiles": [
-    "Fake Dog.md",
+    "About.md",
-    "Bypassing Ports.md",
+    "media/Pasted image 20220701212211.png",
-    "Backup Strategy.md",
+    "media/fake-dog3.jpg",
+    "media/Pasted image 20220726153803.png",
     "Acoustic Panels.md",
-    "Things I Recommend.md",
+    "QotNews.md",
-    "Wine Crate Coffee Table.md",
+    "t0 Services.md",
-    "Spaceport.md",
+    "Linux Flavour.md",
-    "Protospace.md",
+    "Sensors.md",
-    "fake-dog.png.md",
+    "Fake Dog.md"
-    "media/fake-dog.png"
   ]
 }

content/About.md

@@ -0,0 +1,24 @@
+Title: About
+Date: 2022-07-23
+Category: Notes
+Summary: About me and my website.
+Short: a
+Wide: true
+
+<img class="floated" src="/media/me.jpg">
+
+## Me
+I was born in the early '90s and spent a lot of time growing up playing with computers and electricity. It eventually became my passion and lead to me getting a degree in electrical engineering with a minor in computer engineering. I then got into makerspaces and the maker movement: like-minded people getting together to build things for fun. Most of what I build is software because I can work on it from anywhere. When I build physical things they usually involve electricity as a means to allow software to interact with the world. I work in the home automation field and have spent a lot of time automating my own home.
+
+### Uses
+I do my computing on a ThinkPad X1 Carbon laptop running Debian GNU/Linux with GNOME. Most of my work is done over ssh because it allows me to pause or move to my desktop quickly and there's less risk of losing data. I edit text with Vim in Byobu (tmux) terminal sessions. I browse the web with Librewolf, a privacy fork of Firefox. I mainly communicate via Telegram Messenger or email.
+
+I don't like tweaking or configuring settings so I try to leave things default unless something really annoys me or it improves my workflow greatly. It's easy to sink an infinite amount of time into optimizing your workflow and then die having made nothing.
+
+## Website
+There's two versions of this website, a main version at <https://tannercollin.com> and a lite version at <https://t0.vc>. The reason is because I found myself continually removing features from the main version for sport and to satisfy my millennial craving for minimalism. I was already running several [[t0 Services | services]] on t0.vc subdomains but had nothing on the main domain. So it's the perfect use for it and I can experiment to see how minimal I can take it.
+
+### Colophon
+I use the static site generator Pelican to build the websites from a folder of markdown documents which I edit with Obsidian in Vim mode. This makes writing content feel like taking notes, since media and internal links are taken care of. The two versions are simply different themes loaded by different Pelican configs. The output is uploaded to my host via rsync and served by Nginx.
+
+You can find the [source code](https://git.tannercollin.com/tanner/personal-site) on my Gitea.

content/Protospace.md

@@ -29,7 +29,7 @@ I set up a simple hydroponics garden in a broken medical lung testing chamber th
 
 A picture of the garden is taken every 5 minutes and uploaded to Spaceport. I'll eventually make a time lapse of the vegetable growth and plot a graph of the internal air temperature.
 
-![[protospace-garden.png]]
+![[protospace-garden.jpg]]
 
 ### Telemetry
 

themes/lite/templates/article.html

@@ -19,9 +19,12 @@
 		{% for tag in article.tags %}
 		<meta name="tags" content="{{tag}}" />
 		{% endfor %}
+
 		{% endblock %}
 
 		{% block style %}
+
+
 		<style>
 			a.external {
 				background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath fill='%23fff' stroke='%23000' d='M1.5 4.518h5.982V10.5H1.5z'/%3E%3Cpath fill='%23000' d='M5.765 1H11v5.39L9.427 7.937l-1.31-1.31L5.393 9.35l-2.69-2.688 2.81-2.808L4.2 2.544z'/%3E%3Cpath fill='%23fff' d='m9.995 2.004.022 4.885L8.2 5.07 5.32 7.95 4.09 6.723l2.882-2.88-1.85-1.852z'/%3E%3C/svg%3E%0A");
@@ -35,6 +38,7 @@
 			}
 			.content {
 				max-width: 600px;
+				line-height: 1.4;
 			}
 			.toclink {
 				color: black;
@@ -56,11 +60,15 @@
 			.toc {
 				display: none;
 			}
-			img {
+			img:not(.floated) {
 				width: 600px;
 				max-width: 100%;
 				height: auto;
 			}
+			.floated {
+				float: left;
+				margin-right: 1rem;
+			}
 		</style>
 	</head>
 	{% endblock %}

themes/theme/templates/about.html

@@ -0,0 +1,93 @@
+{% extends "base.html" %}
+
+{% block head %}
+	{{ super() }}
+
+	<meta name="description" content="The personal website of Tanner Collin." />
+	<meta name="summary" content="The personal website of Tanner Collin." />
+{% endblock %}
+
+{% block info %}
+	<picture>
+		<source type="image/webp" srcset="/theme/me.webp">
+		<source type="image/jpeg" srcset="/theme/me.jpg">
+		<img src="/theme/me.jpg" width="128" height="164" class="me" alt="me smiling wide and looking into the camera lit up brightly">
+	</picture>
+
+	<div class="info">
+		<h1>Tanner Collin</h1>
+		<p class="contact-icons">
+			<a href="mailto:site4@tannercollin.com" rel="noreferrer noopener"><img alt="email" src="/theme/mail.svg" width="20" height="20" /></a>
+			<a href="https://t.me/tannercollin" target="_blank" rel="noreferrer noopener"><img alt="telegram" src="/theme/telegram.svg" width="20" height="20" /></a>
+			<a href="https://github.com/tannercollin" target="_blank" rel="noreferrer noopener"><img alt="github" src="/theme/github.svg" width="20" height="20" /></a>
+		</p>
+	</div>
+{% endblock %}
+
+{% block content %}
+	<div class="content index">
+		<p>
+			Hi, I'm Tanner! I like home automation, <a href="/sensors">sensors</a>, privacy, bots, Python, Debian, coffee, and makerspaces.
+		</p>
+
+		<h2>Contact Info</h2>
+
+		<p>
+			Email: <a href="mailto:site4@tannercollin.com">site4@tannercollin.com</a> <br />
+			Telegram: <a href="https://t.me/tannercollin" target="_blank" rel="noreferrer noopener">@tannercollin</a>
+		</p>
+
+		<h2>Resume</h2>
+
+		<ul>
+			<li>Firmware Engineer at <a class="external" href="https://cabanablockchain.com" target="_blank" rel="noreferrer noopener">Cabana Blockchain</a>, 2018–</li>
+			<li>Lead Hardware Engineer at <a class="external" href="https://criticalcontrol.com/" target="_blank" rel="noreferrer noopener">Critical Control</a>, 2016–2018</li>
+			<li>Electrical Engineer at <a class="external" href="https://www.opener.aero/" target="_blank" rel="noreferrer noopener">Opener Aero</a>, 2016–2016</li>
+			<li>Electrical Engineer Intern at <a class="external" href="https://www.pason.com/" target="_blank" rel="noreferrer noopener">Pason Systems</a>, 2014–2015</li>
+			<li>BSc. Electrical Engineering from University of Calgary</li>
+		</ul>
+
+		<h2>Projects</h2>
+
+		<p>
+			My main hobby is working on software projects. I typically design websites or
+			build tools that make my life easier.
+		</p>
+
+		{% for article in articles_page.object_list if article.category.name == 'Projects' %}
+			<h3><a href="{{ article.url }}">{{ article.title }}</a></h3>
+			<div class="summary">
+				{{ article.summary }}
+			</div>
+		{% endfor %}
+
+		<h3>
+			<a class="external" href="https://github.com/tannercollin/standardnotes-fs" target="_blank" rel="noreferrer noopener">standardnotes-fs</a>
+		</h3>
+		<div class="summary">
+			<p>A filesystem that mounts your Standard Notes account as a directory of text files that you can edit.</p>
+		</div>
+
+		<h2>Creations</h2>
+
+		<p>Sometimes I create art or interactive tech.</p>
+
+		{% for article in articles_page.object_list if article.category.name == 'Creations' %}
+			<h3><a href="{{ article.url }}">{{ article.title }}</a></h3>
+			<div class="summary">
+				{{ article.summary }}
+			</div>
+		{% endfor %}
+
+		<h2>Writing</h2>
+
+		<p>Various articles, mostly about computers.</p>
+
+		{% for article in articles_page.object_list if article.category.name == 'Writing' %}
+			<h3><a href="{{ article.url }}">{{ article.title }}</a></h3>
+			<div class="summary">
+				{{ article.summary }}
+			</div>
+		{% endfor %}
+	</div>
+{% endblock %}

themes/theme/templates/style.css

@@ -99,12 +99,17 @@
 				font: 1.1rem/1.5 serif;
 			}
 
-			.content img {
+			.content img:not(.floated) {
 				width: 100%;
 				max-width: 36rem;
 				height: auto;
 			}
 
+			.content .floated {
+				float: left;
+				margin-right: 1rem;
+			}
+
 			.content .aside {
 				display: inline;
 				float: left;