Add a bit of content

about.rst

@@ -1,17 +0,0 @@
----
-title: About
----
-Nullam imperdiet sodales orci vitae molestie. Nunc quam orci, pharetra a
-rhoncus vitae, eleifend id felis. Suspendisse potenti. Etiam vitae urna orci.
-Quisque pellentesque dignissim felis, egestas tempus urna luctus vitae. In hac
-habitasse platea dictumst. Morbi fringilla mattis odio, et mattis tellus
-accumsan vitae.
-
-1. Amamus Unicode 碁
-2. Interdum nex magna.
-
-Vivamus eget mauris sit amet nulla laoreet lobortis. Nulla in diam elementum
-risus convallis commodo. Cras vehicula varius dui vitae facilisis. Proin
-elementum libero eget leo aliquet quis euismod orci vestibulum. Duis rhoncus
-lorem consequat tellus vestibulum aliquam. Quisque orci orci, malesuada porta
-blandit et, interdum nec magna.

contact.markdown

@@ -1,6 +0,0 @@
----
-title: Contact
----
-
-I live in a small hut in the mountains of Kumano Kodō on Kii Hantō and would not
-like to be contacted.

css/default.css

@@ -1,141 +1,374 @@
-html {
-  font-size: 62.5%;
+@media (max-width: 455.98px) {
+  html {
+    font-size: 11px;
+  }
+}
+
+@media (min-width: 456px) and (max-width: 575.98px) {
+  html {
+    font-size: 12px;
+  }
+}
+
+@media (min-width: 576px) and (max-width: 767.98px) {
+  html {
+    font-size: 14px;
+  }
+}
+
+@media (min-width: 768px) and (max-width: 991.98px) {
+  html {
+    font-size: 16px;
+  }
+}
+
+@media (min-width: 992px) and (max-width: 1199.98px) {
+  html {
+    font-size: 18px;
+  }
+}
+
+@media (min-width: 1200px) {
+  html {
+    font-size: 20px;
+  }
 }
 
 body {
-  font-size: 1.6rem;
-  color: #000;
+  font-size: 1rem;
+  line-height: 1.5rem;
+  margin: 0;
+  font-family: "Fira Code", "Roboto Mono", "Menlo", "Monaco", "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Courier New", monospace, serif;
+  font-feature-settings: "calt" 1;
+  /* Enable ligatures for IE 10+, Edge */
+  text-rendering: optimizeLegibility;
+  /* Force ligatures for Webkit, Blink, Gecko */
+  min-width: 300px;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  padding: 0 16px;
+  background: white;
 }
 
-header {
-  border-bottom: 0.2rem solid #000;
+a {
+  word-break: break-all;
 }
 
-nav {
-  text-align: right;
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  line-height: 1.3em;
+  font-weight: 500;
 }
 
-nav a {
-  font-size: 1.8rem;
-  font-weight: bold;
+fieldset {
+  border: none;
+  padding: 0;
+  margin: 0;
+}
+
+pre {
+  padding: 2rem;
+  margin: 1.75rem 0;
+  background-color: black;
+  border: 1px solid #ccc;
+  overflow: auto;
+}
+
+code[class*="language-"],
+pre[class*="language-"],
+pre code {
+  font-weight: 100;
+  text-shadow: none;
+  margin: 1.75rem 0;
+}
+
+p {
+  color: rgba(0, 0, 0, 0.8);
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+strong {
   color: black;
-  text-decoration: none;
-  text-transform: uppercase;
 }
 
 footer {
-  margin-top: 3rem;
-  padding: 1.2rem 0;
-  border-top: 0.2rem solid #000;
-  font-size: 1.2rem;
-  color: #555;
+  color: rgba(0, 0, 0, 0.6);
 }
 
-h1 {
-  font-size: 2.4rem;
+a {
+  cursor: pointer;
+  color: blue;
+  text-decoration: none;
 }
 
-h2 {
-  font-size: 2rem;
+a:visited {
+  color: purple;
+}
+
+a:hover {
+  background-color: blue;
+  color: white;
+}
+
+a:hover:visited {
+  background-color: purple;
+}
+
+.hack,
+.hack blockquote,
+.hack code,
+.hack em,
+.hack h1,
+.hack h2,
+.hack h3,
+.hack h4,
+.hack h5,
+.hack h6,
+.hack strong {
+  font-style: normal;
+}
+
+.hack blockquote,
+.hack code,
+.hack em,
+.hack strong {
+  line-height: 20px;
 }
 
-article .header {
-  font-size: 1.4rem;
+.hack blockquote,
+.hack code,
+.hack footer,
+.hack h1,
+.hack h2,
+.hack h3,
+.hack h4,
+.hack h5,
+.hack h6,
+.hack header,
+.hack li,
+.hack ol,
+.hack p,
+.hack section,
+.hack ul {
+  float: none;
+  margin: 0;
+  padding: 0;
+}
+
+.hack blockquote,
+.hack h1,
+.hack ol,
+.hack p,
+.hack ul {
+  margin-top: 20px;
+  margin-bottom: 20px;
+}
+
+.hack h1,
+.hack h2,
+.hack h3,
+.hack h4,
+.hack h5,
+.hack h6 {
+  position: relative;
+  margin-bottom: 1.75rem;
+}
+
+.hack li {
+  position: relative;
+  display: block;
+  padding-left: 20px;
+}
+
+.hack li:after {
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+
+.hack ul > li:after {
+  content: "-";
+}
+
+.hack ol {
+  counter-reset: a;
+	list-style-type:decimal;
+	list-style-position:outside;
+}
+
+.hack ol > li:after {
+  content: counter(a) ".";
+  counter-increment: a;
+
+	padding:0 0 0 0px;
+  /* Add some space between numbering and content. */
+	margin:0 0 0 -0.3em;
+}
+
+.hack ol li:nth-child(n + 10):after {
+  left: -7px;
+}
+
+.hack em {
   font-style: italic;
-  color: #555;
 }
 
-.logo a {
-  font-weight: bold;
-  color: #000;
-  text-decoration: none;
+.hack pre code:after,
+.hack pre code:before {
+  content: "";
 }
 
-@media (max-width: 319px) {
-  body {
-    width: 90%;
-    margin: 0;
-    padding: 0 5%;
-  }
-  header {
-    margin: 4.2rem 0;
-  }
-  nav {
-    margin: 0 auto 3rem;
-    text-align: center;
-  }
-  footer {
-    text-align: center;
-  }
-  .logo {
-    text-align: center;
-    margin: 1rem auto 3rem;
-  }
-  .logo a {
-    font-size: 2.4rem;
-  }
-  nav a {
+.hack code {
+  font-weight: 700;
+}
+
+.hack code:after,
+.hack code:before {
+  content: "`";
+  display: inline;
+}
+
+@-moz-document url-prefix() {
+  .hack h1 {
     display: block;
-    line-height: 1.6;
   }
 }
 
-@media (min-width: 320px) {
-  body {
-    width: 90%;
-    margin: 0;
-    padding: 0 5%;
-  }
-  header {
-    margin: 4.2rem 0;
-  }
-  nav {
-    margin: 0 auto 3rem;
-    text-align: center;
-  }
-  footer {
-    text-align: center;
-  }
-  .logo {
-    text-align: center;
-    margin: 1rem auto 3rem;
-  }
-  .logo a {
-    font-size: 2.4rem;
-  }
-  nav a {
-    display: inline;
-    margin: 0 0.6rem;
-  }
+.hack-ones ol > li:after {
+  content: "1.";
 }
 
-@media (min-width: 640px) {
-  body {
-    width: 60rem;
-    margin: 0 auto;
-    padding: 0;
-  }
-  header {
-    margin: 0 0 3rem;
-    padding: 1.2rem 0;
-  }
-  nav {
-    margin: 0;
-    text-align: right;
-  }
-  nav a {
-    margin: 0 0 0 1.2rem;
-    display: inline;
-  }
-  footer {
-    text-align: right;
-  }
-  .logo {
-    margin: 0;
-    text-align: left;
-  }
-  .logo a {
-    float: left;
-    font-size: 1.8rem;
-  }
+p {
+  margin: 0 0 1.75rem;
+}
+
+.container {
+  width: 100%;
+  flex: 1;
+}
+
+.inner {
+  padding: 1rem;
+}
+
+.inner2x {
+  padding: 2rem;
+}
+
+.pull-left {
+  float: left;
+}
+
+.pull-right {
+  float: right;
+}
+
+.hack h1 {
+  font-size: 3rem;
+}
+
+.hack h2 {
+  font-size: 2rem;
+  padding: 32px 0 0;
+}
+
+.hack h3 {
+  font-size: 1.5rem;
+}
+
+b {
+  font-weight: bold;
+}
+
+u {
+  text-decoration: underline;
+}
+
+#T, #Y, #P, #E, #bropen, #brclose {
+  background: black;
+  text-decoration: underline;
+}
+
+#T:hover, #Y:hover, #P:hover, #E:hover, #brclose:hover, #bropen:hover {
+  color: white;
+}
+
+#T {
+  color: hsl(0, 80%, 60%);
+}
+
+#T:hover {
+  background: hsl(0, 80%, 60%);
+}
+
+#Y {
+  color: hsl(60, 80%, 60%);
+}
+
+#Y:hover {
+  background: hsl(60, 80%, 60%);
+}
+
+#P {
+  color: hsl(120, 80%, 60%);
+}
+
+#P:hover {
+  background: hsl(120, 80%, 60%);
+}
+
+#E {
+  color: hsl(180, 80%, 60%);
+}
+
+#E:hover {
+  background: hsl(180, 80%, 60%);
+}
+
+#bropen {
+  color: hsl(240, 80%, 60%);
+}
+
+#bropen:hover {
+  background: hsl(240, 80%, 60%);
+}
+
+#brclose {
+  color: hsl(300, 80%, 60%);
+}
+
+#brclose:hover {
+  background: hsl(300, 80%, 60%);
+}
+
+#hidden {
+  color: white;
+  white-space: nowrap;
+}
+
+h1 {
+  overflow: hidden;
+}
+
+#T u, #Y u, #P u, #E u, #brclose u, #bropen u {
+  color: white;
+  text-decoration: none;
+}
+
+#T u:hover, #Y u:hover, #P u:hover, #E u:hover, #brclose u:hover, #bropen u:hover {
+  color: black;
+}
+
+hr {
+  border: 2px solid black;
 }

