From 9fb6836788489518b0a5bb39dd36e58e9fff94ff Mon Sep 17 00:00:00 2001
From: iGor milhit <igor@milhit.ch>
Date: Sun, 19 Jan 2020 18:00:55 +0100
Subject: [PATCH] post info: improve punctuation and space usage

* NEW Uses pseudo-element to add trailing space and coma.
* NEW Uses flex options to improve space usage.

Co-Authored-by: Igor Milhit <igor@milhit.ch>
---
 assets/scss/_fonts.scss         |  2 +-
 assets/scss/_post.scss          | 14 ++++++++++++--
 layouts/partials/post-info.html |  4 ++--
 3 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/assets/scss/_fonts.scss b/assets/scss/_fonts.scss
index 4297e7c..1d80809 100644
--- a/assets/scss/_fonts.scss
+++ b/assets/scss/_fonts.scss
@@ -14,8 +14,8 @@ figure p,
 .footnote-ref,
 .main-footer,
 nav,
+.post-info,
 .posts-list footer {
   font-size: $font-size-small;
 }
 
-
diff --git a/assets/scss/_post.scss b/assets/scss/_post.scss
index f2c1cf6..2d9898d 100644
--- a/assets/scss/_post.scss
+++ b/assets/scss/_post.scss
@@ -12,18 +12,28 @@
 }
 
 .post-info {
-  font-size: 1rem;
   display: flex;
   flex-wrap: wrap;
   padding: 0;
   margin-top: 0;
+  > li {
+    padding-right: .5rem;
+  }
   li {
     list-style: none;
     display: flex;
-    padding-right: .5em;
     > ul {
       display: flex;
       padding: 0;
+      white-space: pre;
+    }
+    > ul:before {
+      content: " ";
+      white-space: pre;
     }
   }
 }
+
+.post-taxonomies + .post-taxonomies:before {
+  content: ", ";
+}
diff --git a/layouts/partials/post-info.html b/layouts/partials/post-info.html
index 337e1fa..ad81012 100644
--- a/layouts/partials/post-info.html
+++ b/layouts/partials/post-info.html
@@ -7,7 +7,7 @@
   <li>Catégories&#x202F;:
     <ul>
       {{ range . }}
-        <li><a href="{{ "categories" | absURL}}/{{ . | urlize }}">{{ . }}</a> </li>
+      <li class="post-taxonomies"> <a href="{{ "categories" | absURL}}/{{ . | urlize }}">{{ . }}</a> </li>
       {{ end }}
     </ul>
   </li>
@@ -16,7 +16,7 @@
   <li>Tags&#x202F;:
     <ul>
       {{ range . }}
-        <li> <a href="{{ "tags" | absURL }}/{{ . | urlize }}">{{ . }}</a> </li>
+        <li class="post-taxonomies"> <a href="{{ "tags" | absURL }}/{{ . | urlize }}">{{ . }}</a> </li>
       {{ end }}
     </ul>
   </li>