update related posts to be styled better (requires markup changes)

LauraBethLong · Oct 16, 2013 · 16ecc7d · 16ecc7d
1 parent 977ffb2
commit 16ecc7d
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 5 deletions.
diff --git a/_layouts/post.html b/_layouts/post.html
@@ -10,12 +10,16 @@ <h1>{{ page.title }}</h1>
 
 <div class="related">
   <h2>Related Posts</h2>
-  <ul class="posts">
+  <ul class="related-posts">
     {% for post in site.related_posts limit:3 %}
-      <h3><a href="{{ post.url }}">
-        {{ post.title }}
-        <small>{{ post.date | date_to_string }}</small>
-      </a></h3>
+      <li>
+        <h3>
+          <a href="{{ post.url }}">
+            {{ post.title }}
+            <small>{{ post.date | date_to_string }}</small>
+          </a>
+        </h3>
+      </li>
     {% endfor %}
   </ul>
 </div>
diff --git a/public/css/hyde.css b/public/css/hyde.css
@@ -234,6 +234,26 @@ a:hover {
   color: #9a9a9a;
 }
 
+/* Related posts */
+.related {
+  padding-top: 40px;
+  border-top: 1px solid #eee;
+}
+.related-posts {
+  list-style: none;
+}
+.related-posts li small {
+  font-size: 75%;
+  color: #999;
+}
+.related-posts li a:hover {
+  color: #000;
+  text-decoration: none;
+}
+.related-posts li a:hover small {
+  color: #000;
+}
+
 
 /* Pagination
 -------------------------------------------------- */