mason/dhandler, static/tgal.css: Use `figure' and `figcaption' elements.

diff --git a/mason/dhandler b/mason/dhandler
index 887bd59..13731e1 100755 (executable)
--- a/mason/dhandler
+++ b/mason/dhandler
@@ -238,22 +238,22 @@ Failed to find &lsquo;<% $path |h %>&rsquo;.
 % if (defined $img) { $tn = scaled "thumb", $img; }
 % else { $tn = "$STATICURL/folder.svg"; }
 % if ($focus) {
-  <div class=thumb id=focusthumb>
+  <figure class=thumb id=focusthumb>
     <img class=thumb src="<% $tn |u %>">
-    <div class=caption><span class=name><% $caption %></span></div>
+    <figcaption><span class=name><% $caption %></span></figcaption>
 % } else {
-  <div class=thumb>
+  <figure class=thumb>
     <a class=thumb href="<% $target |u %>">
       <img class=thumb src="<% $tn |u %>">
-      <div class=caption>
+      <figcaption>
        <span class=name><% $caption %></span>
 % if (defined $comment) {
        <span class=comment><% $comment %></span>
 % }
-      </div>
+      </figcaption>
     </a>
 % }
-  </div>
+  </figure>
 %
 <%args>
        $target

diff --git a/static/tgal.css b/static/tgal.css
index efb8220..de367ed 100644 (file)
--- a/static/tgal.css
+++ b/static/tgal.css
@@ -80,7 +80,7 @@ div.gallery {
        text-align: center;
 }
 
-div.thumb {
+figure.thumb {
        display: inline-block;
        vertical-align: top;
        width: 228px;
@@ -103,12 +103,12 @@ div.comment {
        margin-top: 2ex; margin-bottom: 2ex;
 }
 
-div.caption {
+figure.thumb figcaption {
        display: block;
        width: 228px;
 }
-div.caption span.name { font-family: sans-serif; }
-div.caption span.comment { font-style: italic; margin-inline-start: 1em; }
+figcaption span.name { font-family: sans-serif; }
+figcaption span.comment { font-style: italic; margin-inline-start: 1em; }
 
 div.viewnav {
        flex-grow: 1; flex-basis: 0;