index.html

@@ -1,43 +1,16 @@
----
-title: Home
----
-
-<h2>Welcome</h2>
-
-<img src="/images/haskell-logo.png" style="float: right; margin: 10px;" />
-
-<p>Welcome to my blog!</p>
-
-<p>I've reproduced a list of recent posts here for your reading pleasure:</p>
-
-<h2>Posts</h2>
-$partial("templates/post-list.html")$
-
-<p>…or you can find more in the <a href="/archive.html">archives</a>.</p>
-
-<!--
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="utf-8" />
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <title>newtype</title>
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link rel="stylesheet" type="text/css" media="screen" href="static/css/main.css" />
-</head>
-<body class="hack">
-  <div class="main container">
-    <h1>
-      new<b id="T"><u>t</u></b
-        ><b id="Y"><u>y</u></b
-        ><b id="P"><u>p</u></b
-        ><b id="E"><u>e</u></b
-        ><b id="bropen" ><u>(</u></b
-        ><b id="brclose"><u>)</u></b><span id="hidden"> { newtype | newtype& }; newtype</span>
-    </h1>
-    <p>Nicolas Hovart • Ryan Lahfa • Yvan Sraka </p>
-    <p><a href="mailto:contact@newtype.fr">contact@newtype.fr</a></p>
-  </div>
-</body>
-</html>
--->
+<p>
+  <a href="https://github.com/NicolasHov">Nicolas Hovart</a>
+• <a href="https://github.com/RaitoBezarius">Ryan Lahfa</a>
+• <a href="https://github.com/yvan-sraka">Yvan Sraka</a>
+• <strike><a href="https://github.com/naominitel">Naomi Nitel</strike></a>
+• <strike><a href="https://github.com/darnuria">Axel Viala</strike></a>
+</p>
+<p>
+  What we do:
+  <ul>
+    <li>Rust | WebAssembly</li>
+    <li>Nix | NixOS | NixOps</li>
+    <li>React.js | React Native</li>
+  </ul>
+</p>
+<p>-> <a href="mailto:contact@newtype.fr">contact@newtype.fr</a></p>

