From e803456e9027673ba5a98bcae265951407e370bf Mon Sep 17 00:00:00 2001
From: Gabriel Augendre <gabriel@augendre.info>
Date: Tue, 18 Aug 2020 11:37:59 +0200
Subject: [PATCH] Improve some styling

---
 README.md                                         | 1 -
 articles/static/style.css                         | 9 +++++++--
 articles/templates/articles/article_list.html     | 4 ++--
 articles/templates/articles/metadata_snippet.html | 8 ++++----
 4 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/README.md b/README.md
index 8585a82..a3866e0 100644
--- a/README.md
+++ b/README.md
@@ -3,5 +3,4 @@
 Simple blog management system.
 
 ## Todo
-2. Rework HTML structure to be more logical and not tied to styling.
 3. Find a nice way to display metadata (author, dates, etc)
diff --git a/articles/static/style.css b/articles/static/style.css
index d9c4760..aa77261 100644
--- a/articles/static/style.css
+++ b/articles/static/style.css
@@ -10,7 +10,8 @@
 html {
     font-size: 110%;
     max-width: calc(640px + 2em);
-    margin: 8px auto 6em;
+    padding: 8px 0 3em;
+    margin: 0 auto;
 }
 
 body {
@@ -24,6 +25,10 @@ p {
     line-height: 1.7;
 }
 
+li {
+    line-height: 1.4;
+}
+
 body img {
     max-width: 100%;
 }
@@ -31,7 +36,7 @@ body img {
 a {
     color: var(--main);
     text-decoration: none;
-    border-bottom: 2.5px solid var(--accent);
+    border-bottom: .3ex solid var(--accent);
 }
 
 a:hover, a:focus {
diff --git a/articles/templates/articles/article_list.html b/articles/templates/articles/article_list.html
index f6daa9e..4e579ea 100644
--- a/articles/templates/articles/article_list.html
+++ b/articles/templates/articles/article_list.html
@@ -15,7 +15,7 @@
     {% empty %}
         <p>No article here. Come back later 🙂</p>
     {% endfor %}
-    <div class="pagination">
+    <nav class="pagination">
         <div class="older">
             {% if page_obj.has_next %}
                 <a href="?page={{ page_obj.next_page_number }}">⇠ Older</a>
@@ -26,5 +26,5 @@
                 <a href="?page={{ page_obj.previous_page_number }}">Newer ⇢</a>
             {% endif %}
         </div>
-    </div>
+    </nav>
 {% endblock %}
diff --git a/articles/templates/articles/metadata_snippet.html b/articles/templates/articles/metadata_snippet.html
index 4b3c768..f44fc7a 100644
--- a/articles/templates/articles/metadata_snippet.html
+++ b/articles/templates/articles/metadata_snippet.html
@@ -1,9 +1,9 @@
+{% load i18n %}
 <p class="date">
     {% if article.published_at %}
-        {{ article.published_at|date }}
-        {% include "articles/admin_link_snippet.html" %}
+        <time datetime="{{ article.published_at|date:'c' }}">{{ article.published_at|date }}</time>
     {% else %}
-        {{ article.updated_at|date }}
-        {% include "articles/admin_link_snippet.html" %}
+        <time datetime="{{ article.updated_at|date:'c' }}">{{ article.updated_at|date }}</time>
     {% endif %}
+    {% include "articles/admin_link_snippet.html" %}
 </p>