Improve styles, small fixes

3 files changed, 27 insertions, 16 deletions

diff --git a/main.scm b/main.scm
index 08d1377..cedc290 100644
--- a/main.scm
+++ b/main.scm
@@ -68,10 +68,12 @@
     (define alt (submatch m 1))
     (define link (submatch m 2))
 
-    ;; if link is absolute or external, leave as is.
+    ;; if link is absolute, external or in-page, leave as is.
     ;; otherwise, normalize it to the current directory context
     (define ret-link
-      (if (or (substring=? "https://" link) (substring=? "/" link))
+      (if (or (substring=? "https://" link)
+	      (substring=? "/" link)
+	      (substring=? "#" link))
 	  link
 	  ;; else
 	  (normalize-pathname (make-pathname cwd link))))
diff --git a/static/style.css b/static/style.css
index 43b6096..7f08d17 100644
--- a/static/style.css
+++ b/static/style.css
@@ -22,7 +22,7 @@ body {
     --dark--blockquote-color: #ccc;
     --dark--blockquote-bg-color: #60606020;
     --dark--code-bg-color: #353535;
-    --dark--em-bg-color: #bbf4;
+    --dark--h2-bg-color: #fd501bb0;
 
     --light--header-color: #1a1a1a;
     --light--p-color: #101010;
@@ -31,7 +31,7 @@ body {
     --light--blockquote-color: #606060;
     --light--blockquote-bg-color: #c8c8c820;
     --light--code-bg-color: #eee;
-    --light--em-bg-color: #f73e0030;
+    --light--h2-bg-color: #f73e0030;
 }
 
 @media (prefers-color-scheme: dark) {
@@ -43,7 +43,7 @@ body {
         --blockquote-color: var(--dark--blockquote-color);
         --blockquote-bg-color: var(--dark--blockquote-bg-color);
         --code-bg-color: var(--dark--code-bg-color);
-	--em-bg-color: var(--dark--em-bg-color);
+	--h2-bg-color: var(--dark--h2-bg-color);
     }
 }
 @media (prefers-color-scheme: light) {
@@ -55,7 +55,7 @@ body {
         --blockquote-color: var(--light--blockquote-color);
         --blockquote-bg-color: var(--light--blockquote-bg-color);
         --code-bg-color: var(--light--code-bg-color);
-	--em-bg-color: var(--light--em-bg-color);
+	--h2-bg-color: var(--light--h2-bg-color);
     }
 }
 
@@ -67,7 +67,7 @@ html.dark {
     --blockquote-color: var(--dark--blockquote-color);
     --blockquote-bg-color: var(--dark--blockquote-bg-color);
     --code-bg-color: var(--dark--code-bg-color);
-    --em-bg-color: var(--dark--em-bg-color);
+    --h2-bg-color: var(--dark--h2-bg-color);
 }
 
 html.light {
@@ -78,7 +78,7 @@ html.light {
     --blockquote-color: var(--light--blockquote-color);
     --blockquote-bg-color: var(--light--blockquote-bg-color);
     --code-bg-color: var(--light--code-bg-color);
-    --em-bg-color: var(--light--em-bg-color);
+    --h2-bg-color: var(--light--h2-bg-color);
 }
 
 html {
@@ -90,6 +90,12 @@ h1, h2, h3, h4, h5, h6 {
     color: var(--header-color);
 }
 
+h2, h4, h6 {
+    padding: 0 8px;
+    display: inline-block;
+    background-color: var(--h2-bg-color);
+}
+
 a, a:visited {
     color: var(--link-color);
     text-decoration: none;
@@ -201,11 +207,6 @@ li::marker {
     color: var(--link-color);
 }
 
-em {
-    padding: 0 2px;
-    background-color: var(--em-bg-color);
-}
-
 .webrings p {
     margin: 0 !important;
 }
diff --git a/template.html b/template.html
index dbc87b1..75d7a43 100644
--- a/template.html
+++ b/template.html
@@ -84,9 +84,15 @@ $endif$
   $endif$
   $endif$
 
-<main>
-$body$
-</main>
+  <main>
+    $if(slideshow)$
+    <blockquote data-unfold-hidden>
+      This post is a <a href="?unfold=1">literate slideshow</a>.
+    </blockquote>
+    $endif$
+
+    $body$
+  </main>
 
 <script>
 const b = document.createElement("button");
@@ -150,6 +156,7 @@ $endif$
   <p class="p-country-name">Finland</p>
 </div>
 
+$if(slideshow)$
 <script src="/static/reveal-unfold.js"></script>
 <style data-unfold-include>
   .reveal .slides {
@@ -160,6 +167,7 @@ $endif$
   theme: "black",
   revealCss: document.querySelector("[data-unfold-include]").innerHTML });
 </script>
+$endif$
 
 </body>
 </html>