posts/2015-08-12-spqr.markdown

@@ -1,59 +0,0 @@
----
-title: S.P.Q.R.
----
-
-Mauris in lorem nisl. Maecenas tempus facilisis ante, eget viverra nisl
-tincidunt et. Donec turpis lectus, mattis ac malesuada a, accumsan eu libero.
-Morbi condimentum, tortor et tincidunt ullamcorper, sem quam pretium nulla, id
-convallis lectus libero nec turpis. Proin dapibus nisi id est sodales nec
-ultrices tortor pellentesque. Vivamus vel nisi ac lacus sollicitudin vulputate
-ac ut ligula. Nullam feugiat risus eget eros gravida in molestie sapien euismod.
-Nunc sed hendrerit orci. Nulla mollis consequat lorem ac blandit. Ut et turpis
-mauris. Nulla est odio, posuere id ullamcorper sit amet, tincidunt vel justo.
-Curabitur placerat tincidunt varius. Nulla vulputate, ipsum eu consectetur
-mollis, dui nibh aliquam neque, at ultricies leo ligula et arcu. Proin et mi
-eget tellus sodales lobortis. Sed tempor, urna vel pulvinar faucibus, lectus
-urna vehicula ante, at facilisis dolor odio at lorem. Morbi vehicula euismod
-urna, et imperdiet urna ornare vitae.
-
-Sed tincidunt sollicitudin ultrices. In hac habitasse platea dictumst. Morbi
-ligula lectus, egestas at ultricies nec, fringilla et tellus. Duis urna lorem,
-bibendum a ornare sed, euismod sed nunc. Aliquam tempor massa at velit fringilla
-fringilla. Praesent sit amet tempor felis. Maecenas id felis ac velit aliquam
-tempor a sit amet orci. Nunc placerat nulla pellentesque sem commodo cursus.
-Praesent quis sapien orci, quis ultricies augue. Nam vestibulum sem non augue
-semper tincidunt pellentesque ipsum volutpat. Duis congue, nunc a aliquam
-luctus, quam ante convallis nisi, ac pellentesque lacus orci vel turpis. Cum
-sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus
-mus. Suspendisse hendrerit nisl eu felis sagittis faucibus. Nunc eu congue
-lorem. Quisque non nibh nisi, et ultrices massa. Sed vitae erat vitae nulla
-pellentesque fermentum.
-
-Ut diam nunc, consectetur ut ultrices eu, iaculis sed felis. Sed lacinia, odio
-et accumsan luctus, arcu ipsum accumsan erat, sit amet malesuada libero lacus et
-velit. Donec accumsan tristique tristique. Proin a metus magna, vitae mattis
-nisl. Integer a libero ipsum. Mauris faucibus eleifend metus id sodales. Morbi
-ornare, nibh nec facilisis imperdiet, turpis sem commodo lorem, id commodo
-mauris metus vitae justo. Etiam at pellentesque tortor. Proin mollis accumsan
-ligula, nec tempus augue auctor quis. Nulla lacinia, mi quis lobortis auctor,
-nisi diam posuere dui, pulvinar feugiat dui libero eget quam. Fusce eu risus
-nunc, a consectetur orci. Class aptent taciti sociosqu ad litora torquent per
-conubia nostra, per inceptos himenaeos. Maecenas venenatis aliquet orci, a
-ultricies sem facilisis eu. Donec dolor purus, porta condimentum convallis nec,
-dignissim nec libero.
-
-Etiam rutrum ultricies dui, et interdum metus elementum et. Nulla sapien nunc,
-interdum tristique porttitor in, laoreet vitae mi. Ut vehicula auctor mauris sit
-amet bibendum. Phasellus adipiscing mattis libero, eget adipiscing erat
-dignissim at. Vivamus convallis malesuada metus nec cursus. Ut cursus, lorem
-eleifend sollicitudin condimentum, felis tortor sodales augue, ac tempus lacus
-ipsum vitae quam. Vestibulum vitae lacus non tortor vehicula iaculis faucibus
-quis massa.
-
-Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus
-mus. Duis malesuada neque nec ante porttitor accumsan. Suspendisse potenti.
-Aliquam in lacus magna, imperdiet laoreet lectus. Praesent id diam nec ante
-commodo rhoncus nec vel augue. Pellentesque tortor massa, dignissim ut sagittis
-sed, hendrerit vitae nunc. Nam gravida, urna vitae hendrerit rutrum, felis augue
-vulputate tortor, ut varius velit libero nec lectus. In adipiscing massa in est
-scelerisque ullamcorper. Vivamus in nisi metus.

