Deploying to gh-pages from @ 1e9dc81 🚀

jezen · Jan 27, 2024 · 3ed564b · 3ed564b
1 parent f080a04
commit 3ed564b
Show file tree

Hide file tree

Showing 238 changed files with 13,132 additions and 0 deletions.
diff --git a/20-percent-time-at-supercede/index.html b/20-percent-time-at-supercede/index.html
@@ -0,0 +1 @@
+<!DOCTYPE html><html><head><meta charset="utf-8"/><meta name="generator" content="hakyll"/><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="refresh" content="0; url=/2021/06/20-percent-time-at-supercede/"><link rel="canonical" href="/2021/06/20-percent-time-at-supercede/"><title>Permanent Redirect</title></head><body><p>The page has moved to: <a href="/2021/06/20-percent-time-at-supercede/">this page</a></p></body></html>
diff --git a/2013/07/the-setup/index.html b/2013/07/the-setup/index.html
@@ -0,0 +1,135 @@
+<!DOCTYPE html>
+<!--
+
+  [Please Enter New Password]
+
+  fortnight
+
+  [Error: Password is Two Week]
+
+-->
+<html lang="en">
+  <head>
+    <title>The Setup</title>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+    <meta name="description" content="A brief overview of the hardware and software I use to Get Stuff Done™.">
+    <meta name="author" content="Jezen Thomas">
+    <meta property="og:title" content="The Setup">
+    <meta property="og:description" content="A brief overview of the hardware and software I use to Get Stuff Done™.">
+    <meta property="og:type" content="article">
+    <meta property="og:image" content="/static/img/prestiz.jpg">
+    <meta property="og:site_name" content="Jezen Thomas">
+    <meta name="twitter:card" content="summary_large_image">
+    <meta property="twitter:domain" content="jezenthomas.com">
+    <meta name="twitter:title" content="The Setup">
+    <meta name="twitter:description" content="A brief overview of the hardware and software I use to Get Stuff Done™.">
+    <meta name="twitter:image" content="/static/img/prestiz.jpg">
+    <meta name="format-detection" content="telephone=no">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
+    <link rel="icon" type="image/gif" href="/doom.gif">
+    <link rel="stylesheet" type="text/css" href="/css/8dd7495893b5a187b3cbbe8b46043572.css">
+    <link rel="alternate" type="application/rss+xml" href="/feed.xml" title="RSS feed">
+  </head>
+  <body>
+    <div class="about">
+
+  <a class="portrait" href="/">
+    <img alt="Jezen Thomas" src="/static/img/jgt.jpg">
+  </a>
+
+  <h1 class="site-title">
+    <a href="/">Jezen Thomas</a>
+  </h1>
+
+  <p class="bio">
+    CTO &amp; Co-Founder at <a href="https://supercede.com">Supercede</a>.
+    Haskell programmer.
+    Writing about business and software engineering.
+    Working from anywhere.
+  </p>
+
+  <nav>
+    <ul>
+      <li>
+        <a href="/">Home</a>
+      </li>
+      <li>
+        <a aria-current="true" href="/posts">Blog</a>
+      </li>
+      <li>
+        <a href="/about">About</a>
+      </li>
+      <li id="bmac">
+        <a href="https://buymeacoffee.com/jezen">Buy me a coffee</a>
+      </li>
+    </ul>
+  </nav>
+
+  <footer>&copy; 2023 Jezen Thomas</footer>
+
+</div>
+
+    <div id="main"><div class="container">
+  <article>
+    <h1 class="post-title">The Setup</h1>
+    <div class="post-meta">
+      <p class="post-date">
+        July  2<sup>nd</sup>, 2013
+
+        | Göteborg, Sweden
+
+      </p>
+    </div>
+    <p>There’s a gear-nerd site online called <a href="http://usesthis.com/">The Setup</a> that
+interviews notable developers, designers, artists and engineers, with a focus
+on what equipment they use to Get Stuff Done. I’d like to join the fun too, so
+here’s some information about my setup.</p>
+<h2 id="what-hardware-do-you-use">What hardware do you use?</h2>
+<p>I use a 13” 1.3GHz i5 MacBook Air with 8GB of memory. I don’t have or need an
+awful amount of disk space — my machine is mostly for wrangling text in various
+forms. If I need to store anything large, I have a 2TB external disk.</p>
+<p>I’ve somehow managed to build a large collection of audio equipment over the
+years, but most of it is now redundant since adopting a sort of Bose-or-nothing
+stance. I shuffle between QC15s (lifesaver!), MIE2is (mostly when driving), and
+some desktop speakers.</p>
+<p>I tend not to use a mouse so much, but when I do I have a wireless Logitech.
+Not a fan of Android, so I have an iPhone.</p>
+<h2 id="and-what-software">And what software?</h2>
+<p>I run OSX, but most of my workflow lives in the terminal. I do almost all text
+editing with vim, and use <del>Grunt.js</del> simple Makefiles for automating tasks
+like processing Sass and CoffeeScript.</p>
+<p>I use a neat little tool called <a href="http://tmux.sourceforge.net/">tmux</a> to help me
+run several terminals at once. This is great for when I need to work on a
+couple of machines at once via SSH, or if I want to watch a compile tool like
+JSHint.</p>
+<p>I use zsh instead of bash, just because it’s a little easier to use. I use both
+Git and Mercurial for versioning, and I also use both those tools for
+deploying. Very neat little tools indeed.</p>
+<h2 id="what-would-be-your-dream-setup">What would be your dream setup?</h2>
+<p>I spend a lot of time travelling, so portability is probably the most important
+factor. Basically if I could have an 11” MacBook Air with Mac Pro performance,
+I’d be happy.</p>
+
+  </article>
+</div>
+</div>
+
+    <script type="text/javascript">
+    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+    ga('create', 'UA-37713515-1', 'auto');
+    ga('send', 'pageview');
+    </script>
+
+    <script type="text/javascript">
+      [].slice.call(document.querySelectorAll('.footnote-ref sup')).forEach(function(el) {
+        var content = el.innerText;
+        el.innerText = '[' + content + ']';
+      })
+    </script>
+    <script defer src="/static/js/katex/katex.min.js"></script>
+    <script defer src="/static/js/katex/auto-render.min.js" onload="renderMathInElement(document.body);"></script>
+  </body>
+</html>
diff --git a/2013/08/arcify/index.html b/2013/08/arcify/index.html
@@ -0,0 +1,120 @@
+<!DOCTYPE html>
+<!--
+
+  [Please Enter New Password]
+
+  fortnight
+
+  [Error: Password is Two Week]
+
+-->
+<html lang="en">
+  <head>
+    <title>Arcify</title>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+    <meta name="description" content="Animating the border-radius property with CSS3 for fun and profit.">
+    <meta name="author" content="Jezen Thomas">
+    <meta property="og:title" content="Arcify">
+    <meta property="og:description" content="Animating the border-radius property with CSS3 for fun and profit.">
+    <meta property="og:type" content="article">
+    <meta property="og:image" content="/static/img/arcify">
+    <meta property="og:site_name" content="Jezen Thomas">
+    <meta name="twitter:card" content="summary_large_image">
+    <meta property="twitter:domain" content="jezenthomas.com">
+    <meta name="twitter:title" content="Arcify">
+    <meta name="twitter:description" content="Animating the border-radius property with CSS3 for fun and profit.">
+    <meta name="twitter:image" content="/static/img/arcify">
+    <meta name="format-detection" content="telephone=no">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
+    <link rel="icon" type="image/gif" href="/doom.gif">
+    <link rel="stylesheet" type="text/css" href="/css/8dd7495893b5a187b3cbbe8b46043572.css">
+    <link rel="alternate" type="application/rss+xml" href="/feed.xml" title="RSS feed">
+  </head>
+  <body>
+    <div class="about">
+
+  <a class="portrait" href="/">
+    <img alt="Jezen Thomas" src="/static/img/jgt.jpg">
+  </a>
+
+  <h1 class="site-title">
+    <a href="/">Jezen Thomas</a>
+  </h1>
+
+  <p class="bio">
+    CTO &amp; Co-Founder at <a href="https://supercede.com">Supercede</a>.
+    Haskell programmer.
+    Writing about business and software engineering.
+    Working from anywhere.
+  </p>
+
+  <nav>
+    <ul>
+      <li>
+        <a href="/">Home</a>
+      </li>
+      <li>
+        <a aria-current="true" href="/posts">Blog</a>
+      </li>
+      <li>
+        <a href="/about">About</a>
+      </li>
+      <li id="bmac">
+        <a href="https://buymeacoffee.com/jezen">Buy me a coffee</a>
+      </li>
+    </ul>
+  </nav>
+
+  <footer>&copy; 2023 Jezen Thomas</footer>
+
+</div>
+
+    <div id="main"><div class="container">
+  <article>
+    <h1 class="post-title">Arcify</h1>
+    <div class="post-meta">
+      <p class="post-date">
+        August  8<sup>th</sup>, 2013
+
+        | Göteborg, Sweden
+
+      </p>
+    </div>
+    <p>I borrowed the idea from a design that I came across on
+<a href="http://simpledesktops.com/browse/desktops/2012/feb/14/arcify/">simpledesktops.com</a>,
+by this cool hacker guy <a href="https://twitter.com/abachman">Adam Bachman</a>. It
+consists of a number of different coloured arcs of varying lengths. I decided
+to try and bring it to life with some animation.</p>
+<p>Each arc is just a list-item in an unordered list. The part of the element
+you’re seeing is the border. I curved the borders with <code>border-radius</code>, and
+then just removed a few sides of the borders by making their colour
+transparent. The animation is just random degrees of rotation in keyframes,
+with an infinite transition time.</p>
+<p data-height="340" data-theme-id="477" data-slug-hash="CAHsk" data-default-tab="result" data-user="jezen" class="codepen">
+See the Pen <a href="http://codepen.io/jezen/pen/CAHsk/">Arcify</a> by Jezen Thomas (<a href="http://codepen.io/jezen"><span class="citation" data-cites="jezen">@jezen</span></a>) on <a href="http://codepen.io">CodePen</a>.
+</p>
+<script async src="//s.codepen.io/assets/embed/ei.js"></script>
+
+  </article>
+</div>
+</div>
+
+    <script type="text/javascript">
+    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+    ga('create', 'UA-37713515-1', 'auto');
+    ga('send', 'pageview');
+    </script>
+
+    <script type="text/javascript">
+      [].slice.call(document.querySelectorAll('.footnote-ref sup')).forEach(function(el) {
+        var content = el.innerText;
+        el.innerText = '[' + content + ']';
+      })
+    </script>
+    <script defer src="/static/js/katex/katex.min.js"></script>
+    <script defer src="/static/js/katex/auto-render.min.js" onload="renderMathInElement(document.body);"></script>
+  </body>
+</html>
diff --git a/2013/12/spirograph/index.html b/2013/12/spirograph/index.html
@@ -0,0 +1,115 @@
+<!DOCTYPE html>
+<!--
+
+  [Please Enter New Password]
+
+  fortnight
+
+  [Error: Password is Two Week]
+
+-->
+<html lang="en">
+  <head>
+    <title>Spirograph</title>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+    <meta name="description" content="A visualisation experiment in Sass using loops and animation.">
+    <meta name="author" content="Jezen Thomas">
+    <meta property="og:title" content="Spirograph">
+    <meta property="og:description" content="A visualisation experiment in Sass using loops and animation.">
+    <meta property="og:type" content="article">
+    <meta property="og:image" content="/static/img/prestiz.jpg">
+    <meta property="og:site_name" content="Jezen Thomas">
+    <meta name="twitter:card" content="summary_large_image">
+    <meta property="twitter:domain" content="jezenthomas.com">
+    <meta name="twitter:title" content="Spirograph">
+    <meta name="twitter:description" content="A visualisation experiment in Sass using loops and animation.">
+    <meta name="twitter:image" content="/static/img/prestiz.jpg">
+    <meta name="format-detection" content="telephone=no">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
+    <link rel="icon" type="image/gif" href="/doom.gif">
+    <link rel="stylesheet" type="text/css" href="/css/8dd7495893b5a187b3cbbe8b46043572.css">
+    <link rel="alternate" type="application/rss+xml" href="/feed.xml" title="RSS feed">
+  </head>
+  <body>
+    <div class="about">
+
+  <a class="portrait" href="/">
+    <img alt="Jezen Thomas" src="/static/img/jgt.jpg">
+  </a>
+
+  <h1 class="site-title">
+    <a href="/">Jezen Thomas</a>
+  </h1>
+
+  <p class="bio">
+    CTO &amp; Co-Founder at <a href="https://supercede.com">Supercede</a>.
+    Haskell programmer.
+    Writing about business and software engineering.
+    Working from anywhere.
+  </p>
+
+  <nav>
+    <ul>
+      <li>
+        <a href="/">Home</a>
+      </li>
+      <li>
+        <a aria-current="true" href="/posts">Blog</a>
+      </li>
+      <li>
+        <a href="/about">About</a>
+      </li>
+      <li id="bmac">
+        <a href="https://buymeacoffee.com/jezen">Buy me a coffee</a>
+      </li>
+    </ul>
+  </nav>
+
+  <footer>&copy; 2023 Jezen Thomas</footer>
+
+</div>
+
+    <div id="main"><div class="container">
+  <article>
+    <h1 class="post-title">Spirograph</h1>
+    <div class="post-meta">
+      <p class="post-date">
+        December  9<sup>th</sup>, 2013
+
+        | Göteborg, Sweden
+
+      </p>
+    </div>
+    <p>I wanted to create a visualisation by generating style rules with a loop in
+Sass. Making art like this is pretty simple; you draw a line, and adjust it
+slightly at regular intervals with the loop. The animation is slightly off-sync
+relative to the position of each respective line, which creates the effect of
+the shape evolving through many interesting patterns.</p>
+<p data-height="540" data-theme-id="477" data-slug-hash="bCyrF" data-user="jezen" data-default-tab="result" class="codepen">
+See the Pen <a href="http://codepen.io/jezen/pen/bCyrF">bCyrF</a> by Jezen Thomas (<a href="http://codepen.io/jezen"><span class="citation" data-cites="jezen">@jezen</span></a>) on <a href="http://codepen.io">CodePen</a>
+</p>
+<script async src="//codepen.io/assets/embed/ei.js"></script>
+
+  </article>
+</div>
+</div>
+
+    <script type="text/javascript">
+    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+    ga('create', 'UA-37713515-1', 'auto');
+    ga('send', 'pageview');
+    </script>
+
+    <script type="text/javascript">
+      [].slice.call(document.querySelectorAll('.footnote-ref sup')).forEach(function(el) {
+        var content = el.innerText;
+        el.innerText = '[' + content + ']';
+      })
+    </script>
+    <script defer src="/static/js/katex/katex.min.js"></script>
+    <script defer src="/static/js/katex/auto-render.min.js" onload="renderMathInElement(document.body);"></script>
+  </body>
+</html>