tweak puzzle and blog cards

reednel · Dec 6, 2023 · 1deb3cf · 1deb3cf
1 parent aea7dbe
commit 1deb3cf
Show file tree

Hide file tree

Showing 14 changed files with 67 additions and 66 deletions.
diff --git a/src/config/config.json b/src/config/config.json
@@ -24,7 +24,7 @@
   },
 
   "metadata": {
-    "meta_author": "reednel",
+    "meta_author": "Reed Nelson",
     "meta_image": "/favicon.ico",
     "meta_description": "A place with things."
   }

diff --git a/src/content/blog/crypto.md b/src/content/blog/crypto.md
@@ -4,7 +4,7 @@ description: none
 date: 2022-08-30T05:00:00Z
 categories: [Cryptography]
 author: Reed Nelson
-tags: [crypto]
+tags: [cryptography]
 complexity: 1
 draft: true
 ---

diff --git a/src/content/blog/dh.md b/src/content/blog/dh.md
@@ -4,7 +4,7 @@ description: none
 date: 2022-07-10T05:00:00Z
 categories: [Cryptography]
 author: Reed Nelson
-tags: [math, crypto]
+tags: [math, cryptography]
 complexity: 1
 draft: true
 ---

diff --git a/src/content/blog/huffman.md b/src/content/blog/huffman.md
@@ -4,7 +4,7 @@ description: Data compression is a process of modifying the representation of so
 date: 2022-06-30T05:00:00Z
 categories: [Cryptography]
 author: Reed Nelson
-tags: [math, crypto, information-theory]
+tags: [math, cryptography, information-theory]
 complexity: 1.7
 draft: false
 ---

diff --git a/src/content/blog/rsa.md b/src/content/blog/rsa.md
@@ -4,7 +4,7 @@ description: You use the RSA encryption scheme every day. It's simple enough to
 date: 2022-06-10T05:00:00Z
 categories: [Cryptography]
 author: Reed Nelson
-tags: [math, crypto]
+tags: [math, cryptography]
 complexity: 1.5
 draft: false
 ---

diff --git a/src/layouts/BlogSingle.astro b/src/layouts/BlogSingle.astro
@@ -55,8 +55,8 @@ tags.sort((a: string, b: string) => a.localeCompare(b));
         </div>
         <hr>
         <div class="row items-start justify-between mt-4">