posts/2015-10-07-rosa-rosa-rosam.markdown

@@ -1,46 +0,0 @@
----
-title: Rosa Rosa Rosam
-author: Ovidius
----
-
-Suspendisse pharetra ullamcorper sem et auctor. Suspendisse vitae tellus eu
-turpis dignissim gravida ut ut tortor. Cum sociis natoque penatibus et magnis
-dis parturient montes, nascetur ridiculus mus. Morbi aliquam sapien quis nisl
-sodales non aliquet nisl iaculis. Curabitur fermentum orci vel sapien
-pellentesque id condimentum metus vehicula. Curabitur turpis purus, scelerisque
-at interdum quis, placerat sit amet tortor. Aliquam erat volutpat.
-
-Integer posuere felis non arcu suscipit ullamcorper. Nam tempus risus venenatis
-orci sagittis eu aliquam ante tincidunt. Aenean vehicula ipsum id sapien
-tincidunt commodo. Aliquam erat volutpat. Curabitur vehicula libero ac turpis
-cursus consectetur. Praesent posuere egestas purus et dapibus. Mauris egestas,
-lectus vitae scelerisque ultricies, metus lorem tempor nisi, sed vehicula tortor
-mauris nec urna. Quisque urna tellus, facilisis at mollis eget, adipiscing in
-nisl. Proin quam arcu, euismod et imperdiet sed, ultricies sed orci.
-
-Nulla malesuada sem eget lectus scelerisque nec rhoncus metus interdum. In dui
-felis, rhoncus id scelerisque eget, vulputate id sem. Nulla facilisi. Vestibulum
-eleifend, metus dignissim lacinia ornare, magna nulla vehicula nisi, sed
-molestie mauris ipsum vel turpis. Class aptent taciti sociosqu ad litora
-torquent per conubia nostra, per inceptos himenaeos. Nulla urna leo, vehicula
-eget dignissim a, hendrerit ut risus. Fusce ultricies elementum placerat. Nam at
-dolor sed nisi mollis sollicitudin vitae at urna. Vestibulum iaculis adipiscing
-eros et mollis.
-
-Phasellus ultricies elit eu risus sagittis eu dictum ante ultrices. Nulla
-congue, augue ac placerat tempor, orci mi luctus nisi, at varius ipsum sem sed
-eros. Vivamus eget velit eget felis posuere ornare. In sed metus non est iaculis
-facilisis dapibus sit amet enim. Aliquam viverra tortor eget neque volutpat in
-auctor urna rutrum. Aliquam ligula augue, congue sit amet rutrum in, semper vel
-nulla. Sed tempus porttitor faucibus. Donec cursus sodales nulla, quis lacinia
-mi vehicula vel. Sed nec purus orci. Nam leo sapien, rutrum a ultrices quis,
-placerat vel ligula. Donec massa quam, pellentesque et molestie nec, hendrerit
-id mauris. In hac habitasse platea dictumst. Cras quis quam sem. Curabitur in
-arcu diam, in interdum mauris.
-
-Proin lorem sapien, iaculis et faucibus nec, dictum sed nunc. Pellentesque in
-purus justo. Vestibulum facilisis rutrum nisi, a egestas nunc suscipit sed. Ut
-quis tortor a arcu bibendum placerat non sed ante. Praesent orci sem, posuere
-sit amet cursus molestie, volutpat ut purus. Curabitur aliquam, purus in
-pharetra viverra, lorem leo aliquam tellus, vel consequat felis neque et mauris.
-Aliquam erat volutpat.

posts/2015-11-28-carpe-diem.markdown

