fix overlapping text and other layout weirdness

make-pages/SinglePage.hs

@@ -154,11 +154,13 @@ make' root siteName prefix nsfw _dataDir dir
     <div class=page>
       <header>
         <h1>$title</h1>
-        $artistTag
         <h2 id=date class="right corner">
           $formattedDate $updateDate
         </h2>
-        <a class="left corner" href=$undir>back to gallery</a>
+        <h2 class="left corner">
+          $artistTag
+          <a href=$undir>back to gallery</a>
+        </h2>
       </header>
 
       $2.buttonBar
@@ -193,7 +195,7 @@ last' xs = if null xs then Nothing else Just $ last xs
 
 makeArtist :: Artist -> Builder
 makeArtist (Artist {name, url}) =
-  [b|<h2 id=artist class="left corner">by $artistLink</h2>|]
+  [b|by $artistLink <br>|]
  where
    artistLink = case url of
     Just u  -> [b|<a href="$u">$name</a>|]

style/shiny/single.css

@@ -96,10 +96,13 @@
 }
 
 #info figure {
-  width: min-content;
   margin: 0.25em auto;
 }
 
+#info figure img {
+  max-width: 100%;
+}
+
 #info .light-bg {
   background: hsl(0deg, 0%, 100%, 75%);
   padding: 5px;
@@ -109,6 +112,7 @@
 #info .floating {
   float: right;
   margin-left: 0.8em;
+  max-width: 40%;
 }
 
 #info .floating.left {