The great Flakes refactor

src/css/article.css

@@ -1,44 +0,0 @@
-:root {
-  font-size: 62.5%;
-  box-sizing: border-box;
-  -ms-text-size-adjust: 100%;
-  -webkit-text-size-adjust: 100%;
-}
-*,
-*:before,
-*:after {
-  box-sizing: inherit;
-}
-html,
-body {
-  min-height: 100vh;
-}
-body {
-  font-kerning: normal;
-  -moz-font-feature-settings: "kern", "liga", "clig", "calt";
-  -ms-font-feature-settings: "kern", "liga", "clig", "calt";
-  -webkit-font-feature-settings: "kern", "liga", "clig", "calt";
-  font-feature-settings: "kern", "liga", "clig", "calt";
-  scroll-behavior: smooth;
-}
-article h1,
-article small,
-article p {
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-article h1 {
-  font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
-  font-size: 4.0rem;
-}
-article small,
-article p {
-  font-family: Tahoma, Arial, sans-serif;
-}
-article small {
-  font-size: 1.6rem;
-  font-style: italic;
-}
-article p {
-  font-size: 1.8rem;
-}

src/css/default.css

@@ -20,11 +20,35 @@ body {
   -webkit-font-feature-settings: "kern", "liga", "clig", "calt";
   font-feature-settings: "kern", "liga", "clig", "calt";
   scroll-behavior: smooth;
+  font-size: 2rem;
+}
+body,
+input,
+button {
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+h1,
+h2 {
+  font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
+}
+h1 {
+  font-size: 4.0rem;
+}
+h2 {
+  font-size: 2.6rem;
+}
+small,
+p {
+  font-family: Tahoma, Arial, sans-serif;
+}
+small {
+  font-size: 1.6rem;
+  font-style: italic;
+}
+p {
+  font-size: 1.8rem;
+}
+pre.sourceCode {
+  padding: 2rem 1.5rem;
 }
-.ffs { font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; }
-.ffss { font-family: Tahoma, Arial, sans-serif; }
-.fs { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
-.fs14 { font-size: 1.4rem; }
-.fs18 { font-size: 1.8rem; }
-.fs32 { font-size: 3.2rem; }
-.fs40 { font-size: 4.0rem; }

src/index.html

@@ -7,7 +7,7 @@ title: "Hello, world!"
 ---
 
 <header>
-  <h1 class="ffs fs fs40">Hello, world!</h1>
+  <h1>Hello, world!</h1>
   <img
     alt="A woman sitting on a bench amongst trees at the end of a boardwalk leading to a pond with mountains in the background"
     src="./images/robert-pearce-UwHN0jU_YqQ-unsplash-800w.jpg"
@@ -16,12 +16,12 @@ title: "Hello, world!"
 </header>
 <main>
   <section>
-    <h2 class="ffs fs fs32">Blog Posts</h2>
+    <h2>Blog Posts</h2>
     <ul>
       $for(posts)$
         <li>
-          <div><a href=".$url$" class="ffss fs fs18">$title$</a></div>
-          <small class="ffss fs fs14">$date$</small>
+          <div><a href=".$url$">$title$</a></div>
+          <small>$date$</small>
         </li>
       $endfor$
     </ul>

src/posts/2020-09-21-hello-world.md

@@ -5,7 +5,6 @@ desc: "I announce myself to the world"
 image: "./images/waiheke-stony-batter.jpg"
 keywords: "hello, announcement"
 lang: "en"
-stylesheet: "article"
 title: "Hello, world!"
 updated: "2020-09-22T12:00:00Z"
 ---
@@ -17,3 +16,11 @@ Hello, world! I am here!
   src="./images/waiheke-stony-batter.jpg"
   style="max-width:500px;"
 />
+
+Haskell, for example:
+
+```haskell
+toSlug :: T.Text -> T.Text
+toSlug =
+  T.intercalate (T.singleton '-') . T.words . T.toLower . clean
+```

src/posts/2020-09-22-hola-mundo.md

@@ -5,7 +5,6 @@ desc: "Me anuncio al mundo"
 image: "./images/waiheke-stony-batter.jpg"
 keywords: "hola, anuncio"
 lang: "es"
-stylesheet: "article"
 title: "¡Hola Mundo!"
 updated: "2020-09-23T12:00:00Z"
 ---
@@ -17,3 +16,11 @@ updated: "2020-09-23T12:00:00Z"
   src="./images/waiheke-stony-batter.jpg"
   style="max-width:500px;"
 />
+
+Haskell, por ejemplo:
+
+```haskell
+toSlug :: T.Text -> T.Text
+toSlug =
+  T.intercalate (T.singleton '-') . T.words . T.toLower . clean
+```

src/templates/default.html

@@ -40,9 +40,7 @@
     <link rel="shortcut icon" href="/favicon.ico">
     <link rel="canonical" href="$root$$url$">
     <link rel="stylesheet" href="./css/default.css" />
-    $if(stylesheet)$
-    <link rel="stylesheet" href="./css/$stylesheet$.css" />
-    $endif$
+    <link rel="stylesheet" href="./css/code.css" />
   </head>
   <body>
     $body$