@@ -1,50 +0,0 @@
----
-title: Carpe Diem
----
-
-Fusce tortor quam, egestas in posuere quis, porttitor vel turpis. Donec
-vulputate porttitor augue at rhoncus. Proin iaculis consectetur sagittis.
-Curabitur venenatis turpis sit amet purus tristique nec posuere risus laoreet.
-Nullam nisi sem, dapibus id semper id, egestas vel arcu. Morbi porttitor ipsum
-placerat erat consequat sed consequat purus feugiat. Donec auctor elit ut risus
-mattis facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
-
-Proin vulputate sapien facilisis leo ornare pulvinar. Fusce tempus massa a risus
-semper iaculis. Suspendisse sollicitudin posuere nunc, sit amet rutrum leo
-facilisis mattis. Sed ornare auctor dui, vitae rutrum neque auctor sit amet.
-Proin ac dui magna. Mauris vehicula interdum augue, nec ultrices libero egestas
-quis. Nunc convallis euismod ipsum, id sollicitudin orci consequat ac. Fusce
-bibendum congue libero, in rutrum nulla congue non. Cras sit amet risus tortor,
-eu pellentesque dui. Phasellus euismod enim non nibh sodales quis consectetur
-lorem laoreet. Vivamus a egestas quam. Curabitur in tortor augue, vitae varius
-tellus. Integer varius, elit ac gravida suscipit, eros erat pellentesque nisi,
-et tristique augue odio id nulla. Aliquam sit amet nunc vel tellus hendrerit
-tempus ac vel sem.
-
-Aenean tincidunt sollicitudin sapien ut porttitor. Curabitur molestie adipiscing
-lorem vel scelerisque. Donec vitae interdum est. Proin rutrum vulputate
-faucibus. Suspendisse sit amet felis odio, non volutpat ante. Sed eu lectus
-quam. Curabitur tristique rhoncus est, vel commodo tortor suscipit semper.
-Maecenas feugiat vestibulum nisi id facilisis. Nulla non tincidunt libero.
-Praesent ultrices interdum commodo. Sed euismod nisl auctor leo ultrices rutrum.
-Aliquam nibh felis, congue molestie blandit at, bibendum at eros. Aenean
-tincidunt, tortor iaculis placerat sollicitudin, lorem justo tempor diam, et
-posuere sapien leo et magna. Quisque vel aliquam mauris.
-
-Proin varius tempus fermentum. Cum sociis natoque penatibus et magnis dis
-parturient montes, nascetur ridiculus mus. Sed tincidunt nunc id magna
-adipiscing non sollicitudin turpis tempor. Etiam vel elit ipsum, quis euismod
-velit. Quisque elementum magna vitae quam venenatis lacinia. Sed at arcu ipsum.
-Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos
-himenaeos. Donec ut lorem ac sapien cursus lacinia sit amet mollis dolor.
-Vivamus tempus odio nec magna faucibus sed hendrerit lorem tempor.
-
-Vestibulum eu nisi arcu. Curabitur nisi risus, fermentum ut lacinia ut, interdum
-nec magna. Nunc aliquet gravida massa, eu aliquam lorem faucibus at. Sed
-sollicitudin volutpat velit id tempor. In nibh justo, pharetra et pretium
-dignissim, tempus in turpis. Phasellus eget lobortis nisl. Phasellus sed
-fermentum diam. Nam tempus pharetra odio, quis congue eros imperdiet eu. Aliquam
-dui eros, hendrerit et vulputate vel, porta eu eros. Nullam nisi dui, commodo
-eget pharetra ut, ornare sit amet nunc. Fusce vel neque urna. Maecenas nulla
-ante, egestas at consequat quis, fermentum a enim. Aliquam id tristique urna.
-Integer augue justo, scelerisque et consectetur id, rhoncus eget enim.

posts/2015-12-07-tu-quoque.markdown

