From 0b4e9e92c3b08d2351d5525b4bfeb073ab6a3f83 Mon Sep 17 00:00:00 2001
From: Hannah Isopod <me@bathynomus.xyz>
Date: Tue, 17 Jun 2025 04:37:37 -0600
Subject: Dithered backgrounds - Downscaled & dithered background images for  
 enhanced Aesthetic and bandwidth savings of in   some cases two orders of
 magnitude - webgarden update - various other minor changes

---
 BACKGROUND_DITHER_COMMAND.txt           |   1 +
 about/bg_dither.png                     | Bin 0 -> 71045 bytes
 about/pronouns/bg_dither.png            | Bin 0 -> 63592 bytes
 bg_dither.png                           | Bin 0 -> 15409 bytes
 blog/bg_dither.png                      | Bin 0 -> 80296 bytes
 etc/bg_dither.png                       | Bin 0 -> 91214 bytes
 etc/quotes/bg_dither.png                | Bin 0 -> 13344 bytes
 greenhouse/bg_dither.png                | Bin 0 -> 80905 bytes
 greenhouse/index.php                    |   4 ++--
 guestbook/bg_dither.png                 | Bin 0 -> 94797 bytes
 links/bg_dither.png                     | Bin 0 -> 18602 bytes
 links/buttons/misor.png                 | Bin 0 -> 1330 bytes
 links/buttons/robophobia.gif            | Bin 0 -> 23193 bytes
 links/index.php                         |   8 +++++++-
 music/bg_dither.png                     | Bin 0 -> 60592 bytes
 nav.php                                 |   5 +++--
 stats/bg_dither.png                     | Bin 0 -> 40293 bytes
 stats/index.php                         |   4 ++++
 stuff/bg_dither.png                     | Bin 0 -> 36197 bytes
 stuff/webgarden/images/webgarden-bg.png | Bin 77765 -> 9629 bytes
 stuff/webgarden/index.php               |  33 +++++++++++++++++++-------------
 stuff/webgarden/style.css               |   2 +-
 style.css                               |   2 +-
 uses/bg_dither.png                      | Bin 0 -> 18710 bytes
 uses/compier/bg_dither.png              | Bin 0 -> 138707 bytes
 uses/cumulonimbus/bg_dither.png         | Bin 0 -> 89940 bytes
 uses/servy586/bg_dither.png             | Bin 0 -> 76876 bytes
 27 files changed, 39 insertions(+), 20 deletions(-)
 create mode 100644 BACKGROUND_DITHER_COMMAND.txt
 create mode 100644 about/bg_dither.png
 create mode 100644 about/pronouns/bg_dither.png
 create mode 100644 bg_dither.png
 create mode 100644 blog/bg_dither.png
 create mode 100644 etc/bg_dither.png
 create mode 100644 etc/quotes/bg_dither.png
 create mode 100644 greenhouse/bg_dither.png
 create mode 100644 guestbook/bg_dither.png
 create mode 100644 links/bg_dither.png
 create mode 100644 links/buttons/misor.png
 create mode 100644 links/buttons/robophobia.gif
 create mode 100644 music/bg_dither.png
 create mode 100644 stats/bg_dither.png
 create mode 100644 stuff/bg_dither.png
 create mode 100644 uses/bg_dither.png
 create mode 100644 uses/compier/bg_dither.png
 create mode 100644 uses/cumulonimbus/bg_dither.png
 create mode 100644 uses/servy586/bg_dither.png

diff --git a/BACKGROUND_DITHER_COMMAND.txt b/BACKGROUND_DITHER_COMMAND.txt
new file mode 100644
index 0000000..218c6a0
--- /dev/null
+++ b/BACKGROUND_DITHER_COMMAND.txt
@@ -0,0 +1 @@
+magick bg.jpg -resize 50% -ordered-dither o3x3 bg_dither.png
\ No newline at end of file
diff --git a/about/bg_dither.png b/about/bg_dither.png
new file mode 100644
index 0000000..34544c7
Binary files /dev/null and b/about/bg_dither.png differ
diff --git a/about/pronouns/bg_dither.png b/about/pronouns/bg_dither.png
new file mode 100644
index 0000000..9204c63
Binary files /dev/null and b/about/pronouns/bg_dither.png differ
diff --git a/bg_dither.png b/bg_dither.png
new file mode 100644
index 0000000..bca13e9
Binary files /dev/null and b/bg_dither.png differ
diff --git a/blog/bg_dither.png b/blog/bg_dither.png
new file mode 100644
index 0000000..4262604
Binary files /dev/null and b/blog/bg_dither.png differ
diff --git a/etc/bg_dither.png b/etc/bg_dither.png
new file mode 100644
index 0000000..4e47095
Binary files /dev/null and b/etc/bg_dither.png differ
diff --git a/etc/quotes/bg_dither.png b/etc/quotes/bg_dither.png
new file mode 100644
index 0000000..81cb571
Binary files /dev/null and b/etc/quotes/bg_dither.png differ
diff --git a/greenhouse/bg_dither.png b/greenhouse/bg_dither.png
new file mode 100644
index 0000000..841726e
Binary files /dev/null and b/greenhouse/bg_dither.png differ
diff --git a/greenhouse/index.php b/greenhouse/index.php
index 9455c22..d39534f 100644
--- a/greenhouse/index.php
+++ b/greenhouse/index.php
@@ -40,7 +40,7 @@
     <?php include($_SERVER['DOCUMENT_ROOT'] . '/seasonal.php'); ?>
   </head>
   <body>
