rauhala.info/css/index.css

@@ -566,21 +566,11 @@ video {
   inset: 0px;
 }
 
-.mx-3 {
-  margin-left: 0.75rem;
-  margin-right: 0.75rem;
-}
-
 .mx-auto {
   margin-left: auto;
   margin-right: auto;
 }
 
-.my-2 {
-  margin-top: 0.5rem;
-  margin-bottom: 0.5rem;
-}
-
 .mb-10 {
   margin-bottom: 2.5rem;
 }
@@ -609,18 +599,6 @@ video {
   display: none;
 }
 
-.h-screen {
-  height: 100vh;
-}
-
-.w-1\/3 {
-  width: 33.333333%;
-}
-
-.w-full {
-  width: 100%;
-}
-
 .max-w-2xl {
   max-width: 42rem;
 }
@@ -687,8 +665,8 @@ video {
   border-radius: 0.25rem;
 }
 
-.rounded-full {
+.border {
-  border-radius: 9999px;
+  border-width: 1px;
 }
 
 .border-b {
@@ -704,21 +682,11 @@ video {
   border-color: rgb(229 231 235 / var(--tw-border-opacity));
 }
 
-.bg-gray-500 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(107 114 128 / var(--tw-bg-opacity));
-}
-
 .bg-gray-800 {
   --tw-bg-opacity: 1;
   background-color: rgb(31 41 55 / var(--tw-bg-opacity));
 }
 
-.bg-sky-200 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(186 230 253 / var(--tw-bg-opacity));
-}
-
 .bg-white {
   --tw-bg-opacity: 1;
   background-color: rgb(255 255 255 / var(--tw-bg-opacity));
@@ -728,8 +696,9 @@ video {
   padding: 0.5rem;
 }
 
-.p-1 {
+.px-2 {
-  padding: 0.25rem;
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
 }
 
 .px-6 {
@@ -742,20 +711,14 @@ video {
   padding-bottom: 6rem;
 }
 
-.px-3 {
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-}
-
-.py-2 {
-  padding-top: 0.5rem;
-  padding-bottom: 0.5rem;
-}
-
 .pt-10 {
   padding-top: 2.5rem;
 }
 
+.pt-2 {
+  padding-top: 0.5rem;
+}
+
 .text-2xl {
   font-size: 1.5rem;
   line-height: 2rem;
@@ -766,29 +729,11 @@ video {
   line-height: 1.75rem;
 }
 
-.text-sm {
-  font-size: 0.875rem;
-  line-height: 1.25rem;
-}
-
-.text-xl {
-  font-size: 1.25rem;
-  line-height: 1.75rem;
-}
-
 .text-xs {
   font-size: 0.75rem;
   line-height: 1rem;
 }
 
-.font-bold {
-  font-weight: 700;
-}
-
-.font-medium {
-  font-weight: 500;
-}
-
 .font-semibold {
   font-weight: 600;
 }
@@ -797,11 +742,6 @@ video {
   line-height: 1.5rem;
 }
 
-.text-gray-200 {
-  --tw-text-opacity: 1;
-  color: rgb(229 231 235 / var(--tw-text-opacity));
-}
-
 .text-gray-300 {
   --tw-text-opacity: 1;
   color: rgb(209 213 219 / var(--tw-text-opacity));
@@ -817,11 +757,6 @@ video {
   color: rgb(17 24 39 / var(--tw-text-opacity));
 }
 
-.drop-shadow {
-  --tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06));
-  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
-}
-
 .first\:border-none:first-child {
   border-style: none;
 }

rauhala.info/profile.html

@@ -1,42 +0,0 @@
-<div class="flex">
-  <div class="w-1/3 bg-sky-200">
-    <img class="rounded-full drop-shadow" src="./images/profile.jpg"/>
-    <div>
-      <div class="">
-        <h2 class="text-xl font-bold">Mats Rauhala</h2>
-        <h3 class="text-sm">Lead Software Developer</h3>
-      </div>
-    </div>
-  </div>
-  <div class="w-full">
-    <div>
-      <h2 class="text-xl">Working on</h2>
-      <!-- Skills -->
-      <!-- Take ideas from https://www.mockplus.com/blog/post/profile-page-design -->
-      <!-- XXX: Convert to alpine.js to remove some repetition? -->
-      <div class="p-1">
-        <button class="bg-gray-500 text-gray-200 rounded-full px-3 py-2 ">Haskell</button>
-      </div>
-      <div class="p-1">
-        <button class="bg-gray-500 text-gray-200 rounded-full px-3 py-2 ">Functional programming</button>
-      </div>
-      <div class="p-1">
-        <button class="bg-gray-500 text-gray-200 rounded-full px-3 py-2 ">Databases</button>
-      </div>
-      <div class="p-1">
-        <button class="bg-gray-500 text-gray-200 rounded-full px-3 py-2 ">Kubernetes</button>
-      </div>
-    </div>
-    <div>
-      <!-- Past experience -->
-      <!-- I'm thinking of something like closeable boxes for more information? -->
-    </div>
-  </div>
-  <div class="bg-sky-200 w-1/3">
-    <h2 class="text-lg font-medium">Biography</h2>
-    <p>A software developer from southern Finland<p>
-    <h2 class="text-lg font-medium">Location</h2>
-    Espoo, Finland
-  </div>
-
-</div>

rauhala.info/templates/default.html

@@ -9,9 +9,8 @@
         <link rel="stylesheet" href="/css/index.css">
     </head>
     <body>
-    <div class="h-screen">
         <header>
-        <nav class="flex bg-gray-800 text-gray-300 items-stretch text-lg width-full align-center justify-between">
+          <nav class="flex bg-gray-800 text-gray-300 items-stretch text-lg border width-full align-center justify-between">
             <ul class="flex gap-2 p-2">
               <li class="hover:text-gray-400"><a href="/">Home</a></li>
               <li class="hover:text-gray-400"><a href="/posts.html">Posts</a></li>
@@ -22,7 +21,7 @@
                 <!-- Hide the dropdown by default, but make it visible on the parent hover
                      see the 'group' on the toplevel
                   -->
-              <ul class="hidden bg-gray-800 text-gray-300 rounded p-2 group-hover:block absolute">
+                <ul class="hidden bg-gray-800 text-gray-300 border rounded p-2 group-hover:block absolute">
                     <li class="hover:text-gray-400"><a href="https://git.rauhala.info/MasseR">Gitea</a></li>
                     <li class="hover:text-gray-400"><a href="https://github.com/MasseR">GitHub</a></li>
                 </ul>
@@ -32,19 +31,15 @@
           </nav>
         </header>
 
-      <main role="main" class="">
+        <main role="main" class="px-2">
           <div>
             $body$
           </div>
         </main>
 
-      <footer class="">
+        <footer class="pt-2 border-t px-2">
-        <div class="flex justify-center">
+            Site proudly generated by
-          <div>
+            <a href="http://jaspervdj.be/hakyll">Hakyll</a>
-            Site proudly generated by <a href="http://jaspervdj.be/hakyll">Hakyll</a>
-          </div>
-        </div>
         </footer>
-    </div>
     </body>
 </html>

site/app/site.hs

@@ -50,12 +50,7 @@ main = hakyllWith defaultConfiguration{ignoreFile = ignore} $ do
       >>= relativizeUrls
 
 
-  match "profile.html" $ do
+  match (fromList ["index.markdown", "contact.markdown"]) $ do
-    route $ constRoute "index.html"
-    compile $ getResourceBody
-      >>= loadAndApplyTemplate "templates/default.html" defaultContext
-      >>= relativizeUrls
-  match (fromList ["contact.markdown"]) $ do
     route   $ setExtension "html"
     compile $ pandocCompiler
       >>= loadAndApplyTemplate "templates/default.html" defaultContext