@@ -1,58 +0,0 @@
----
-title: Tu Quoque
-author: Julius
----
-
-Vestibulum leo turpis, dignissim quis ultrices sit amet, iaculis ac ligula.
-Pellentesque tristique, velit eget scelerisque scelerisque, est dolor ultrices
-arcu, quis ullamcorper justo arcu luctus mauris. Integer congue molestie nisi id
-posuere. Fusce pellentesque gravida tempus. Integer viverra tortor nec eros
-mollis quis convallis sem laoreet. Nulla id libero ac erat varius laoreet. Proin
-sed est est. Curabitur lacinia fermentum lorem, elementum malesuada ipsum
-malesuada ut. Donec suscipit elit id leo vehicula mattis non sed leo. Morbi
-varius eleifend varius. Nulla vestibulum, neque vitae aliquam eleifend, nisi
-tellus placerat nunc, quis suscipit elit turpis eu tortor. Etiam euismod
-convallis lectus quis venenatis. Phasellus laoreet magna in nibh cursus eu
-egestas nulla convallis. Aliquam vel ullamcorper risus. Fusce dictum, massa id
-consequat viverra, nulla ante tristique est, a faucibus nisi enim nec dui. Donec
-metus ligula, condimentum at porttitor eget, lobortis at quam.
-
-Aenean vel libero in magna ultricies congue in a odio. Donec faucibus rutrum
-ornare. Fusce dictum eleifend fermentum. Vestibulum vel nibh a metus porttitor
-rhoncus. Pellentesque id quam neque, eget molestie arcu. Integer in elit vel
-neque viverra ultricies in eget massa. Nam ut convallis est. Pellentesque eros
-eros, sodales non vehicula et, tincidunt ut odio. Cras suscipit ultrices metus
-sit amet molestie. Fusce enim leo, vehicula sed sodales quis, adipiscing at
-ipsum.
-
-Nunc tempor dignissim enim, sed tincidunt eros bibendum quis. Curabitur et dolor
-augue, id laoreet mi. Nulla cursus felis id dui vehicula vitae ornare lorem
-blandit. Cras eget dui nec odio volutpat pharetra. Fusce hendrerit justo justo,
-vel imperdiet enim. Vivamus elit risus, interdum ultrices accumsan eleifend,
-vestibulum vitae sapien. Integer bibendum ullamcorper tristique. Nulla quis odio
-lectus, quis eleifend augue. Integer a ligula mauris. Aenean et tempus tortor.
-Quisque at tortor mi. Vivamus accumsan feugiat est a blandit. Sed vitae enim ut
-dolor semper sodales. Duis tristique, ante et placerat elementum, nulla tellus
-pellentesque sapien, quis posuere velit mi eget nulla. Sed vestibulum nunc non
-est porttitor ut rutrum nibh semper. Pellentesque habitant morbi tristique
-senectus et netus et malesuada fames ac turpis egestas.
-
-Nulla adipiscing ultricies lobortis. Vivamus iaculis nisl vitae tellus laoreet
-vitae aliquet lacus mollis. Phasellus ut lacus urna, sed sagittis ante. Etiam
-consectetur pretium nisl sed dignissim. Pellentesque convallis, nisl eget
-commodo mollis, sem magna consequat arcu, sed pretium ipsum arcu sit amet neque.
-Aliquam erat volutpat. Morbi sed mi sed urna vestibulum placerat vitae vel
-metus. Fusce ac ante at justo pharetra vehicula. Vivamus vel tortor eget augue
-aliquet aliquet at vel odio. Nunc venenatis, magna quis facilisis fringilla,
-augue tellus varius neque, in vulputate est eros ut tortor. Duis lorem neque,
-aliquam congue posuere id, condimentum non dui. Phasellus ut dui massa,
-porttitor suscipit augue. Praesent quis tellus quam, vel volutpat metus. Vivamus
-enim est, aliquam in imperdiet et, sagittis eu ligula. Vestibulum hendrerit
-placerat orci et aliquet. Cras pharetra, dolor placerat lobortis tempor, metus
-odio cursus ligula, et posuere lacus ligula quis dui.
-
-Donec a lectus eu nibh malesuada aliquam. Proin at metus quam, et tincidunt leo.
-Quisque lacus justo, scelerisque sodales pulvinar sed, dignissim ut sapien.
-Vivamus diam felis, adipiscing sollicitudin ultricies id, accumsan ac felis. In
-eu posuere ligula. Suspendisse potenti. Donec porttitor dictum dui id vehicula.
-Integer ante velit, congue id dictum et, adipiscing a tortor.

site.hs

@@ -7,60 +7,16 @@ import           Hakyll
 --------------------------------------------------------------------------------
 main :: IO ()
 main = hakyll $ do
-    match "images/*" $ do
-        route   idRoute
-        compile copyFileCompiler
-
     match "css/*" $ do
         route   idRoute
         compile compressCssCompiler
 
-    match (fromList ["about.rst", "contact.markdown"]) $ do
-        route   $ setExtension "html"
-        compile $ pandocCompiler
-            >>= loadAndApplyTemplate "templates/default.html" defaultContext
-            >>= relativizeUrls
-
-    match "posts/*" $ do
-        route $ setExtension "html"
-        compile $ pandocCompiler
-            >>= loadAndApplyTemplate "templates/post.html"    postCtx
-            >>= loadAndApplyTemplate "templates/default.html" postCtx
-            >>= relativizeUrls
-
-    create ["archive.html"] $ do
-        route idRoute
-        compile $ do
-            posts <- recentFirst =<< loadAll "posts/*"
-            let archiveCtx =
-                    listField "posts" postCtx (return posts) `mappend`
-                    constField "title" "Archives"            `mappend`
-                    defaultContext
-
-            makeItem ""
-                >>= loadAndApplyTemplate "templates/archive.html" archiveCtx
-                >>= loadAndApplyTemplate "templates/default.html" archiveCtx
-                >>= relativizeUrls
-
-
     match "index.html" $ do
         route idRoute
         compile $ do
-            posts <- recentFirst =<< loadAll "posts/*"
-            let indexCtx =
-                    listField "posts" postCtx (return posts) `mappend`
-                    defaultContext
-
             getResourceBody
                 >>= applyAsTemplate indexCtx
                 >>= loadAndApplyTemplate "templates/default.html" indexCtx
                 >>= relativizeUrls
 
     match "templates/*" $ compile templateBodyCompiler
-
-
---------------------------------------------------------------------------------
-postCtx :: Context String
-postCtx =
-    dateField "date" "%B %e, %Y" `mappend`
-    defaultContext

static/css/main.css