-          <div class="mb-4 flex justify-center items-center lg:justify-start lg:col-5 lg:mb-0">
-            <h5 class="mr-3">Tags:</h5>
+          <div class="mb-4 flex justify-center items-center lg:justify-start lg:col-8 lg:mb-0">
+            <h4 class="mr-3">Tags:</h4>
             <ul>
               {
                 tags.map((tag: string) => (
@@ -85,21 +85,25 @@ tags.sort((a: string, b: string) => a.localeCompare(b));
       </article>
     </div>
 
+    <!-- Related posts -->
     {
       similarPosts.length > 0 && (
-        <!-- Related posts -->
-        <div class="section pb-0">
-          <h2 class="h3 mb-12 text-center">Related Posts</h2>
-          <div class="row justify-center">
-            {
-              similarPosts.slice(0, 3).map((post) => (
-                <div class="lg:col-4 mb-12">
-                  <BlogCard data={post} />
-                </div>
-              ))
-            }
+        <div class="row justify-center pt-12 pb-0">
+          <h2 class="h3 mb-4 text-center">Related Posts</h2>
+          <div class="lg:col-10">
+            <div class="row justify-center">
+              {
+                similarPosts.slice(0, 2).map((post) => (
+                  <div class="md:col-6 px-4 py-2">
+                    <BlogCard data={post} />
+                  </div>
+                ))
+              }
+            </div>
+
           </div>
         </div>
       )
     }
+  </div>
 </section>
diff --git a/src/layouts/components/BlogCard.astro b/src/layouts/components/BlogCard.astro
@@ -11,28 +11,30 @@ const { data } = Astro.props;
 const { title, description, categories, complexity } = data.data;
 ---
 
-<div class="m-6 bg-body dark:bg-darkmode-body">
-  <h4 class="mb-2">
-    <a href={`/${blog_folder}/${data.slug}`}>
-      {title}
-    </a>
-  </h4>
-  <ul class="mb-2">
-    <li class="mr-4 inline-block">
-      <FaRegFolder className={"mr-1 -mt-1 inline-block"} />
-      {
-        categories.map((category: string, index: number) => (
-          <a href={`/blog/categories/${slugify(category)}`}>
-            {humanize(category)}
-            {index !== categories.length - 1 && ","}
-          </a>
-        ))
-      }
-    </li>
-    <li class="mr-4 inline-block ">
-      <FaRegClock className={"mr-1 -mt-1 inline-block"} />
-      {readingTime(data.body, complexity)}
-    </li>
-  </ul>
-  <p class="mb-6">{description}</p>
+<div class="min-h-full block border border-light bg-transparent text-light rounded-sm dark:text-darkmode-light dark:border-darkmode-light">
+  <div class="m-6 bg-body dark:bg-darkmode-body">
+    <h4 class="mb-2">
+      <a href={`/${blog_folder}/${data.slug}`}>
+        {title}
+      </a>
+    </h4>
+    <ul class="mb-2">
+      <li class="mr-4 inline-block">
+        <FaRegFolder className={"mr-1 -mt-1 inline-block"} />
+        {
+          categories.map((category: string, index: number) => (
+            <a href={`/blog/categories/${slugify(category)}`}>
+              {humanize(category)}
+              {index !== categories.length - 1 && ","}
+            </a>
+          ))
+        }
+      </li>
+      <li class="mr-4 inline-block ">
+        <FaRegClock className={"mr-1 -mt-1 inline-block"} />
+        {readingTime(data.body, complexity)}
+      </li>
+    </ul>
+    <p class="mb-6">{description}</p>
+  </div>
 </div>
diff --git a/src/layouts/components/PuzzleCard.astro b/src/layouts/components/PuzzleCard.astro
@@ -9,14 +9,16 @@ const { data } = Astro.props;
 const { title, description } = data.data;
 ---
 
-<div class="m-6">
-  <a href={`/${puzzle_folder}/${data.slug}`}>
-    <h4 class="mb-3">
-      {title}
-    </h4>
-  </a>
-  <p>
-    {description}
-  </p>
+<div class="min-h-full block border border-light bg-transparent text-light rounded-sm dark:text-darkmode-light dark:border-darkmode-light">
+  <div class="m-6">
+    <a href={`/${puzzle_folder}/${data.slug}`}>
+      <h4 class="mb-3">
+        {title}
+      </h4>
+    </a>
+    <p>
+      {description}
+    </p>
+  </div>
 </div>
 
diff --git a/src/pages/blog/categories/[category].astro b/src/pages/blog/categories/[category].astro
@@ -29,10 +29,10 @@ const filterByCategories = taxonomyFilter(posts, "categories", category!);
   <PageHeader title={category} />
   <div class="section-sm pb-0">
     <div class="container">
-      <div class="row">
+      <div class="row justify-center">
         {
           filterByCategories.map((post) => (
-            <div class="mb-14 md:col-6 lg:col-4">
+            <div class="py-2 md:py-4 md:col-6 lg:col-4">
               <BlogCard data={post} />
             </div>
           ))

diff --git a/src/pages/blog/index.astro b/src/pages/blog/index.astro
@@ -35,10 +35,8 @@ const currentPosts = sortedPosts.slice(0, config.settings.blog_pagination);
           <div class="row">
             {
               currentPosts.map((post) => (
-                <div class="mb-4 md:mb-8 md:col-6">
-                  <div class="min-h-full block border border-light bg-transparent text-light rounded-sm dark:text-darkmode-light dark:border-darkmode-light">
-                    <BlogCard data={post} />
-                  </div>
+                <div class="pb-4 md:pb-8 md:col-6">
+                  <BlogCard data={post} />
                 </div>
               ))
             }

diff --git a/src/pages/blog/page/[slug].astro b/src/pages/blog/page/[slug].astro
@@ -54,10 +54,8 @@ export async function getStaticPaths() {
           <div class="row">
             {
               currentPosts.map((post) => (
-                <div class="mb-4 md:mb-8 md:col-6">
-                  <div class="min-h-full block border border-light bg-transparent text-light rounded-sm dark:text-darkmode-light dark:border-darkmode-light">
-                    <BlogCard data={post} />
-                  </div>
+                <div class="pb-4 md:pb-8 md:col-6">
+                  <BlogCard data={post} />
                 </div>
               ))
             }

diff --git a/src/pages/blog/tags/[tag].astro b/src/pages/blog/tags/[tag].astro
@@ -26,10 +26,10 @@ const filterByCategories = taxonomyFilter(posts, "tags", tag!);
   <PageHeader title={tag} />
   <div class="section-sm pb-0">
     <div class="container">
-      <div class="row">
+      <div class="row justify-center">
         {
           filterByCategories.map((post) => (
-            <div class="mb-14 md:col-6 lg:col-4">
+            <div class="py-2 md:py-4 md:col-6 lg:col-4">
               <BlogCard data={post} />
             </div>
           ))

diff --git a/src/pages/blog/tags/index.astro b/src/pages/blog/tags/index.astro
@@ -2,7 +2,6 @@
 import config from "@/config/config.json";
 import Base from "@/layouts/Base.astro";
 import { getAllTaxonomy, getTaxonomy } from "@/lib/taxonomyParser.astro";
-import { humanize } from "@/lib/utils/textConverter";
 import PageHeader from "@/components/PageHeader.astro";
 
 const { blog_folder }: { blog_folder: string } = config.settings;

diff --git a/src/pages/puzzles/index.astro b/src/pages/puzzles/index.astro
@@ -24,9 +24,7 @@ const posts = await getSinglePage(puzzle_folder);
             posts.map((post) => (
               // Puzzle Card
               <div class="mb-4 md:mb-8 md:col-6 lg:col-4">
-                <div class="min-h-full block border border-light bg-transparent text-light rounded-sm dark:text-darkmode-light dark:border-darkmode-light">
                   <PuzzleCard data={post} />
-                </div>
               </div>
             ))
           }