new popular post

also fix prev/next links

Author: healeycodes

data/posts.ts

@@ -2,7 +2,7 @@
 export const popularPosts = [
   "lisp-compiler-optimizations",
   "my-time-at-the-recurse-center",
-  "building-my-own-chess-engine",
+  "rendering-counter-strike-demos-in-the-browser",
 ];
 
 // Starred posts (not in any specific order)

pages/[id].tsx

@@ -191,13 +191,13 @@ export default function Post({
       <Newsletter />
       <div className="other-posts">
         {prevPost ? (
-          <div className="other-posts-link">
+          <div className="other-posts-link prev">
             <Link href={`/${prevPost.id}`} legacyBehavior>{`← ${prevPost.title}`}</Link>
           </div>
         ) : null}
         {nextPost ? (
-          <div className="other-posts-link">
-            <Link href={`/${nextPost.id}`} legacyBehavior>{`${nextPost.title} →`}</Link>{" "}
+          <div className="other-posts-link next">
+            <Link href={`/${nextPost.id}`} legacyBehavior>{`${nextPost.title} →`}</Link>
           </div>
         ) : null}
       </div>
@@ -220,11 +220,20 @@ export default function Post({
         }
         .other-posts {
           padding-top: 48px;
+          display: flex;
+          flex-wrap: wrap;
+          justify-content: space-between;
+          gap: 16px;
         }
         .other-posts-link {
-          display: block;
           padding-bottom: 32px;
         }
+        .other-posts-link.prev {
+          text-align: left;
+        }
+        .other-posts-link.next {
+          text-align: right;
+        }
         aside {
           background-color: var(--aside);
           padding: 1.5em 1.5em;