-    <?php include($_SERVER['DOCUMENT_ROOT'] . '/nav.php'); bg(true, 10); ?>
+    <?php include($_SERVER['DOCUMENT_ROOT'] . '/nav.php'); bg(true); ?>
       <h1 style="overflow: hidden;">webgreenhouse</h1>
       <h2 id="caption">I'll be honest, I'm not sure some of these plants belong underwater...</h2>
       <div class="shelf">
@@ -48,7 +48,7 @@
         <div id="bodytext">
           <p style="margin-top: 0; margin-bottom: 0.85rem;">You've found my webgarden page! A <a href="https://webgardens.neocities.org/tutorial/" title="or pot, or bonsai">webgarden</a> is a mini&#8209;webpage that other people can embed in their websites, as defined by <a href="https://justbecaws.neocities.org/">Corv</a>. Here's the code for mine:</p>
           <textarea style="width: 100%; margin: 0; box-sizing: border-box;" rows="2" readonly>&lt;iframe src="https://isopod.cool/stuff/webgarden/" style="height: 250px; width: 250px;" scrolling="no" loading="lazy"&gt;&lt;/iframe&gt;</textarea>
-          <p>I'm afraid it probably won't be fully functional if you're on mobile, but then again this entire standard isn't really the most responsive thing in the world anyway.</p>
+          <p>It may or may not be fully functional if you're on mobile, but then again this entire standard isn't really the most responsive thing in the world anyway.</p>
         </div>
         <iframe src="https://lu.tiny-universes.net/webgarden/webgarden.html"      scrolling="no" loading="lazy"></iframe>
         <iframe src="https://obspogon.neocities.org/webgarden"                    scrolling="no" loading="lazy"></iframe>
diff --git a/guestbook/bg_dither.png b/guestbook/bg_dither.png
new file mode 100644
index 0000000..dda3944
Binary files /dev/null and b/guestbook/bg_dither.png differ
diff --git a/links/bg_dither.png b/links/bg_dither.png
new file mode 100644
index 0000000..21f7493
Binary files /dev/null and b/links/bg_dither.png differ
diff --git a/links/buttons/misor.png b/links/buttons/misor.png
new file mode 100644
index 0000000..eebd2ec
Binary files /dev/null and b/links/buttons/misor.png differ
diff --git a/links/buttons/robophobia.gif b/links/buttons/robophobia.gif
new file mode 100644
index 0000000..6b801f8
Binary files /dev/null and b/links/buttons/robophobia.gif differ
diff --git a/links/index.php b/links/index.php
index 48dfafd..17040fa 100644
--- a/links/index.php
+++ b/links/index.php
@@ -6,6 +6,11 @@
     <title>Links</title>
     <link href="../style.css" rel="stylesheet" type="text/css" media="all">
     <?php include($_SERVER['DOCUMENT_ROOT'] . '/seasonal.php'); ?>
+    <style>
+      #leftsidebg, #rightsidebg {
+        image-rendering: pixelated;
+      }
+    </style>
   </head>
   <body>
     <?php include($_SERVER['DOCUMENT_ROOT'] . '/nav.php'); bg(true, 1000, "Pictured: My home internet connection") ?>
@@ -21,7 +26,7 @@
             <a href="https://kalechips.net/"><img src="buttons/kalechips.png" alt="Kalechips"></a>
             <a href="https://the64thsanctum.net/"><img src="buttons/64thsanctum.gif" alt="64th Sanctum"></a>
             <a href="https://sadgrl.online/"><img src="buttons/sadgrl.gif" alt="Sadgrl"></a>
-            <a href="https://robophobia.neocities.org/"><img src="buttons/robophobia.png" alt="Robophobia"></a>
+            <a href="https://robophobia.neocities.org/"><img src="buttons/robophobia.gif" alt="Robophobia"></a>
             <a href="https://forum.melonland.net/"><img src="buttons/melonland-forum.gif" alt="Melonland Forum"></a>
             <a href="https://sizeof.cat/"><img src="buttons/sizeofcat.png" alt="Size of Cat"></a>
             <a href="https://moth.monster/"><img src="buttons/moth-88x31.svg" alt="Moth Dot Monster"></a>
