add .corner and .left/.right classes

make-pages/SinglePage.hs

@@ -40,7 +40,7 @@ make' nsfw (Info {date, title, artist, tags, nsfwTags,
     <header>
       <h1>$*title</h1>
       $artistTag
-      <h2 class=date>$formattedDate</h2>
+      <h2 id=date class="right corner">$formattedDate</h2>
       $buttonBar
     </header>
 
@@ -92,7 +92,7 @@ make' nsfw (Info {date, title, artist, tags, nsfwTags,
 
 makeArtist :: Artist -> Builder
 makeArtist (Artist {name, url}) =
-  [b|<h2 class=artist>by $artistLink</h2>|]
+  [b|<h2 id=artist class="left corner">by $artistLink</h2>|]
  where
    artistLink = case url of
     Just u  -> [b|<a href="$*u">$*name</a>|]

style/base.css

@@ -48,6 +48,18 @@ body {
   background: var(--lighter-tum);
 }
 
+.corner {
+  font-weight: 400;
+  position: absolute;
+  top: -0.5em;
+  margin: 0;
+  padding: 0;
+  font-size: 100%;
+}
+
+.left.corner { left: -0.4em; }
+.right.corner { right: -0.4em; }
+
 
 b { font-weight: 600; }
 b b { font-weight: 900; }

style/single.css

@@ -5,17 +5,9 @@ body {
   position: relative;
 }
 
-.date, .artist {
-  font-weight: 400;
-  position: absolute;
-  top: -0.5em;
-  margin: 0;
-  padding: 0;
-  font-size: 100%;
+#date, #artist {
   font-style: italic;
 }
-.date { right: -0.4em; }
-.artist { left: -0.4em; }
 
 #mainfig {
   justify-content: center;