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

@@ -14,8 +14,8 @@ figure p,
 .footnote-ref,
 .main-footer,
 nav,
+.post-info,
 .posts-list footer {
   font-size: $font-size-small;
 }
 
-

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: ", ";
+}

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>