season volume is dynamic + make mobile width larger and desktop width…

… smaller
oulipoh · Mar 17, 2024 · 2dbd0a3 · 2dbd0a3
1 parent 29d1c3b
commit 2dbd0a3
Show file tree

Hide file tree

Showing 6 changed files with 23 additions and 9 deletions.
diff --git a/resen/media/resen.svg b/resen/media/resen.svg
diff --git a/resen/seasons/index.html b/resen/seasons/index.html
@@ -6,6 +6,7 @@
     <link rel="preload" href="../fonts/MiriamLibre-Regular.woff2" as="font" type="font/woff2" crossorigin>
     <link rel="preload" href="../fonts/DavidLibre-Medium.woff2" as="font" type="font/woff2" crossorigin>
     <link rel="stylesheet" href="../style.css">
+    <link rel="stylesheet" href="style.css">
     <script src="../pages.js"></script>
     <link rel="icon" href="../media/resen.svg">
     <meta property="og:image" content="https://oulipoh.com/resen/seasons/snippet">
@@ -67,6 +68,9 @@
     <p dir="ltr">
         The author thanks Yosefa Raz for her help with the English translation of this passage, and Almog Behar for his help in choosing the liturgical hymn.
     </p>
-    <script>make_footer()</script>
+    <script>
+        make_footer()
+        document.addEventListener('scroll', () => audio.volume = 1 - (scrollY|0)/(document.body.scrollHeight-innerHeight))
+    </script>
 </body>
 </html>
diff --git a/resen/seasons/media/arim.svg b/resen/seasons/media/arim.svg
diff --git a/resen/seasons/media/veen.svg b/resen/seasons/media/veen.svg
diff --git a/resen/seasons/style.css b/resen/seasons/style.css
@@ -0,0 +1,12 @@
+object {
+    display: block;
+    margin-inline: auto;
+    max-width: var(--media_width);
+}
+
+@media (max-width: 480px) {
+    object {
+        margin-inline: var(--anti_margin);
+        max-width: none;
+    }
+}
diff --git a/resen/style.css b/resen/style.css
@@ -1017,6 +1017,7 @@ a.sponsors {
     }
 }
 
+
 /* stuff for https://oulipoh.com/resen/ */
 
 header ~ :not(h2, footer) {
-Original file line number
+Diff line change
@@ Expand Up / @@ -1017,6 +1017,7 @@ a.sponsors { @@
         }
     }
     /* stuff for https://oulipoh.com/resen/ */
     header ~ :not(h2, footer) {
@@ Expand Down @@