Add published date to reviews

layouts/404.html

@@ -3,6 +3,6 @@
     <header class="http-header">
       <h1 title="404" class="http-status">4📀4</h1>
     </header>
-    <p>The page you were looking for could not be found</p>
+    <p class="color:deemphasize">The page you were looking for could not be found</p>
   </section>
 {{ end }}

layouts/reviews/single.html

@@ -7,6 +7,9 @@
       </div>
     {{ end }}
     <h1>{{- .Title -}}</h1>
+    <h3 class="subtitle-small color:deemphasize" style="margin-top: -30px">
+      {{- .PublishDate.Format "August 2, 2006" -}}
+    </h3>
     {{ partial "quicklook.html" . }}
   </header>
   <div class="core-content">

static/review.css

@@ -31,4 +31,3 @@
   height: 100%;
   object-fit: cover;
 }
-

static/style.css

@@ -17,6 +17,12 @@
   --subtitle-font-size: 24px;
   --subtitle-font-letter-spacing: -0.02em;
 
+  --subtitle-small-font-family: 'Rufina', serif;
+  --subtitle-small-font-weight: 400;
+  --subtitle-small-line-height: 1.25;
+  --subtitle-small-font-size: 20px;
+  --subtitle-small-font-letter-spacing: -0.02em;
+
   --body-font-family: 'Inika', serif;
   --body-font-weight: 400;
   --body-font-line-height: 1.625;
@@ -49,6 +55,7 @@
   --color-light-background: #f2f2f2;
   --color-dark-background: #333;
   --color-link: #2F7BD5;
+  --color-deemphasize: #707070;
   font-size: var(--body-font-size);
 }
 
@@ -103,6 +110,14 @@ main {
   font-size: var(--subtitle-font-size);
   letter-spacing: var(--subtitle-font-letter-spacing);
 }
+.subtitle-small {
+  font-family: var(--subtitle-small-font-family);
+  font-weight: var(--subtitle-small-font-weight);
+  line-height: var(--subtitle-small-font-line-height);
+  font-size: var(--subtitle-small-font-size);
+  letter-spacing: var(--subtitle-small-font-letter-spacing);
+}
+
 .caption {
   font-family: var(--caption-font-family);
   font-weight: var(--caption-font-weight);
@@ -169,6 +184,9 @@ a:hover {
 .bg\:secondary {
   background: var(--color-secondary);
 }
+.color\:deemphasize {
+  color: var(--color-deemphasize);
+}
 .navbar {
   display: flex;
 }