more styling on home page

src/components/Base.astro

···
           <meta property="og:description" content={graph.description} />
           <meta
             property="og:url"
-            content=
-              {new URL(Astro.url.pathname.toString(), Astro.site)}
+            content={new URL(Astro.url.pathname.toString(), Astro.site)}
           />
           <meta property="og:type" content={graph.type ?? "website"} />
           <meta property="og:image" content={banner} />

src/components/BlogPost.astro

···
     margin-bottom: 13px;
   }
 
-  a:last-child {
-    margin-bottom: 0;
-  }
-
   article {
     flex: 1 1;
     padding: 13px 15px;

src/pages/home.astro

···
         <img src="/img/sprites/sunfl1.png" alt="" />
       </div>
       <div id="blog" class="bwbox">
-        <h2>Latest blog post</h2>
+        <h2 class="center">Latest blog post</h2>
         <BlogPost
           url={`/blog/${post[0].id}`}
           title={post[0].data.title}
           time={`${post[0].data.pub.getFullYear()}-${post[0].data.pub.getMonth() + 1}-${post[0].data.pub.getDate()}`}
         />
-        <a href="/blog">View all posts</a>
-        <a href="/rss.xml">RSS feed</a>
+        <div class="center">
+          <a href="/blog" class="button">::ALL_POSTS::</a>
+          <a href="/rss.xml" class="button">::RSS_FEED::</a>
+        </div>
       </div>
     </main>
   </div>
···
   .grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
+  }
+
+  .button {
+    margin-bottom: 13px;
   }
 
   @media (max-width: 86ch) {

src/styles/main.css

···
   font-family: barcodetext;
 }
 
+.button {
+  display: inline-block;
+  color: var(--yellow);
+  border: 10px double;
+  padding: 4px 6px;
+}
+
+a.button {
+  text-decoration: none;
+}
+
 @font-face {
   font-family: barcodetext;
   src: url("/fonts/LibreBarcode39ExtendedText-Regular.woff");