improve appearance

assets/sass/_layout.sass

@@ -113,6 +113,80 @@ section
     text-align: center
     h1
         margin: 0
-    .time
-        font-size: 0.8rem
+        width: 100%
+        font-size: 3rem
+        word-break: break-word
+    .subtitle
+        margin: 0
+        width: 100%
+        font-size: 1.2rem
+        font-weight: 300
         color: $text-subtle
+.time
+    font-size: 0.8rem
+    color: $text-subtle
+    text-align: center
+
+article
+    background: $surface
+    border-radius: 8px
+    padding: $spacing-unit
+    margin: $spacing-unit 0
+    position: relative
+    transition: background 0.5s ease-in-out
+    &:hover, &:focus
+        background: $primary-dark
+    h3
+        margin: 0
+        font-size: 1.5rem
+        font-weight: 700
+        color: $text
+    a
+        color: $text
+        position: absolute
+        top: 0
+        left: 0
+        width: 100%
+        height: 100%
+        z-index: 1
+        text-indent: -9999px
+        overflow: hidden
+        text-decoration: none
+        transition: color 0.3s ease-in-out
+        &:hover, &:focus
+            color: $accent-light
+    &:not(a)
+        position: relative
+        z-index: 2
+    p
+        margin: 0.5rem 0
+        font-size: 1rem
+        color: $text-subtle
+        font-weight: 300
+
+    .subtitle
+        margin: 0 0 0 0.5rem
+        width: 100%
+        font-size: 1.1rem
+        font-weight: 300
+        color: $text-subtle
+
+.term-title
+    font-weight: 700
+    padding: 0.3rem 0.8rem
+    margin-bottom: 0.5rem
+    border-radius: $border-radius
+
+p code
+    background: darken($primary-dark,10%)
+    margin: 0 0.2rem
+    padding: 0.2rem 0.4rem
+    border-radius: 5px
+    font-size: 0.8rem
+
+pre
+    padding: 0.5rem
+    border-radius: 5px
+    overflow-x: auto
+    code
+        font-size: 0.8rem