WIP: use template to generate the individual share buttons

assets/css/bobastyle.css

@@ -198,22 +198,21 @@ video {
   max-width: 100%;
 }
 
-figure > .figure-media {
+.post-media > figure img,
+.post-media > figure video {
   padding: 5px;
-}
-
-figure > .figure-media.border {
-  border: 2px solid var(--figure-border);
-}
-
-.post-media > figure > .figure-media {
   border: 7px solid var(--figure-border);
 }
 
+figure img,
+figure video {
+  padding: 5px;
+  border: 2px solid var(--figure-border);
+}
+
 figure {
-  display: block;
-  text-align: center;
-  margin: 0;
+  margin: auto;
+  display: inline-block;
 }
 
 figcaption {

layouts/_partials/description-or-summary.html

@@ -0,0 +1,7 @@
+{{ with .Description }}
+    <p>{{ . | markdownify }}</p>
+{{ else }}
+    {{ with .Summary }}
+        {{ . }}
+    {{ end }}
+{{ end }}

layouts/_partials/embed-resource.html

@@ -3,9 +3,9 @@
        *       claims that images won't work with JS disabled since it would
        *       make tracking possible, but my experience says otherwise
        */}}
-    <img class="figure-media" src="{{ .Permalink }}" {{ with .Params.alt }}alt="{{ . }}"{{ end }} />
+    <img src="{{ .Permalink }}" {{ with .Params.alt }}alt="{{ . }}"{{ end }} />
 {{ else if eq .ResourceType "video" }}
-    <video class="figure-media" controls preload="metadata">
+    <video controls preload="metadata">
         {{ with .Params.alt }}
             {{ warnf "video does not support alt text, '%s'" . }}
         {{ end }}

layouts/_partials/pagination.html

@@ -1,6 +1,6 @@
 {{ if gt .Paginator.TotalPages 1 }}
     <nav class="pagination">
         {{/* https://github.com/gohugoio/hugo/blob/a88b488181279befd50e1d127f9f67604f2f9854/tpl/tplimpl/embedded/templates/_partials/pagination.html */}}
-        {{ partial "pagination-hugo.html" . }}
+        {{ partial "_internal/pagination.html" . }}
     </nav>
 {{ end }}

layouts/_partials/share.html

@@ -1,4 +1,22 @@
+{{ define "_partials/share-button.html" }}
+    <a class="{{ .ShortName }}-share"
+       target="_blank"
+       rel="noopener"
+       aria-label="{{ i18n (printf "aria_share_%s" .ShortName) }}"
+       onclick="share_event('{{ .ProperName }}');"
+       href="{{ .URL }}">
+        {{- partial "icon.html" (or .IconName .ShortName) -}}
+    </a>
+{{ end }}
+
 <div class="share-buttons">
+    {{ $services := dict
+        "twitter" (dict "ProperName" "Twitter" "URL" (printf "https://twitter.com/intent/tweet?url=%s&text=%s&via=bbaovanc" .Permalink .Title))
+    }}
+    {{ range $name, $info := $services }}
+        {{ $data := merge $info (dict "ShortName" $name) }}
+        {{ partial "share-button.html" $data }}
+    {{ end }}
     {{ if .Site.Params.shareButtons.twitter }}
         <a class="twitter-share"
            target="_blank"

layouts/authors/summary.html

@@ -5,11 +5,9 @@
 
 {{ partial "page-metadata/author.html" . }}
 
-{{ with .Summary }}
-    <div class="page-description">
-        {{ . }}
-    </div>
-{{ end }}
+<div class="page-description">
+    {{ partial "description-or-summary.html" . }}
+</div>
 
 <div class="readmore">
     <a href="{{ .Permalink }}">{{ i18n "read_more" }} &rarr;</a>

layouts/section.summary.html

@@ -5,10 +5,8 @@
             {{ .Title | markdownify }}
         </h2>
 
-        {{ with .Summary }}
-            <div class="section-description">
-                {{ . }}
-            </div>
-        {{ end }}
+        <div class="section-description">
+            {{ partial "description-or-summary.html" . }}
+        </div>
     </div>
 </a>

layouts/series/summary.html

@@ -6,11 +6,9 @@
 
 {{ partial "page-metadata/series.html" . }}
 
-{{ with .Summary }}
-    <div class="page-description">
-        {{ . }}
-    </div>
-{{ end }}
+<div class="page-description">
+    {{ partial "description-or-summary.html" . }}
+</div>
 
 <div class="page-list series-inner">
     {{ range .Data.Pages.Reverse }}

layouts/summary.html

@@ -8,11 +8,9 @@
 
 {{ partial "feature-figure.html" . }}
 
-{{ with .Summary }}
-    <div class="page-description">
-        {{ . }}
-    </div>
-{{ end }}
+<div class="page-description">
+    {{ partial "description-or-summary.html" . }}
+</div>
 
 <div class="readmore">
     <a href="{{ .Permalink }}">{{ i18n "read_more" }} &rarr;</a>

layouts/taxonomy.html

@@ -28,7 +28,7 @@
                             </a>
                             {{ partial "page-metadata/taxonomy.html" . }}
                         </div>
-                        {{ .Summary }}
+                        {{ partial "description-or-summary.html" . }}
                     </article>
                 {{ end }}
             {{ end }}