make buttonbar class

make-pages/SinglePage.hs

@@ -39,6 +39,8 @@ make' nsfw dir (Info {date, title, artist, tags, nsfwTags,
     <link rel=stylesheet href=/style/shiny/single.css title=shiny>
     <link rel='alternate stylesheet' href=/style/tum/single.css title=tummy>
 
+    <script async src=/script/single.js></script>
+
     $0.prefetches
 
     <title>$*title</title>
@@ -47,10 +49,9 @@ make' nsfw dir (Info {date, title, artist, tags, nsfwTags,
       <h1>$*title</h1>
       $artistTag
       <h2 id=date class="right corner">$formattedDate</h2>
-      $buttonBar
     </header>
 
-    <script async src=/script/single.js></script>
+    $buttonBar
 
     <main>
       <figure id=mainfig>
@@ -130,17 +131,17 @@ makeButtonBar title images =
   case length images of
     0 -> throw $ NoEligibleImages title
     1 -> ""
-    _ -> [b|@2
-      <nav class=alts>
-        <ul id=altlist>
-          $6.alts
+    _ -> [b|@0
+      <nav id=alts>
+        <ul class="buttonbar choice">
+          $4.alts
         </ul>
       </nav>
       |]
  where alts = map (uncurry altButton) $ zip [0..] images
 
 altButton :: Int -> Image -> Builder
-altButton i (Image {label, path, nsfw, warning}) = [b|@6
+altButton i (Image {label, path, nsfw, warning}) = [b|@4
   <li$nsfwClass>
     <input type=radio$checked id="$idLabel" name=variant
            autocomplete=off value="$@path'"
@@ -166,7 +167,7 @@ makeTags nsfw sfwTags nsfwTags =
   if null tags then "" else [b|@4
     <section class=tags>
       <h2>tags</h2>
-      <ul>
+      <ul class=buttonbar>
         $8.tagList
       </ul>
     </section>
@@ -181,7 +182,7 @@ extLinks nsfw allLinks =
   if null links then "" else [b|@4
     <section class=links>
       <h2>links</h2>
-      <ul>
+      <ul class=buttonbar>
         $8.linkList
       </ul>
     </section>