@@ -29,6 +34,7 @@
             <a href="https://xaselgio.net/"><img src="buttons/xaselgio.gif" alt="Indigo's den"></a>
             <a href="https://maia.crimew.gay/"><img src="buttons/crimew.png" alt="maia.crimew.gay"></a>
             <iframe src="https://baccyflap.com/mus/ti/ti.php" style="width:88px;height:31px" scrolling="no" frameborder="0" style="border: none;" cellspacing="0"></iframe>
+            <a href="https://midnightsolarium.nekoweb.org/home"><img src="buttons/misor.png" alt="Midnight Solarium"></a>
           </div>
         </td>
       </tr>
diff --git a/music/bg_dither.png b/music/bg_dither.png
new file mode 100644
index 0000000..2a31da7
Binary files /dev/null and b/music/bg_dither.png differ
diff --git a/nav.php b/nav.php
index 88a0417..dbd1589 100644
--- a/nav.php
+++ b/nav.php
@@ -2,7 +2,7 @@
 
 function bg($rightside = false, $dfs = 1000, $title = null) {
   $cpath = preg_replace("/\/[^\/]*$/", "", $_SERVER['REQUEST_URI']);
-  $output = "<div style='--bgimg: url(\"$cpath/bg.jxl\"), url(\"$cpath/bg.jpg\");";
+  $output = "<div style='--bgimg: url(\"$cpath/bg_dither.png\")/*, url(\"$cpath/bg.jxl\"), url(\"$cpath/bg.jpg\")*/;";
   if($dfs < 100) {
     $output = $output." --distancefromcenter: $dfs%;'"; }
   else {
@@ -147,6 +147,7 @@ if(!preg_match('/(headless.*)/i', $_SERVER['HTTP_USER_AGENT'])) {
         '<a href="/stuff/beat/">@'.date("B").'</a>',
         '<a href="https://www.youtube.com/watch?v=N14uA0EhBAU">coke and fries halo</a>',
         'Check it out, I\'m in the <span class="house">house</span> like carpet',
+        'Ordered dithering!',
         'COUNTER',
         'TUEADAY',
         'PLACEHIM',
@@ -196,7 +197,7 @@ function echolink($url, $name) {
 ?>
 <header>
   <div id="header-content">
-    <h2>isopod dot cool<sup>v3.1.1</sup></h2>
+    <h2>isopod dot cool<sup>v3.2</sup></h2>
     <p><?php echo($cap); ?></p>
   </div>
   <nav id='main-nav'>
diff --git a/stats/bg_dither.png b/stats/bg_dither.png
new file mode 100644
index 0000000..1611b8d
Binary files /dev/null and b/stats/bg_dither.png differ
diff --git a/stats/index.php b/stats/index.php
index a0373fc..16a0584 100644
--- a/stats/index.php
+++ b/stats/index.php
@@ -33,6 +33,10 @@
           <td>Height</td>
           <td>194cm</td>
         </tr>
+        <tr>
+          <td>Social Insurance Number</td>
+          <td>69</td>
+        </tr>
         <tr>
           <td>Storage space</td>
           <td>47TiB</td>
diff --git a/stuff/bg_dither.png b/stuff/bg_dither.png
new file mode 100644
index 0000000..070f692
Binary files /dev/null and b/stuff/bg_dither.png differ
diff --git a/stuff/webgarden/images/webgarden-bg.png b/stuff/webgarden/images/webgarden-bg.png
index f6052e8..3e34cba 100644
Binary files a/stuff/webgarden/images/webgarden-bg.png and b/stuff/webgarden/images/webgarden-bg.png differ
diff --git a/stuff/webgarden/index.php b/stuff/webgarden/index.php
index af88805..0f1d2d4 100644
--- a/stuff/webgarden/index.php
+++ b/stuff/webgarden/index.php
@@ -59,7 +59,7 @@
     <link href="style.css" rel="stylesheet" type="text/css" media="all">
     <style type="text/css">
       :root {
-        --top-header-gap: 90px;
+        --top-header-gap: 64px;
         --menuwidth: 140px;
       }
       html, body {
@@ -67,17 +67,23 @@
         margin: 0;
       }
       h1 {
-        width: 250px;
+        width: 224px;
         position: absolute;
         top: var(--top-header-gap);
-        text-align: center;
+        left: 6px;
+        font-family: b612_mono, monospace;
+        border-left: 3px solid gainsboro;
+        padding-left: 6px;
       }
       h2 {
-        width: 238px;
+        width: 212px;
         position: absolute;
-        top: calc(34px + var(--top-header-gap));
-        text-align: right;
+        top: calc(45px + var(--top-header-gap));
+        left: 6px;
         font-size: 1.1em;
+        font-family: b612_mono, monospace;
+        border-left: 3px solid gainsboro;
+        padding-left: 6px;
       }
       #mainmenu {
         background: #222222;
@@ -86,13 +92,14 @@
         width: var(--menuwidth);
         position: absolute;
         top: 0;
-        left: 250px;
+        left: 224px;
         z-index: 2;
         box-shadow: 0 0 0 black;
         display: flex;
         flex-direction: column;
         align-items: center;
         justify-content: center;
+        box-shadow: 0 0 8px black;
       }
       body:hover #mainmenu {
         left: calc(250px - var(--menuwidth));
@@ -153,8 +160,8 @@
         91%{color: rgb(255,0,127); text-shadow: 0 0 4px rgb(211, 0, 105);}
       }
       @keyframes arrowwiggle {
-        0%,90%,100% {left: 235px;}
-        92% {left: 231px;}
+        0%,90%,100% { transform: translateX(0); }
+        92% {transform: translateX(-4px);}
       }
       audio {
         display: none;
@@ -166,12 +173,12 @@
   </head>
   <body>
     <a target="_blank" href="../../">
-      <div id="plant" style="background: url('images/webgarden-bg.png');">
+      <div id="plant" style="background: url('images/webgarden-bg.png'); background-size: cover;">
         <h1>isopod.cool</h1>
         <h2><?php echo $cap; ?></h2>
-        <img src="../../images/autoisopod_small.png" style="width: 70px; position: absolute; transform: scaleX(-1) rotate(-30deg); top: 188px; left: 170px;" />
+        <img src="../../images/autoisopod_small.png" style="width: 70px; position: absolute; transform: scaleX(-1) rotate(-30deg); top: 188px; left: 144px;" />
         <img src="images/bubblecolumn1.gif" style="height: 250px; position: absolute; left: 20px; top: 0;" />
-        <span id="hoverme">&lt;<span>
+        <span id="hoverme">&lt;</span>
       </div>
     </a>
     <input type="checkbox" id="mus" name="mus" style="display: none;"></input>
@@ -181,7 +188,7 @@
       <hr style="width: 30px;">
       <a href="image1.html">images</a>
       <a href="status.php">status</a>
-      <label for="mus"><a style="text-decoration: underline; cursor: pointer;">play music</a></label>
+      <label for="mus"><a style="text-decoration: underline; cursor: pointer;">song</a></label>
       <hr style="width: 30px;">
       <iframe src="https://isopod.cool/stuff/beat/frame.php?theme=pixel" style="width: 84px; height: 27px;"></iframe>
       <img src="/etc/buttons/isopodhours.png" alt="isopod hours"/>
diff --git a/stuff/webgarden/style.css b/stuff/webgarden/style.css
index 13c5320..0599032 100644
--- a/stuff/webgarden/style.css
+++ b/stuff/webgarden/style.css
@@ -45,7 +45,7 @@ a#forward, a#back, h1, h2, #hoverme {
 #hoverme {
   position: absolute;
   top: 4px;
-  left: 235px; 
+  left: 209px; 
   animation-name: arrowwiggle;
   animation-duration: 6s;
   animation-iteration-count: infinite;
diff --git a/style.css b/style.css
index cad5980..a726813 100644
--- a/style.css
+++ b/style.css
@@ -141,7 +141,7 @@ body > a {
 
 /* Background image type beat */
 #leftsidebg, #rightsidebg {
-  --bgimg: url(/bg.jxl), url(/bg.jpg);
+  --bgimg: url(/bg_dither.png)/*, url(/bg.jxl), url(/bg.jpg)*/;
   background-image: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06)), var(--bgimg);
   background-size: 100% 2px, 3px 100%, cover, cover, cover, cover;
   background-repeat: repeat;
diff --git a/uses/bg_dither.png b/uses/bg_dither.png
new file mode 100644
index 0000000..73feeae
Binary files /dev/null and b/uses/bg_dither.png differ
diff --git a/uses/compier/bg_dither.png b/uses/compier/bg_dither.png
new file mode 100644
index 0000000..6d4d7ae
Binary files /dev/null and b/uses/compier/bg_dither.png differ
diff --git a/uses/cumulonimbus/bg_dither.png b/uses/cumulonimbus/bg_dither.png
new file mode 100644
index 0000000..9f37d68
Binary files /dev/null and b/uses/cumulonimbus/bg_dither.png differ
diff --git a/uses/servy586/bg_dither.png b/uses/servy586/bg_dither.png
new file mode 100644
index 0000000..5632139
Binary files /dev/null and b/uses/servy586/bg_dither.png differ
-- 
cgit v1.2.3