tighten up ui, add some tables to look all profesh

suchwow/templates/index.html

@@ -9,11 +9,22 @@
   </div>
 
   {% if posts %}
-    <ul style="list-style-type:none;">
+    <table class="table table-striped">
+      <tr>
+        <th>Date</th>
+        <th>ID</th>
+        <th>Title</th>
+        <th>Submitter</th>
+      </tr>
       {% for post in posts %}
-        <li>#{{ post.id }} - <a href="{{ url_for('post.read', id=post.id) }}">{{ post.title }}</a> - {{ post.submitter }}</li>
+        <tr>
+          <td>{{ post.timestamp.strftime('%Y-%m-%d %H:%M') }}</td>
+          <td>{{ post.id }}</td>
+          <td><a href="{{ url_for('post.read', id=post.id) }}">{{ post.title }}</a></td>
+          <td>{{ post.submitter }}</td>
+        </tr>
       {% endfor %}
-    </ul>
+    </table>
   {% else %}
     <p>No posts yet!</p>
   {% endif %}

suchwow/templates/leaderboard.html

@@ -9,15 +9,27 @@
   </div>
 
   {% if posters %}
-    <ul style="list-style-type:none;">
+    <table class="table table-striped">
+      <tr>
+        <th>Submitter</th>
+        <th>Posts</th>
+        <th>Amount</th>
+      </tr>
       {% for poster, data in posters.items() | sort(attribute='1.amount', reverse=True) %}
-        <li>{{ poster }} - {% for post in data["posts"] %}<a href="{{ url_for('post.read', id=post.id) }}">{{ post }}</a>, {% endfor %} - {{ data["amount"] }} WOW received</li>
+        <tr>
+          <td>{{ poster }}</td>
+          <td>{% for post in data["posts"] %}<a href="{{ url_for('post.read', id=post.id) }}">{{ post }}</a>{{ "," if not loop.last }}{% endfor %}</td>
+          <td>{{ data["amount"] }} WOW</td>
+        </tr>
       {% endfor %}
-    </ul>
+    </table>
   {% else %}
-    <p>No top posters yet!</p>
+    <p>No posts yet!</p>
   {% endif %}
 
+  <hr>
+  <a href="{{ url_for('index') }}"><button class="btn btn-warning">Go Home</button></a>
+
 </div>
 
 {% endblock %}

suchwow/templates/post/top.html

@@ -9,15 +9,30 @@
   </div>
 
   {% if posts %}
-    <ul style="list-style-type:none;">
+    <table class="table table-striped">
+      <tr>
+        <th>Date</th>
+        <th>ID</th>
+        <th>Title</th>
+        <th>Submitter</th>
+        <th>Amount</th>
+      </tr>
       {% for post in posts %}
-        <li>#{{ post[1].id }} - <a href="{{ url_for('post.read', id=post[1].id) }}">{{ post[1].title }}</a> - {{ post[1].submitter }} - {{ post[0] }} WOW received</li>
+        <tr>
+          <td>{{ post[1].timestamp.strftime('%Y-%m-%d %H:%M') }}</td>
+          <td>{{ post[1].id }}</td>
+          <td><a href="{{ url_for('post.read', id=post.id) }}">{{ post[1].title }}</a></td>
+          <td>{{ post[1].submitter }}</td>
+          <td>{{ post[0] }} WOW</td>
+        </tr>
       {% endfor %}
-    </ul>
+    </table>
   {% else %}
     <p>No posts yet!</p>
   {% endif %}
 
+  <hr>
+  <a href="{{ url_for('index') }}"><button class="btn btn-warning">Go Home</button></a>
 
 </div>