minor fixes

layouts/_default/single.html

@@ -7,10 +7,11 @@
         {{partial "header" .}}
         {{partial "banner-item" .}}
         <main>
-            {{partial "metadata" .}}
             <article>
                 {{.Content}}
             </article>
+
+            {{partial "metadata" .}}
             <hr>
             {{ partial "related" .}}
         </main>

layouts/partials/metadata.html

@@ -1,27 +1,20 @@
-<section class="metadata">
+<section class="metadata" id="metadata">
         {{$author := index .Site.Data.details.staff (.Params.author | default "default")}}
  
-            <div><a href="{{$author.url}}"><img src="{{$author.image}}" style="max-width:64px;border-radius:64px;"></a>
+            <div style="flex-direction: row;"><a href="{{$author.url}}"><img src="{{$author.image}}" style="max-width:64px;border-radius:64px;"></a>
                 <h2>{{$author.name}}</h2>
                 {{if .Date }}
-            <p style="width:100%;"><strong>Published:</strong> {{.Date | time.Format "Jan 02 2006"}}
+            </div>
+            <p><strong>Published:</strong> <a href="{{.Permalink}}#metadata">{{.Date | time.Format "Jan 02 2006"}}</a>
                 {{end}}
                 {{if .Params.updated}}
                 <br><strong>Updated:</strong> {{.Params.updated | time.Format "Jan 02 2006"}}
+                {{end}}<br/><br/>
+            {{if .GetTerms "tags"}}
+            <strong>Tags:</strong>
+            {{ range (.GetTerms "tags")}}
+            <a href="{{.Permalink}}" class="tag">{{.LinkTitle}}</a>
+            {{end}}
             {{end}}
             </p>
-        </div>
-                {{if .GetTerms "tags"}}
-                <div id="tags">
-                    {{ range (.GetTerms "tags")}}
-                <a href="{{.Permalink}}" class="tag">
-        
-                    <svg class="icon">
-                        <use href="#tag"></use>
-                    </svg><span>
-                        {{.LinkTitle}}</span></a>
-                {{end}}
-                </div>
-                {{end}}
-            </div>
 </section>

static/css/theme.css

@@ -160,27 +160,20 @@ audio {
     display: flex;
     flex-direction: row;
     align-items: center;
-    justify-content: center;
+    justify-content: flex-start;
-    width:100%;
+    width:90%;
     flex-wrap: wrap;
+    margin-top:1rem;
 }
-
+.metadata>*{
-.metadata>* {
+    margin:5px;
-    margin: 1rem;
-    display: flex;
-    flex-direction: row;
-    flex-wrap: wrap;
-    align-items: center;
-    align-items: center;
-    min-width: 30%;
-    max-width:50%;
 }
-.metadata #tags{
+.metadata>div>*{
-    flex-direction: row;
+    margin:5px;
+}
+#tags {
+max-width:30rem;
 }
-
-
-
 
 header {
     text-align: center;
@@ -482,31 +475,6 @@ video {
 }
 
 
-#tags {
-    display: flex;
-    flex-direction: row;
-    flex-wrap: wrap;
-    justify-content: center;
-    align-items: center;
-}
-
-#tags>a {
-    margin: 5px;
-    padding:10px;
-    border-radius: 50px;
-    font-size:12px;
-    font-weight: bold;
-    background-color: var(--theme-color-primary);
-    color: var(--theme-accent);
-    font-weight: bolder;
-    display:flex;
-    flex-direction: row;
-    align-items: center;
-}
-#tags>a>*{
-    margin:5px;
-}
-
 .gallery {
     display: flex;
     flex-direction: row;