new layout for blog entries

3 files changed, 52 insertions, 23 deletions

diff --git a/_post.html b/_post.html
index 9366a9e..c1a08f6 100644
--- a/_post.html
+++ b/_post.html
@@ -1,20 +1,24 @@
 {% extends "_base.html" %}
 
 {% block content %}
-<h1>{{ entry.title|typogrify }}</h1>
+<div id="blog-show">
+  <h1>
+    {{ entry.title|typogrify }}
+    <small>{{ entry.date.strftime('%d %B %Y ') }}</small>
+  </h1>
+  <p>
+  </p>
 
-{{ entry.body }}
-
-<ul class="meta">
-  <li>Published: {{ entry.date.strftime('%d %B %Y ') }}</li>
+  {{ entry.body }}
 
   {% if entry.tags %}
-  <li>
-    Tags: {% for tag in entry.tags -%}
-    <a href="{{ site.tag_cache.get(tag).get_url() }}">{{ tag }}</a>
-    {%- if not loop.last %}, {% endif -%}
+  <p>
+    <b>Tags</b>: 
+    {% for tag in entry.tags -%}
+        <a href="{{ site.tag_cache.get(tag).get_url() }}">{{ tag }}</a>
+        {%- if not loop.last %}, {% endif -%}
     {%- endfor %}
-  </li>
+  </p>
   {% endif %}
-</ul>
+</div>
 {% endblock %}
diff --git a/blog.html b/blog.html
index 579fd5a..01af04e 100644
--- a/blog.html
+++ b/blog.html
@@ -4,16 +4,19 @@
 {% endmeta %}
 
 {% block content %}
-<h2>Latest posts</h2>
-
-{% for year,entries in site.posts|group_by_year|dictsort|reverse %}
-  <h3>{{ year }}</h3>
-  {% for post in entries %}
-    <p>
-      {{ post.date.strftime('%B %d') }}
-      -
-      <a href="{{ post.get_url() }}">{{ post.title }}</a>
-    </p>
-  {% endfor %}</ul></li>
-{% endfor %}
+<div id="blog-index">
+  {% for year,entries in site.posts|group_by_year|dictsort|reverse %}
+    <div class="blog-year">
+      <h3>{{ year }}</h3>
+      {% for post in entries %}
+        <p>
+          <div class="entry-date">
+            {{ post.date.strftime('%B %d') }}
+          </div>
+          <a href="{{ post.get_url() }}">{{ post.title }}</a>
+        </p>
+      {% endfor %}
+    </div>
+    {% endfor %}
+</div>
 {% endblock %}
diff --git a/static/css/main.css b/static/css/main.css
index 4ebcbf4..b17ec17 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -100,6 +100,28 @@ nav a:hover {
     z-index: 1;
 }
 
+#blog-index h3 {
+  text-align: center;
+}
+
+#blog-index .blog-year {
+  margin-bottom: 2%;
+}
+
+.entry-date {
+  float: left;
+  width: 40%;
+  text-align: right;
+}
+
+.blog-year a {
+  padding-left: 2%;
+}
+
+#blog-show small {
+  float: right;
+}
+
 pre {
     white-space: pre !important;
 }