Remove make figure images centered and remove border

Also use a generic .figure-media class instead of manually specifying
both img and video in the CSS

Fixes #36 and a draft issue

assets/css/bobastyle.css

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

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 src="{{ .Permalink }}" {{ with .Params.alt }}alt="{{ . }}"{{ end }} />
+    <img class="figure-media" src="{{ .Permalink }}" {{ with .Params.alt }}alt="{{ . }}"{{ end }} />
 {{ else if eq .ResourceType "video" }}
-    <video controls preload="metadata">
+    <video class="figure-media" controls preload="metadata">
         {{ with .Params.alt }}
             {{ warnf "video does not support alt text, '%s'" . }}
         {{ end }}