move tags to the top; use ¶ for anchor symbol

assets/css/common/post-single.css

@@ -18,11 +18,13 @@
 
 .post-meta,
 .breadcrumbs {
-    color: var(--secondary);
+    font-size: 15px;
-    font-size: 14px;
     display: flex;
     flex-wrap: wrap;
 }
+.post-meta * {
+    color: var(--secondary);
+}
 
 .post-meta ul {
     margin: 0;
@@ -39,6 +41,20 @@
     margin-inline-end: .5em;
 }
 
+.post-tags a:hover {
+    color: var(--primary);
+}
+.post-tags a:not(:last-of-type) {
+    margin-inline-end: .3em;
+}
+.post-tags a:not(:last-of-type):after {
+    content: ",";
+}
+.post-tags a:before {
+    content: "#";
+    margin-inline-end: 2px;
+}
+
 .breadcrumbs a {
     font-size: 16px;
 }
@@ -92,7 +108,7 @@
 }
 .post-content a.anchor:hover {
     color: var(--primary);
-    box-shadow: 0 -2px 0 var(--secondary) inset;
+    box-shadow: 0 2px 0 var(--secondary);
 }
 
 .post-content a code {
@@ -112,6 +128,9 @@ h5 .anchor,
 h6 .anchor {
     box-shadow: none;
     user-select: none;
+    font-size: .8em;
+    position: relative;
+    top: -2px;
 }
 
 h1:hover .anchor,
@@ -374,13 +393,6 @@ h6:hover .anchor {
     margin-top: 56px;
 }
 
-.post-tags li {
-    display: inline-block;
-    margin-inline-end: 3px;
-    margin-bottom: 5px;
-}
-
-.post-tags a,
 .share-buttons,
 .paginav {
     border-radius: var(--radius);
@@ -388,17 +400,6 @@ h6:hover .anchor {
     border: 1px solid var(--border);
 }
 
-.post-tags a {
-    display: block;
-    padding-inline-start: 14px;
-    padding-inline-end: 14px;
-    color: var(--secondary);
-    font-size: 14px;
-    line-height: 34px;
-    background: var(--code-bg);
-}
-
-.post-tags a:hover,
 .paginav a:hover {
     background: var(--border);
 }

layouts/_default/single.html

@@ -14,6 +14,20 @@
     {{- end }}
     {{- if not (.Param "hideMeta") }}
     <div class="post-meta">
+      {{- if not .Date.IsZero -}}
+        <span>{{ .Date | time.Format (default "January 2, 2006" site.Params.DateFormat) }}</span>
+        <span class="delimiter">&nbsp;·&nbsp;</span>
+      {{- end }}
+
+      {{- if .Params.tags }}
+        <span class="post-tags">
+          {{- range ($.GetTerms "tags") -}}
+          <a href="{{ .Permalink }}">{{ .LinkTitle }}</a>
+          {{- end -}}
+        </span>
+        <span class="delimiter">&nbsp;·&nbsp;</span>
+      {{- end }}
+
       {{- partial "post_meta.html" . -}}
       {{- partial "translation_list.html" . -}}
       {{- partial "edit_post.html" . -}}
@@ -36,13 +50,6 @@
   {{- end }}
 
   <footer class="post-footer">
-    {{- if .Params.tags }}
-    <ul class="post-tags">
-      {{- range ($.GetTerms "tags") }}
-      <li><a href="{{ .Permalink }}">{{ .LinkTitle }}</a></li>
-      {{- end }}
-    </ul>
-    {{- end }}
     {{- if (.Param "ShowPostNavLinks") }}
     {{- partial "post_nav_links.html" . }}
     {{- end }}

layouts/partials/anchored_headings.html

@@ -1,2 +1,2 @@
 {{- /* formats .Content headings by adding an anchor */ -}}
-{{ . | replaceRE "(<h[1-6] id=\"([^\"]+)\".+)(</h[1-6]+>)" "${1}<a hidden class=\"anchor\" aria-hidden=\"true\" href=\"#${2}\">#</a>${3}" | safeHTML }}
+{{ . | replaceRE "(<h[1-6] id=\"([^\"]+)\".+)(</h[1-6]+>)" "${1}<a hidden class=\"anchor\" aria-hidden=\"true\" href=\"#${2}\">¶</a>${3}" | safeHTML }}

layouts/partials/post_meta.html

@@ -1,15 +1,11 @@
 {{- $scratch := newScratch }}
 
-{{- if not .Date.IsZero -}}
+{{- if (.Param "ShowWordCount") -}}
-{{- $scratch.Add "meta" (slice (printf "<span title='%s'>%s</span>" (.Date) (.Date | time.Format (default "January 2, 2006" site.Params.DateFormat)))) }}
+{{- $scratch.Add "meta" (slice (i18n "words" .WordCount | default (printf "%d words" .WordCount))) -}}
 {{- end }}
 
 {{- if (.Param "ShowReadingTime") -}}
-{{- $scratch.Add "meta" (slice (i18n "read_time" .ReadingTime | default (printf "<span>%d min</span>" .ReadingTime))) }}
+{{- $scratch.Add "meta" (slice (i18n "read_time" .ReadingTime | default (printf "%d min" .ReadingTime))) -}}
-{{- end }}
-
-{{- if (.Param "ShowWordCount") -}}
-{{- $scratch.Add "meta" (slice (i18n "words" .WordCount | default (printf "<span>%d words</span>" .WordCount))) }}
 {{- end }}
 
 {{- if (.Param "ShowAuthor") -}}
@@ -19,5 +15,10 @@
 {{- end }}
 
 {{- with ($scratch.Get "meta") }}
-{{- delimit . "<span class=\"delimiter\">&nbsp;·&nbsp;</span>" -}}
+{{ range $i, $e := . }}
+{{ if $i }}
+<span class="delimiter">&nbsp;·&nbsp;</span>
+{{ end }}
+<span>{{ $e  }}</span>
+{{- end -}}
 {{- end -}}