Oblique metadata text

Make excerpt comments a link

css/article.css

@@ -15,7 +15,13 @@
   }
 }
 
-.article__date-text {
-  margin-left: var(--space-xs);
-  vertical-align: top;
+.article__date-icon {
+  vertical-align: middle;
+}
+
+.article__date-text {
+  margin-left: var(--space-xxs);
+  vertical-align: middle;
+  font-style: oblique;
+  font-size: var(--size-body-small);
 }

css/comment.css

@@ -22,6 +22,7 @@
 
 .comment__date {
   font-size: var(--size-body-extra-small);
+  font-style: oblique;
 }
 
 .comment__body {

css/excerpt.css

@@ -39,10 +39,12 @@
 
 .excerpt__icon,
 .excerpt__text {
+  font-weight: 100;
   vertical-align: top;
 }
 
 .excerpt__text {
+  font-style: oblique;
   margin: 0 var(--space-sm) 0 var(--space-xxs);
 }
 
@@ -81,3 +83,22 @@
   width: 0.1rem;
   background-color: var(--color-light-blue);
 }
+
+.excerpt__list-link {
+  color: inherit;
+  transition: color var(--transition-md) ease-out;
+}
+
+.excerpt__list-link:visited {
+  color: inherit;
+}
+
+.excerpt__list-link:hover,
+.excerpt__list-link:focus {
+  color: var(--color-light-blue);
+}
+
+.excerpt__list-link:hover .excerpt__text,
+.excerpt__list-link:focus .excerpt__text {
+  box-shadow: var(--link-focus);
+}

css/metadata.css

@@ -56,6 +56,7 @@
 }
 
 .metadata__text {
+  font-style: oblique;
   margin-left: var(--space-xs);
   text-transform: capitalize;
   transition: box-shadow var(--transition-md) ease-out;