Cleaned up archive li layout

site/assets/css/layout.css

@@ -1,6 +1,7 @@
 html {
   height: 100%;
   box-sizing: border-box;
+  font-display: swap;
 }
 
 *,

site/assets/css/theme.css

@@ -12,6 +12,7 @@ header{
     color: #D8D8D8;
     font-size: 2.1rem;
     font-family: Beleren;
+    /* TODO: Replace Beleren */
 }
 
 .silver-text, .nav-text{
@@ -222,3 +223,25 @@ blockquote > p:last-of-type {
 img {
     width: 50vw;
 }
+
+li::marker {
+    content: '⍟ ';
+    /* TODO: Decide on a default li marker for the theme*/
+}
+
+ul:has(> .blog-archive-li){
+    padding-left: 0.25em;
+}
+
+.blog-archive-li{
+    list-style: none;
+    margin-bottom: 0.5em;
+    padding-bottom: 0.5em;
+    border-image: var(--silver) 1;
+    border-bottom-width: 0.1em;
+    border-bottom-style: solid;
+}
+
+.blog-archive-li > time {
+    float: right;
+}

site/templates/components/blog_archive_li.html

@@ -1 +1,4 @@
-<li>{article.metadata.date} - <a href='{article.path}'>{article.metadata.title}</a> {blog_tags}</li>
+<li class="blog-archive-li"><a href='{article.path}'>{article.metadata.title}</a> <time datetime="{article.metadata.date}">{article.metadata.date}</time>
+    <br />
+    {blog_tags}
+</li>

site/templates/components/blog_article.html

@@ -1,4 +1,5 @@
 <article>
+    <!-- TODO: Fix the layout of the byline -->
     <h1 class="headline">{article.metadata.title}</h1>
     <p class="byline">
         <address class="author">By <a rel="author" href="mailto:admin@jimlab.io">Jim Shepich III</a></address>