@@ -1,420 +0,0 @@
-@font-face {
-  font-family: "Fira Code";
-  src: url("../fonts/FiraCode/eot/FiraCode-Light.eot");
-  src: url("../fonts/FiraCode/eot/FiraCode-Light.eot") format("embedded-opentype"),
-    url("../fonts/FiraCode/woff2/FiraCode-Light.woff2") format("woff2"),
-    url("../fonts/FiraCode/woff/FiraCode-Light.woff") format("woff"),
-    url("../fonts/FiraCode/ttf/FiraCode-Light.ttf") format("truetype");
-  font-weight: 300;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: "Fira Code";
-  src: url("../fonts/FiraCode/eot/FiraCode-Regular.eot");
-  src: url("../fonts/FiraCode/eot/FiraCode-Regular.eot")
-      format("embedded-opentype"),
-    url("../fonts/FiraCode/woff2/FiraCode-Regular.woff2") format("woff2"),
-    url("../fonts/FiraCode/woff/FiraCode-Regular.woff") format("woff"),
-    url("../fonts/FiraCode/ttf/FiraCode-Regular.ttf") format("truetype");
-  font-weight: 400;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: "Fira Code";
-  src: url("../fonts/FiraCode/eot/FiraCode-Medium.eot");
-  src: url("../fonts/FiraCode/eot/FiraCode-Medium.eot")
-      format("embedded-opentype"),
-    url("../fonts/FiraCode/woff2/FiraCode-Medium.woff2") format("woff2"),
-    url("../fonts/FiraCode/woff/FiraCode-Medium.woff") format("woff"),
-    url("../fonts/FiraCode/ttf/FiraCode-Medium.ttf") format("truetype");
-  font-weight: 500;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: "Fira Code";
-  src: url("../fonts/FiraCode/eot/FiraCode-Bold.eot");
-  src: url("../fonts/FiraCode/eot/FiraCode-Bold.eot") format("embedded-opentype"),
-    url("../fonts/FiraCode/woff2/FiraCode-Bold.woff2") format("woff2"),
-    url("../fonts/FiraCode/woff/FiraCode-Bold.woff") format("woff"),
-    url("../fonts/FiraCode/ttf/FiraCode-Bold.ttf") format("truetype");
-  font-weight: 700;
-  font-style: normal;
-}
-
-@media (max-width: 455.98px) {
-  html {
-    font-size: 11px;
-  }
-}
-
-@media (min-width: 456px) and (max-width: 575.98px) {
-  html {
-    font-size: 12px;
-  }
-}
-
-@media (min-width: 576px) and (max-width: 767.98px) {
-  html {
-    font-size: 14px;
-  }
-}
-
-@media (min-width: 768px) and (max-width: 991.98px) {
-  html {
-    font-size: 16px;
-  }
-}
-
-@media (min-width: 992px) and (max-width: 1199.98px) {
-  html {
-    font-size: 18px;
-  }
-}
-
-@media (min-width: 1200px) {
-  html {
-    font-size: 20px;
-  }
-}
-
-body {
-  font-size: 1rem;
-  line-height: 1.5rem;
-  margin: 0;
-  font-family: "Fira Code", "Roboto Mono", "Menlo", "Monaco", "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Courier New", monospace, serif;
-  font-feature-settings: "calt" 1;
-  /* Enable ligatures for IE 10+, Edge */
-  text-rendering: optimizeLegibility;
-  /* Force ligatures for Webkit, Blink, Gecko */
-  min-width: 300px;
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-  padding: 0 16px;
-  background: white;
-}
-
-a {
-  word-break: break-all;
-}
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  line-height: 1.3em;
-  font-weight: 500;
-}
-
-fieldset {
-  border: none;
-  padding: 0;
-  margin: 0;
-}
-
-pre {
-  padding: 2rem;
-  margin: 1.75rem 0;
-  background-color: black;
-  border: 1px solid #ccc;
-  overflow: auto;
-}
-
-code[class*="language-"],
-pre[class*="language-"],
-pre code {
-  font-weight: 100;
-  text-shadow: none;
-  margin: 1.75rem 0;
-}
-
-p {
-  color: rgba(0, 0, 0, 0.8);
-}
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-strong {
-  color: black;
-}
-
-footer {
-  color: rgba(0, 0, 0, 0.6);
-}
-
-a {
-  cursor: pointer;
-  color: blue;
-  text-decoration: none;
-}
-
-a:visited {
-  color: purple;
-}
-
-a:hover {
-  background-color: blue;
-  color: white;
-}
-
-a:hover:visited {
-  background-color: purple;
-}
-
-.hack,
-.hack blockquote,
-.hack code,
-.hack em,
-.hack h1,
-.hack h2,
-.hack h3,
-.hack h4,
-.hack h5,
-.hack h6,
-.hack strong {
-  font-style: normal;
-}
-
-.hack blockquote,
-.hack code,
-.hack em,
-.hack strong {
-  line-height: 20px;
-}
-
-.hack blockquote,
-.hack code,
-.hack footer,
-.hack h1,
-.hack h2,
-.hack h3,
-.hack h4,
-.hack h5,
-.hack h6,
-.hack header,
-.hack li,
-.hack ol,
-.hack p,
-.hack section,
-.hack ul {
-  float: none;
-  margin: 0;
-  padding: 0;
-}
-
-.hack blockquote,
-.hack h1,
-.hack ol,
-.hack p,
-.hack ul {
-  margin-top: 20px;
-  margin-bottom: 20px;
-}
-
-.hack h1,
-.hack h2,
-.hack h3,
-.hack h4,
-.hack h5,
-.hack h6 {
-  position: relative;
-  margin-bottom: 1.75rem;
-}
-
-.hack li {
-  position: relative;
-  display: block;
-  padding-left: 20px;
-}
-
-.hack li:after {
-  position: absolute;
-  top: 0;
-  left: 0;
-}
-
-.hack ul > li:after {
-  content: "-";
-}
-
-.hack ol {
-  counter-reset: a;
-	list-style-type:decimal;
-	list-style-position:outside;
-}
-
-.hack ol > li:after {
-  content: counter(a) ".";
-  counter-increment: a;
-
-	padding:0 0 0 0px;
-  /* Add some space between numbering and content. */
-	margin:0 0 0 -0.3em;
-}
-
-.hack ol li:nth-child(n + 10):after {
-  left: -7px;
-}
-
-.hack em {
-  font-style: italic;
-}
-
-.hack pre code:after,
-.hack pre code:before {
-  content: "";
-}
-
-.hack code {
-  font-weight: 700;
-}
-
-.hack code:after,
-.hack code:before {
-  content: "`";
-  display: inline;
-}
-
-@-moz-document url-prefix() {
-  .hack h1 {
-    display: block;
-  }
-}
-
-.hack-ones ol > li:after {
-  content: "1.";
-}
-
-p {
-  margin: 0 0 1.75rem;
-}
-
-.container {
-  width: 100%;
-  flex: 1;
-}
-
-.inner {
-  padding: 1rem;
-}
-
-.inner2x {
-  padding: 2rem;
-}
-
-.pull-left {
-  float: left;
-}
-
-.pull-right {
-  float: right;
-}
-
-.hack h1 {
-  font-size: 3rem;
-}
-
-.hack h2 {
-  font-size: 2rem;
-  padding: 32px 0 0;
-}
-
-.hack h3 {
-  font-size: 1.5rem;
-}
-
-b {
-  font-weight: bold;
-}
-
-u {
-  text-decoration: underline;
-}
-
-#T, #Y, #P, #E, #bropen, #brclose {
-  background: black;
-  text-decoration: underline;
-}
-
-#T:hover, #Y:hover, #P:hover, #E:hover, #brclose:hover, #bropen:hover {
-  color: white;
-}
-
-#T {
-  color: hsl(0, 80%, 60%);
-}
-
-#T:hover {
-  background: hsl(0, 80%, 60%);
-}
-
-#Y {
-  color: hsl(60, 80%, 60%);
-}
-
-#Y:hover {
-  background: hsl(60, 80%, 60%);
-}
-
-#P {
-  color: hsl(120, 80%, 60%);
-}
-
-#P:hover {
-  background: hsl(120, 80%, 60%);
-}
-
-#E {
-  color: hsl(180, 80%, 60%);
-}
-
-#E:hover {
-  background: hsl(180, 80%, 60%);
-}
-
-#bropen {
-  color: hsl(240, 80%, 60%);
-}
-
-#bropen:hover {
-  background: hsl(240, 80%, 60%);
-}
-
-#brclose {
-  color: hsl(300, 80%, 60%);
-}
-
-#brclose:hover {
-  background: hsl(300, 80%, 60%);
-}
-
-#hidden {
-  color: white;
-  white-space: nowrap;
-}
-
-h1 {
-  overflow: hidden;
-}
-
-#T u, #Y u, #P u, #E u, #brclose u, #bropen u {
-  color: white;
-  text-decoration: none;
-}
-
-#T u:hover, #Y u:hover, #P u:hover, #E u:hover, #brclose u:hover, #bropen u:hover {
-  color: black;
-}
-
-hr {
-  border: 2px solid black;
-}

