index: remove preview list

Signed-off-by: Amneesh Singh <natto@weirdnatto.in>

css/default.css

@@ -161,7 +161,10 @@ a:hover {
 }
 
 nav {
+  display: flex;
+  flex-direction: row;
   text-align: center;
+  justify-content: center;
   margin: 0 auto 3rem;
 }
 
@@ -194,16 +197,6 @@ h2 {
   font-size: 2rem;
 }
 
-.post-preview-item {
- list-style-type: none;
- padding: 2rem;
- border: 0.2rem ridge var(--fg5);
-}
-
-.post-preview-item:not(:last-child) {
-  margin-bottom: 3rem;
-}
-
 .post-title {
   text-align: center;
   color: var(--fg5) !important;
@@ -286,13 +279,20 @@ img, video {
     margin: 0;
     padding: 0 5%;
   }
+
   footer {
     text-align: center;
   }
+ 
+  nav {
+    flex-direction: column;
+  }
+ 
   nav a {
     display: block;
     line-height: 1.6;
   }
+ 
   .toc {
     padding: 1rem;
   }
@@ -304,31 +304,43 @@ img, video {
     margin: 0;
     padding: 0 5%;
   }
+
   footer {
     text-align: center;
   }
+
   nav a {
     display: inline;
     margin: 0 0.6rem;
   }
+
   .toc {
     padding: 1rem;
   }
 }
 
+@media (max-width: 639px) {
+  nav {
+    flex-direction: column;
+  }
+}
+
 @media (min-width: 640px) {
   body {
     width: 60%;
     margin: 0 auto;
     padding: 0;
   }
+
   nav a {
     margin: 0 0 0 1.2rem;
     display: inline;
   }
+
   footer {
     text-align: right;
   }
+
   .toc {
     padding: 2rem;
   }

src/site.hs

@@ -112,10 +112,7 @@ main = hakyllWith config $ do
   match "index.html" $ do
     route idRoute
     compile $ do
-      posts <- fmap (take 10) . recentFirst =<< loadAllSnapshots "posts/*" "content"
+      let indexCtx = defaultCtx
-      let indexCtx =
-            listField "posts" (postCtx tags) (return posts)
-              <> defaultCtx
 
       getResourceBody
         >>= applyAsTemplate indexCtx

templates/post-preview-list.html

@@ -1,27 +0,0 @@
-<ul class="post-preview-item-list">
-    $for(posts)$
-        <li class="post-preview-item" >
-            <article>
-                <h1 class="post-title">$title$</h1>
-                <div class="post-header">
-                    <div class="post-date" >
-                        Posted $date$
-                    </div>
-                    <div class="tags" >
-                        $if(tags)$
-                          Tags: $tags$
-                        $endif$
-                    </div>
-                </div>
-                <div class="post-teaser">
-                    $if(teaser)$
-                      $teaser$
-                    $else$
-                      $body$
-                    $endif$
-                </div>
-                <a href="$url$">Read more</a>
-            </article>
-        </li>
-    $endfor$
-</ul>