readability changes

sass/styles/layout.scss

@@ -13,6 +13,24 @@ p {
 }
 a {
   text-decoration: none;
+
+  &:visited {
+    color: blue;
+  }
+
+  &:hover {
+    color: blueviolet;
+  }
+}
+
+body {
+  margin-bottom: 30px;
+}
+
+.mobile-hidden {
+  @media only screen and (max-width: 650px) {
+    display: none;
+  }
 }
 
 .yt-embed {
@@ -76,3 +94,8 @@ a {
     }
   }
 }
+
+.blog-post-li {
+  margin: 0.25em;
+  font-size: 96%;
+}

templates/section.html

@@ -28,9 +28,10 @@
 
 {% if section.extra.inject_blog_posts %}
 <ul>
-{% for page in section.pages %}
-<li><a href="{{page.path}}">{{page.title}}</a> <span style="color:gray;">({{page.date}})</span></li>
-{% endfor %}
+    {% for page in section.pages %}
+    <li class="blog-post-li"><a href="{{page.path}}">{{page.title}}</a> <span style="color:gray;">({{page.date}})</span>
+    </li>
+    {% endfor %}
 </ul>
 {% endif %}
 {% endblock content %}