templates/archive.html

@@ -1,2 +0,0 @@
-Here you can find all my previous posts:
-$partial("templates/post-list.html")$

templates/default.html

@@ -5,29 +5,20 @@
         <meta http-equiv="x-ua-compatible" content="ie=edge">
         <meta name="viewport" content="width=device-width, initial-scale=1">
         <title>My Hakyll Blog - $title$</title>
+        <link href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600;700&display=swap" rel="stylesheet">
         <link rel="stylesheet" href="/css/default.css" />
     </head>
-    <body>
-        <header>
-            <div class="logo">
-                <a href="/">My Hakyll Blog</a>
-            </div>
-            <nav>
-                <a href="/">Home</a>
-                <a href="/about.html">About</a>
-                <a href="/contact.html">Contact</a>
-                <a href="/archive.html">Archive</a>
-            </nav>
-        </header>
-
-        <main role="main">
-            <h1>$title$</h1>
-            $body$
-        </main>
-
-        <footer>
-            Site proudly generated by
-            <a href="http://jaspervdj.be/hakyll">Hakyll</a>
-        </footer>
+    <body class="hack">
+      <div class="main container">
+        <h1>
+          new<b id="T"><u>t</u></b
+            ><b id="Y"><u>y</u></b
+            ><b id="P"><u>p</u></b
+            ><b id="E"><u>e</u></b
+            ><b id="bropen" ><u>(</u></b
+            ><b id="brclose"><u>)</u></b><span id="hidden"> { newtype | newtype& }; newtype</span>
+        </h1>
+        $body$
+      </div>
     </body>
 </html>

templates/post-list.html

@@ -1,7 +0,0 @@
-<ul>
-    $for(posts)$
-        <li>
-            <a href="$url$">$title$</a> - $date$
-        </li>
-    $endfor$
-</ul>

templates/post.html

@@ -1,11 +0,0 @@
-<article>
-    <section class="header">
-        Posted on $date$
-        $if(author)$
-            by $author$
-        $endif$
-    </section>
-    <section>
-        $body$
-    </section>
-</article>