From 694836dbc7c37072d108adb3e0649ba81cacd092 Mon Sep 17 00:00:00 2001
From: Zoe <ZoeOosting@outlook.com>
Date: Fri, 15 Apr 2022 21:22:33 +0200
Subject: [PATCH] build new version

---
 public/about/index.html             |  70 +++--
 public/categories/index.html        |  46 +--
 public/categories/index.xml         |   2 +-
 public/index.html                   |  73 +++--
 public/index.xml                    |  63 ++--
 public/js/headings.js               |  13 +
 public/js/main.js                   |  36 +++
 public/links/buddies/index.html     |  94 ++++++
 public/links/contact/index.html     |  63 ++++
 public/links/index.html             |  85 +++--
 public/links/index.xml              |  41 +++
 public/links/nice_things/index.html |  74 +++++
 public/music/index.html             |  59 ++++
 public/music/index.xml              |  11 +
 public/posts/index.html             |  56 ++--
 public/posts/index.xml              |  26 +-
 public/scss/main.css                | 461 ++++++++++++++++++++++++++--
 public/sitemap.xml                  |  36 ++-
 public/software/index.html          |  53 ++++
 public/software/index.xml           |  11 +
 public/tags/index.html              |  46 +--
 public/tags/index.xml               |   2 +-
 22 files changed, 1169 insertions(+), 252 deletions(-)
 create mode 100644 public/js/headings.js
 create mode 100644 public/js/main.js
 create mode 100644 public/links/buddies/index.html
 create mode 100644 public/links/contact/index.html
 create mode 100644 public/links/index.xml
 create mode 100644 public/links/nice_things/index.html
 create mode 100644 public/music/index.html
 create mode 100644 public/music/index.xml
 create mode 100644 public/software/index.html
 create mode 100644 public/software/index.xml
diff --git a/public/about/index.html b/public/about/index.html
index 3888079..2d26d37 100644
--- a/public/about/index.html
+++ b/public/about/index.html
@@ -1,19 +1,38 @@
 <!DOCTYPE html>
-<html><head>
+<html lang="en"><head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>About</title>
+    <title>about</title>
     
     
     <link rel="stylesheet" href="/scss/main.css">
     <link rel="icon" type="image/x-icon" href="/svg/favicon.svg">
 </head>
-<body><div id="content">
+<body class="colorswitch"><div id="content">
 <section id="main">
-  <h1 id="title">Single Page About</h1>
+  <div class="titlecontainer">
+  <h1 id="title" class="colorswitch">about</h1>
+  </div>
   <div>
-        <article id="content">
-           
+        <article id="content" class="colorswitch">
+           <h2 id="this-site" class="colorswitch">
+    <a class="hash-link colorswitch" href="#this-site">
+    &nbsp;this site
+    </a>
+</h2>
+<p>this site was made in hugo and uses its own theme that was made from scratch!
+the source code for <a href="https://git.kittycat.homes/zoe/hugo-batsite">the site</a> and <a href="https://git.kittycat.homes/zoe/hugo-battheme">theme</a> is available on <a href="https://git.kittycat.homes">git</a>.
+its fine to use anything from here for personal use!
+this site also uses <a href="https://www.nerdfonts.com/font-downloads">nerdfonts caskaydia code</a> and the <a href="https://lospec.com/palette-list/final-8">final 8 color palette</a>.</p>
+<h2 id="me" class="colorswitch">
+    <a class="hash-link colorswitch" href="#me">
+    &nbsp;me
+    </a>
+</h2>
+<p>hi i&rsquo;m zoe (she/her, fae/faer, they/them) whats up.
+tech tip: you can find out more about me by looking at this website<br>
+i&rsquo;m also trans and gay and queer :)</p>
+
         </article>
   </div>
 </section>
@@ -23,32 +42,33 @@
     </section>
     
     
-    </div>
-    <div>
-        
-        
-          <a class="next" href="http://example.org/links/">next: Links</a>
-        
     </div>
 </aside>
-
-        </div><footer>
-<div id="footer-center">
-<nav id="footer-nav">
+</div><footer class="colorswitch">
+<span id="footer-left"></span>
+<span id="footer-center">
+<nav id="footer-nav" aria-label="navigation">
     
     
-    <a class="footer-nav-item" href="/" title=""> home</a>
+    <a class="footer-nav-item colorswitch" href="/" title="home"></a>
     
-    <a class="footer-nav-item active" href="/about/" title="About"> about</a>
+    <a class="footer-nav-item active colorswitch" href="/about/" title="about"></a>
     
-    <a class="footer-nav-item" href="/links/" title="Links"> links</a>
+    <a class="footer-nav-item colorswitch" href="/links/" title="links"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/music/" title="music"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/software/" title="software"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/posts/" title="posts">龎</a>
     
 </nav>
-</div>
-<div id="footer-right">
-    <input type="checkbox" id="darkmode-toggle">
-</div>
+</span>
+<span id="footer-right">
+        <input type="checkbox" id="darkmode-toggle" aria-label="darkmode toggle" class="toggleinput">
+        <label class="togglelabel colorswitch" for="darkmode-toggle" aria-label="darkmode toggle" role="checkbox"></label>
+</span>
 </footer>
-<script src="/js/darkmode.js"></script>
-</body>
+<script src="/js/main.js"></script>
+  </body>
 </html>
diff --git a/public/categories/index.html b/public/categories/index.html
index b34f18f..e0abc0f 100644
--- a/public/categories/index.html
+++ b/public/categories/index.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html><head>
+<html lang="en"><head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>Categories</title>
@@ -8,38 +8,46 @@
     <link rel="stylesheet" href="/scss/main.css">
     <link rel="icon" type="image/x-icon" href="/svg/favicon.svg">
 </head>
-<body><div id="content">
+<body class="colorswitch"><div id="content">
 <main>
     <article>
-        <header>
-            <h1>List - Categories</h1>
+        <header class="colorswitch">
+            <h1 id="title">Categories</h1>
         </header>
         
         
     </article>
-    <ul>
+    <div id="pagelist">
     
     
-    </ul>
+    </div>
+    </div>
 </main>
-
-        </div><footer>
-<div id="footer-center">
-<nav id="footer-nav">
+</div><footer class="colorswitch">
+<span id="footer-left"></span>
+<span id="footer-center">
+<nav id="footer-nav" aria-label="navigation">
     
     
-    <a class="footer-nav-item" href="/" title=""> home</a>
+    <a class="footer-nav-item colorswitch" href="/" title="home"></a>
     
-    <a class="footer-nav-item" href="/about/" title="About"> about</a>
+    <a class="footer-nav-item colorswitch" href="/about/" title="about"></a>
     
-    <a class="footer-nav-item" href="/links/" title="Links"> links</a>
+    <a class="footer-nav-item colorswitch" href="/links/" title="links"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/music/" title="music"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/software/" title="software"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/posts/" title="posts">龎</a>
     
 </nav>
-</div>
-<div id="footer-right">
-    <input type="checkbox" id="darkmode-toggle">
-</div>
+</span>
+<span id="footer-right">
+        <input type="checkbox" id="darkmode-toggle" aria-label="darkmode toggle" class="toggleinput">
+        <label class="togglelabel colorswitch" for="darkmode-toggle" aria-label="darkmode toggle" role="checkbox"></label>
+</span>
 </footer>
-<script src="/js/darkmode.js"></script>
-</body>
+<script src="/js/main.js"></script>
+  </body>
 </html>
diff --git a/public/categories/index.xml b/public/categories/index.xml
index e70e044..b7895f5 100644
--- a/public/categories/index.xml
+++ b/public/categories/index.xml
@@ -5,6 +5,6 @@
     <link>http://example.org/categories/</link>
     <description>Recent content in Categories on batsite</description>
     <generator>Hugo -- gohugo.io</generator>
-    <language>en-us</language><atom:link href="http://example.org/categories/index.xml" rel="self" type="application/rss+xml" />
+    <language>eng</language><atom:link href="http://example.org/categories/index.xml" rel="self" type="application/rss+xml" />
   </channel>
 </rss>
diff --git a/public/index.html b/public/index.html
index e7de65e..553ddf0 100644
--- a/public/index.html
+++ b/public/index.html
@@ -1,41 +1,68 @@
 <!DOCTYPE html>
-<html><head>
-	<meta name="generator" content="Hugo 0.82.1" />
+<html lang="en"><head>
+	<meta name="generator" content="Hugo 0.96.0" />
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>batsite</title>
+    <title>home</title>
     
     
     <link rel="stylesheet" href="/scss/main.css">
     <link rel="icon" type="image/x-icon" href="/svg/favicon.svg">
 </head>
-<body><div id="content">
-<div>
-  <h1 class="title">batsite</h1>
-</div>
-<div>
+<body class="colorswitch"><div id="content">
+<header>
+  <h1 id="title" class="colorswitch">batsite</h1>
+</header>
+<article id="content" class="colorswitch">
   <p>
-    
-  </p>
-</div>
+    <h2 id="hello" class="colorswitch">
+    <a class="hash-link colorswitch" href="#hello">
+    &nbsp;hello
+    </a>
+</h2>
+<p>and welcome to my webbed site! i&rsquo;m zoe. (they/she/fae)
+on this site you can find some of my projects: <a href="/games/">games</a>, <a href="/music/">music</a> and <a href="/software/">software</a>.
+if you ever wish to <em>experience</em> of of those, i hope you enjoy!</p>
+<h3 id="work-in-progress" class="colorswitch">
+    <a class="hash-link colorswitch" href="#work-in-progress">
+    &nbsp;work in progress
+    </a>
+</h3>
+<p>this site is still a work in progress! please be patient!</p>
+<h2 id="webring" class="colorswitch">
+    <a class="hash-link colorswitch" href="#webring">
+    &nbsp;webring
+    </a>
+</h2>
+<p>this site is part of the <a href="https://ring.bicompact.space/">armisael webring</a>!!! <a href="/links/buddies/#armisael-webring">please take a look</a>!</p>
 
-        </div><footer>
-<div id="footer-center">
-<nav id="footer-nav">
+  </p>
+</article>
+</div><footer class="colorswitch">
+<span id="footer-left"></span>
+<span id="footer-center">
+<nav id="footer-nav" aria-label="navigation">
     
     
-    <a class="footer-nav-item active" href="/" title=""> home</a>
+    <a class="footer-nav-item active colorswitch" href="/" title="home"></a>
     
-    <a class="footer-nav-item" href="/about/" title="About"> about</a>
+    <a class="footer-nav-item colorswitch" href="/about/" title="about"></a>
     
-    <a class="footer-nav-item" href="/links/" title="Links"> links</a>
+    <a class="footer-nav-item colorswitch" href="/links/" title="links"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/music/" title="music"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/software/" title="software"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/posts/" title="posts">龎</a>
     
 </nav>
-</div>
-<div id="footer-right">
-    <input type="checkbox" id="darkmode-toggle">
-</div>
+</span>
+<span id="footer-right">
+        <input type="checkbox" id="darkmode-toggle" aria-label="darkmode toggle" class="toggleinput">
+        <label class="togglelabel colorswitch" for="darkmode-toggle" aria-label="darkmode toggle" role="checkbox"></label>
+</span>
 </footer>
-<script src="/js/darkmode.js"></script>
-</body>
+<script src="/js/main.js"></script>
+  </body>
 </html>
diff --git a/public/index.xml b/public/index.xml
index 0f9f242..7f53362 100644
--- a/public/index.xml
+++ b/public/index.xml
@@ -1,55 +1,50 @@
 <?xml version="1.0" encoding="utf-8" standalone="yes"?>
 <rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
   <channel>
-    <title>batsite</title>
+    <title>home on batsite</title>
     <link>http://example.org/</link>
-    <description>Recent content on batsite</description>
+    <description>Recent content in home on batsite</description>
     <generator>Hugo -- gohugo.io</generator>
-    <language>en-us</language>
-    <lastBuildDate>Sat, 09 Apr 2022 14:12:18 +0200</lastBuildDate><atom:link href="http://example.org/index.xml" rel="self" type="application/rss+xml" />
+    <language>eng</language>
+    <lastBuildDate>Fri, 15 Apr 2022 20:45:43 +0200</lastBuildDate><atom:link href="http://example.org/index.xml" rel="self" type="application/rss+xml" />
     <item>
-      <title>Links</title>
-      <link>http://example.org/links/</link>
-      <pubDate>Sat, 09 Apr 2022 17:37:48 +0200</pubDate>
+      <title>things that make me happy</title>
+      <link>http://example.org/links/nice_things/</link>
+      <pubDate>Fri, 15 Apr 2022 20:01:01 +0200</pubDate>
       
-      <guid>http://example.org/links/</guid>
-      <description></description>
+      <guid>http://example.org/links/nice_things/</guid>
+      <description>&amp;nbsp;my girlfriend!!!   hehe fae is so cute
+&amp;nbsp;videos   &amp;nbsp;an entire tray of peas   the raw energy of this is just amazing she just eats the entire tray of peas!!! impressive!</description>
     </item>
     
     <item>
-      <title>About</title>
+      <title>find me</title>
+      <link>http://example.org/links/contact/</link>
+      <pubDate>Fri, 15 Apr 2022 16:19:04 +0200</pubDate>
+      
+      <guid>http://example.org/links/contact/</guid>
+      <description>you can find me on a few different platforms!
+ﬧ matrix  git  bandcamp  gotosocial  itch.io bat  tiger</description>
+    </item>
+    
+    <item>
+      <title>about</title>
       <link>http://example.org/about/</link>
       <pubDate>Sat, 09 Apr 2022 14:23:49 +0200</pubDate>
       
       <guid>http://example.org/about/</guid>
-      <description></description>
+      <description>&amp;nbsp;this site   this site was made in hugo and uses its own theme that was made from scratch! the source code for the site and theme is available on git. its fine to use anything from here for personal use! this site also uses nerdfonts caskaydia code and the final 8 color palette.
+&amp;nbsp;me   hi i&amp;rsquo;m zoe (she/her, fae/faer, they/them) whats up. tech tip: you can find out more about me by looking at this website</description>
     </item>
     
     <item>
-      <title>Aeiuo</title>
-      <link>http://example.org/posts/aeiuo/</link>
-      <pubDate>Sat, 09 Apr 2022 14:12:18 +0200</pubDate>
+      <title>buddies</title>
+      <link>http://example.org/links/buddies/</link>
+      <pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
       
-      <guid>http://example.org/posts/aeiuo/</guid>
-      <description></description>
-    </item>
-    
-    <item>
-      <title>B</title>
-      <link>http://example.org/dir1/b/</link>
-      <pubDate>Sat, 09 Apr 2022 14:02:24 +0200</pubDate>
-      
-      <guid>http://example.org/dir1/b/</guid>
-      <description></description>
-    </item>
-    
-    <item>
-      <title>Example</title>
-      <link>http://example.org/posts/example/</link>
-      <pubDate>Sat, 09 Apr 2022 13:36:54 +0200</pubDate>
-      
-      <guid>http://example.org/posts/example/</guid>
-      <description></description>
+      <guid>http://example.org/links/buddies/</guid>
+      <description>&amp;nbsp;tess!!!   fae is my girlfriend and is really perfect!!! like there has been no other person like faer in existence and its rlly nice! i&amp;rsquo;m gay! anyways look at faer website (very important) this site also has free cat pics!!! and fae makes really good twitch streams! what&amp;rsquo;s stopping you from taking a look! we also made a bunch of games together hehe
+&amp;nbsp;armisael webring   this website is part of the armisael webring!</description>
     </item>
     
   </channel>
diff --git a/public/js/headings.js b/public/js/headings.js
new file mode 100644
index 0000000..65ce913
--- /dev/null
+++ b/public/js/headings.js
@@ -0,0 +1,13 @@
+(function addHeadingLinks() {
+  var article = document.getElementById("content");
+  var headings = article.querySelectorAll("h1, h2, h3, h4, h5, h6");
+  headings.forEach(function (heading) {
+    if (heading.id) {
+      var a = document.createElement("a");
+      a.innerHTML = heading.innerHTML;
+      a.href = "#" + heading.id;
+      heading.innerHTML = "";
+      heading.appendChild(a);
+    }
+  });
+})();
diff --git a/public/js/main.js b/public/js/main.js
new file mode 100644
index 0000000..2c1d53f
--- /dev/null
+++ b/public/js/main.js
@@ -0,0 +1,36 @@
+const checkbox = document.getElementById("darkmode-toggle");
+const colorswitchers = document.getElementsByClassName("colorswitch");
+
+function switchToLight() {
+  for (let item of colorswitchers) {
+    item.classList.add("light");
+  }
+}
+
+function switchToDark() {
+  for (let item of colorswitchers) {
+    console.log(item);
+    item.classList.remove("light");
+  }
+}
+
+document.addEventListener("DOMContentLoaded", () => {
+  if (localStorage.getItem("light")) {
+    switchToLight();
+  } else {
+    switchToDark();
+  }
+  checkbox.checked = localStorage.getItem("dark");
+  checkbox.addEventListener("change", function () {
+    localStorage.setItem("light", this.checked);
+    if (this.checked) {
+      switchToLight();
+    } else {
+      localStorage.removeItem("light");
+      switchToDark();
+    }
+  });
+  if (localStorage.getItem("light")) {
+    checkbox.checked = true;
+  }
+});
diff --git a/public/links/buddies/index.html b/public/links/buddies/index.html
new file mode 100644
index 0000000..e547d8c
--- /dev/null
+++ b/public/links/buddies/index.html
@@ -0,0 +1,94 @@
+<!DOCTYPE html>
+<html lang="en"><head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>buddies</title>
+    
+    
+    <link rel="stylesheet" href="/scss/main.css">
+    <link rel="icon" type="image/x-icon" href="/svg/favicon.svg">
+</head>
+<body class="colorswitch"><div id="content">
+<section id="main">
+  <div class="titlecontainer">
+  <h1 id="title" class="colorswitch">buddies</h1>
+  </div>
+  <div>
+        <article id="content" class="colorswitch">
+           <h2 id="tess" class="colorswitch">
+    <a class="hash-link colorswitch" href="#tess">
+    &nbsp;tess!!!
+    </a>
+</h2>
+<p>fae is my girlfriend and is really perfect!!! like there has been no other person like faer in existence and its rlly nice! i&rsquo;m gay!
+<a href="https://tess.kittycat.homes">anyways look at faer website (very important)</a> this site also has <em>free cat pics!!!</em> and fae makes really good <a href="https://www.twitch.tv/rawtess">twitch streams</a>!
+what&rsquo;s stopping you from taking a look!
+we also made a bunch of <a href="https://bathearttiger.itch.io/">games</a> together hehe</p>
+<h2 id="armisael-webring" class="colorswitch">
+    <a class="hash-link colorswitch" href="#armisael-webring">
+    &nbsp;armisael webring
+    </a>
+</h2>
+<p>this website is part of the <a href="https://ring.bicompact.space/">armisael webring!</a>
+bunch of fuckging dorks on there (they&rsquo;re great)<br>
+<a href="https://bicompact.space/">hazel</a> is in front of me and <a href="https://erkin.party/">lulu</a> is behind!</p>
+<h2 id="blankie" class="colorswitch">
+    <a class="hash-link colorswitch" href="#blankie">
+    &nbsp;blankie
+    </a>
+</h2>
+<p>blankie is way better at websites then me! you should look at them!
+theres <a href="https://pastel.codes/">pastel.codes</a> and <a href="https://pentagram.site/">pentagram.site</a></p>
+<h2 id="elysia" class="colorswitch">
+    <a class="hash-link colorswitch" href="#elysia">
+    &nbsp;elysia
+    </a>
+</h2>
+<p>fae is cool and queer and also cats! what&rsquo;s not to love! <a href="http://alphamethyl.barr0w.net/~elysia/">go look!</a>
+this type of website also just makes me happy!</p>
+<h2 id="barrow" class="colorswitch">
+    <a class="hash-link colorswitch" href="#barrow">
+    &nbsp;barrow
+    </a>
+</h2>
+<p>ezra and june barrow run the <a href="http://alphamethyl.barr0w.net/~barrow/">alphamethyl</a> tilde and generally do v good and cool fuckery</p>
+
+        </article>
+  </div>
+</section>
+<aside id="meta">
+    <div>
+    <section>
+    </section>
+    
+    
+    </div>
+</aside>
+</div><footer class="colorswitch">
+<span id="footer-left"></span>
+<span id="footer-center">
+<nav id="footer-nav" aria-label="navigation">
+    
+    
+    <a class="footer-nav-item colorswitch" href="/" title="home"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/about/" title="about"></a>
+    
+    <a class="footer-nav-item active colorswitch" href="/links/" title="links"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/music/" title="music"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/software/" title="software"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/posts/" title="posts">龎</a>
+    
+</nav>
+</span>
+<span id="footer-right">
+        <input type="checkbox" id="darkmode-toggle" aria-label="darkmode toggle" class="toggleinput">
+        <label class="togglelabel colorswitch" for="darkmode-toggle" aria-label="darkmode toggle" role="checkbox"></label>
+</span>
+</footer>
+<script src="/js/main.js"></script>
+  </body>
+</html>
diff --git a/public/links/contact/index.html b/public/links/contact/index.html
new file mode 100644
index 0000000..35b40da
--- /dev/null
+++ b/public/links/contact/index.html
@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html lang="en"><head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>find me</title>
+    
+    
+    <link rel="stylesheet" href="/scss/main.css">
+    <link rel="icon" type="image/x-icon" href="/svg/favicon.svg">
+</head>
+<body class="colorswitch"><div id="content">
+<section id="main">
+  <div class="titlecontainer">
+  <h1 id="title" class="colorswitch">find me</h1>
+  </div>
+  <div>
+        <article id="content" class="colorswitch">
+           <p>you can find me on a few different platforms!</p>
+<p><a href="https://matrix.to/#/@bat:matrix.kittycat.homes">ﬧ matrix</a>
+<a href="https://git.kittycat.homes/zoe"> git</a>
+<a href="https://zoebat.bandcamp.com/"> bandcamp</a>
+<a href="https://kittycat.homes/@pastelpunkbandit"> gotosocial</a>
+<a href="https://bathearttiger.itch.io/"> itch.io bat  tiger</a></p>
+
+        </article>
+  </div>
+</section>
+<aside id="meta">
+    <div>
+    <section>
+    </section>
+    
+    
+    </div>
+</aside>
+</div><footer class="colorswitch">
+<span id="footer-left"></span>
+<span id="footer-center">
+<nav id="footer-nav" aria-label="navigation">
+    
+    
+    <a class="footer-nav-item colorswitch" href="/" title="home"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/about/" title="about"></a>
+    
+    <a class="footer-nav-item active colorswitch" href="/links/" title="links"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/music/" title="music"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/software/" title="software"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/posts/" title="posts">龎</a>
+    
+</nav>
+</span>
+<span id="footer-right">
+        <input type="checkbox" id="darkmode-toggle" aria-label="darkmode toggle" class="toggleinput">
+        <label class="togglelabel colorswitch" for="darkmode-toggle" aria-label="darkmode toggle" role="checkbox"></label>
+</span>
+</footer>
+<script src="/js/main.js"></script>
+  </body>
+</html>
diff --git a/public/links/index.html b/public/links/index.html
index dba810d..1c79058 100644
--- a/public/links/index.html
+++ b/public/links/index.html
@@ -1,54 +1,71 @@
 <!DOCTYPE html>
-<html><head>
+<html lang="en"><head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Links</title>
+    <title>links</title>
     
     
     <link rel="stylesheet" href="/scss/main.css">
     <link rel="icon" type="image/x-icon" href="/svg/favicon.svg">
 </head>
-<body><div id="content">
-<section id="main">
-  <h1 id="title">Single Page Links</h1>
-  <div>
-        <article id="content">
-           
-        </article>
-  </div>
-</section>
-<aside id="meta">
-    <div>
-    <section>
-    </section>
+<body class="colorswitch"><div id="content">
+<main>
+    <article>
+        <header class="colorswitch">
+            <h1 id="title">links</h1>
+        </header>
+        
+        
+    </article>
+    <div id="pagelist">
     
     
+    <div id="postlist">
+    <h2 class="colorswitch posttitle">
+        <a class="colorswitch" href="http://example.org/links/nice_things/">things that make me happy</h2><div class="postdescription">this is a list of very good things</a><br>
+        <a class="postinfo colorswitch" href="http://example.org/links/nice_things/">read more...</a>
+    </div>
+    
+    <div id="postlist">
+    <h2 class="colorswitch posttitle">
+        <a class="colorswitch" href="http://example.org/links/contact/">find me</h2><div class="postdescription">where to find me</a><br>
+        <a class="postinfo colorswitch" href="http://example.org/links/contact/">read more...</a>
+    </div>
+    
+    <div id="postlist">
+    <h2 class="colorswitch posttitle">
+        <a class="colorswitch" href="http://example.org/links/buddies/">buddies</h2><div class="postdescription">these are some cool people that i like!!! very good! you should look at this page</a><br>
+        <a class="postinfo colorswitch" href="http://example.org/links/buddies/">read more...</a>
+    </div>
+    
     </div>
-    <div>
-        
-          <a class="previous" href="http://example.org/about/">previous: About</a>
-        
-        
     </div>
-</aside>
-
-        </div><footer>
-<div id="footer-center">
-<nav id="footer-nav">
+</main>
+</div><footer class="colorswitch">
+<span id="footer-left"></span>
+<span id="footer-center">
+<nav id="footer-nav" aria-label="navigation">
     
     
-    <a class="footer-nav-item" href="/" title=""> home</a>
+    <a class="footer-nav-item colorswitch" href="/" title="home"></a>
     
-    <a class="footer-nav-item" href="/about/" title="About"> about</a>
+    <a class="footer-nav-item colorswitch" href="/about/" title="about"></a>
     
-    <a class="footer-nav-item active" href="/links/" title="Links"> links</a>
+    <a class="footer-nav-item active colorswitch" href="/links/" title="links"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/music/" title="music"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/software/" title="software"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/posts/" title="posts">龎</a>
     
 </nav>
-</div>
-<div id="footer-right">
-    <input type="checkbox" id="darkmode-toggle">
-</div>
+</span>
+<span id="footer-right">
+        <input type="checkbox" id="darkmode-toggle" aria-label="darkmode toggle" class="toggleinput">
+        <label class="togglelabel colorswitch" for="darkmode-toggle" aria-label="darkmode toggle" role="checkbox"></label>
+</span>
 </footer>
-<script src="/js/darkmode.js"></script>
-</body>
+<script src="/js/main.js"></script>
+  </body>
 </html>
diff --git a/public/links/index.xml b/public/links/index.xml
new file mode 100644
index 0000000..d41d9c4
--- /dev/null
+++ b/public/links/index.xml
@@ -0,0 +1,41 @@
+<?xml version="1.0" encoding="utf-8" standalone="yes"?>
+<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
+  <channel>
+    <title>links on batsite</title>
+    <link>http://example.org/links/</link>
+    <description>Recent content in links on batsite</description>
+    <generator>Hugo -- gohugo.io</generator>
+    <language>eng</language>
+    <lastBuildDate>Sat, 09 Apr 2022 17:37:48 +0200</lastBuildDate><atom:link href="http://example.org/links/index.xml" rel="self" type="application/rss+xml" />
+    <item>
+      <title>things that make me happy</title>
+      <link>http://example.org/links/nice_things/</link>
+      <pubDate>Fri, 15 Apr 2022 20:01:01 +0200</pubDate>
+      
+      <guid>http://example.org/links/nice_things/</guid>
+      <description>&amp;nbsp;my girlfriend!!!   hehe fae is so cute
+&amp;nbsp;videos   &amp;nbsp;an entire tray of peas   the raw energy of this is just amazing she just eats the entire tray of peas!!! impressive!</description>
+    </item>
+    
+    <item>
+      <title>find me</title>
+      <link>http://example.org/links/contact/</link>
+      <pubDate>Fri, 15 Apr 2022 16:19:04 +0200</pubDate>
+      
+      <guid>http://example.org/links/contact/</guid>
+      <description>you can find me on a few different platforms!
+ﬧ matrix  git  bandcamp  gotosocial  itch.io bat  tiger</description>
+    </item>
+    
+    <item>
+      <title>buddies</title>
+      <link>http://example.org/links/buddies/</link>
+      <pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
+      
+      <guid>http://example.org/links/buddies/</guid>
+      <description>&amp;nbsp;tess!!!   fae is my girlfriend and is really perfect!!! like there has been no other person like faer in existence and its rlly nice! i&amp;rsquo;m gay! anyways look at faer website (very important) this site also has free cat pics!!! and fae makes really good twitch streams! what&amp;rsquo;s stopping you from taking a look! we also made a bunch of games together hehe
+&amp;nbsp;armisael webring   this website is part of the armisael webring!</description>
+    </item>
+    
+  </channel>
+</rss>
diff --git a/public/links/nice_things/index.html b/public/links/nice_things/index.html
new file mode 100644
index 0000000..7615556
--- /dev/null
+++ b/public/links/nice_things/index.html
@@ -0,0 +1,74 @@
+<!DOCTYPE html>
+<html lang="en"><head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>things that make me happy</title>
+    
+    
+    <link rel="stylesheet" href="/scss/main.css">
+    <link rel="icon" type="image/x-icon" href="/svg/favicon.svg">
+</head>
+<body class="colorswitch"><div id="content">
+<section id="main">
+  <div class="titlecontainer">
+  <h1 id="title" class="colorswitch">things that make me happy</h1>
+  </div>
+  <div>
+        <article id="content" class="colorswitch">
+           <h2 id="my-girlfriend" class="colorswitch">
+    <a class="hash-link colorswitch" href="#my-girlfriend">
+    &nbsp;my girlfriend!!!
+    </a>
+</h2>
+<p><a href="/links/buddies/#tess">hehe fae is so cute</a></p>
+<h2 id="videos" class="colorswitch">
+    <a class="hash-link colorswitch" href="#videos">
+    &nbsp;videos
+    </a>
+</h2>
+<h3 id="an-entire-tray-of-peas" class="colorswitch">
+    <a class="hash-link colorswitch" href="#an-entire-tray-of-peas">
+    &nbsp;an entire tray of peas
+    </a>
+</h3>
+<p><a href="https://www.youtube.com/watch?v=HWcKcUn7e-8">the raw energy of this is just amazing</a> she just eats the entire tray of peas!!! impressive!</p>
+
+        </article>
+  </div>
+</section>
+<aside id="meta">
+    <div>
+    <section>
+    </section>
+    
+    
+    </div>
+</aside>
+</div><footer class="colorswitch">
+<span id="footer-left"></span>
+<span id="footer-center">
+<nav id="footer-nav" aria-label="navigation">
+    
+    
+    <a class="footer-nav-item colorswitch" href="/" title="home"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/about/" title="about"></a>
+    
+    <a class="footer-nav-item active colorswitch" href="/links/" title="links"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/music/" title="music"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/software/" title="software"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/posts/" title="posts">龎</a>
+    
+</nav>
+</span>
+<span id="footer-right">
+        <input type="checkbox" id="darkmode-toggle" aria-label="darkmode toggle" class="toggleinput">
+        <label class="togglelabel colorswitch" for="darkmode-toggle" aria-label="darkmode toggle" role="checkbox"></label>
+</span>
+</footer>
+<script src="/js/main.js"></script>
+  </body>
+</html>
diff --git a/public/music/index.html b/public/music/index.html
new file mode 100644
index 0000000..028f0e8
--- /dev/null
+++ b/public/music/index.html
@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html lang="en"><head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>music</title>
+    
+    
+    <link rel="stylesheet" href="/scss/main.css">
+    <link rel="icon" type="image/x-icon" href="/svg/favicon.svg">
+</head>
+<body class="colorswitch"><div id="content">
+<main>
+    <article>
+        <header class="colorswitch">
+            <h1 id="title">music</h1>
+        </header>
+        
+        <h2 id="where-to-listen" class="colorswitch">
+    <a class="hash-link colorswitch" href="#where-to-listen">
+    &nbsp;where to listen?
+    </a>
+</h2>
+<p>you can find (and download) my music on <a href="https://zoebat.bandcamp.com">bandcamp</a>!!! in the future i will probably also provide torrent links</p>
+
+    </article>
+    <div id="pagelist">
+    
+    
+    </div>
+    </div>
+</main>
+</div><footer class="colorswitch">
+<span id="footer-left"></span>
+<span id="footer-center">
+<nav id="footer-nav" aria-label="navigation">
+    
+    
+    <a class="footer-nav-item colorswitch" href="/" title="home"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/about/" title="about"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/links/" title="links"></a>
+    
+    <a class="footer-nav-item active colorswitch" href="/music/" title="music"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/software/" title="software"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/posts/" title="posts">龎</a>
+    
+</nav>
+</span>
+<span id="footer-right">
+        <input type="checkbox" id="darkmode-toggle" aria-label="darkmode toggle" class="toggleinput">
+        <label class="togglelabel colorswitch" for="darkmode-toggle" aria-label="darkmode toggle" role="checkbox"></label>
+</span>
+</footer>
+<script src="/js/main.js"></script>
+  </body>
+</html>
diff --git a/public/music/index.xml b/public/music/index.xml
new file mode 100644
index 0000000..eb2b196
--- /dev/null
+++ b/public/music/index.xml
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8" standalone="yes"?>
+<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
+  <channel>
+    <title>music on batsite</title>
+    <link>http://example.org/music/</link>
+    <description>Recent content in music on batsite</description>
+    <generator>Hugo -- gohugo.io</generator>
+    <language>eng</language>
+    <lastBuildDate>Fri, 15 Apr 2022 20:45:35 +0200</lastBuildDate><atom:link href="http://example.org/music/index.xml" rel="self" type="application/rss+xml" />
+  </channel>
+</rss>
diff --git a/public/posts/index.html b/public/posts/index.html
index af9ef7e..3e2d890 100644
--- a/public/posts/index.html
+++ b/public/posts/index.html
@@ -1,53 +1,53 @@
 <!DOCTYPE html>
-<html><head>
+<html lang="en"><head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Posts</title>
+    <title>posts</title>
     
     
     <link rel="stylesheet" href="/scss/main.css">
     <link rel="icon" type="image/x-icon" href="/svg/favicon.svg">
 </head>
-<body><div id="content">
+<body class="colorswitch"><div id="content">
 <main>
     <article>
-        <header>
-            <h1>List - Posts</h1>
+        <header class="colorswitch">
+            <h1 id="title">posts</h1>
         </header>
         
         
     </article>
-    <ul>
+    <div id="pagelist">
     
     
-        <li>
-            <a href="http://example.org/posts/aeiuo/">Aeiuo</a>
-        </li>
-    
-        <li>
-            <a href="http://example.org/posts/example/">Example</a>
-        </li>
-    
-    </ul>
+    </div>
+    </div>
 </main>
-
-        </div><footer>
-<div id="footer-center">
-<nav id="footer-nav">
+</div><footer class="colorswitch">
+<span id="footer-left"></span>
+<span id="footer-center">
+<nav id="footer-nav" aria-label="navigation">
     
     
-    <a class="footer-nav-item" href="/" title=""> home</a>
+    <a class="footer-nav-item colorswitch" href="/" title="home"></a>
     
-    <a class="footer-nav-item" href="/about/" title="About"> about</a>
+    <a class="footer-nav-item colorswitch" href="/about/" title="about"></a>
     
-    <a class="footer-nav-item" href="/links/" title="Links"> links</a>
+    <a class="footer-nav-item colorswitch" href="/links/" title="links"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/music/" title="music"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/software/" title="software"></a>
+    
+    <a class="footer-nav-item active colorswitch" href="/posts/" title="posts">龎</a>
     
 </nav>
-</div>
-<div id="footer-right">
-    <input type="checkbox" id="darkmode-toggle">
-</div>
+</span>
+<span id="footer-right">
+        <input type="checkbox" id="darkmode-toggle" aria-label="darkmode toggle" class="toggleinput">
+        <label class="togglelabel colorswitch" for="darkmode-toggle" aria-label="darkmode toggle" role="checkbox"></label>
+</span>
 </footer>
-<script src="/js/darkmode.js"></script>
-</body>
+<script src="/js/main.js"></script>
+  </body>
 </html>
diff --git a/public/posts/index.xml b/public/posts/index.xml
index 5acfbdd..113dd15 100644
--- a/public/posts/index.xml
+++ b/public/posts/index.xml
@@ -1,29 +1,11 @@
 <?xml version="1.0" encoding="utf-8" standalone="yes"?>
 <rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
   <channel>
-    <title>Posts on batsite</title>
+    <title>posts on batsite</title>
     <link>http://example.org/posts/</link>
-    <description>Recent content in Posts on batsite</description>
+    <description>Recent content in posts on batsite</description>
     <generator>Hugo -- gohugo.io</generator>
-    <language>en-us</language>
-    <lastBuildDate>Sat, 09 Apr 2022 14:12:18 +0200</lastBuildDate><atom:link href="http://example.org/posts/index.xml" rel="self" type="application/rss+xml" />
-    <item>
-      <title>Aeiuo</title>
-      <link>http://example.org/posts/aeiuo/</link>
-      <pubDate>Sat, 09 Apr 2022 14:12:18 +0200</pubDate>
-      
-      <guid>http://example.org/posts/aeiuo/</guid>
-      <description></description>
-    </item>
-    
-    <item>
-      <title>Example</title>
-      <link>http://example.org/posts/example/</link>
-      <pubDate>Sat, 09 Apr 2022 13:36:54 +0200</pubDate>
-      
-      <guid>http://example.org/posts/example/</guid>
-      <description></description>
-    </item>
-    
+    <language>eng</language>
+    <lastBuildDate>Sun, 10 Apr 2022 19:06:26 +0200</lastBuildDate><atom:link href="http://example.org/posts/index.xml" rel="self" type="application/rss+xml" />
   </channel>
 </rss>
diff --git a/public/scss/main.css b/public/scss/main.css
index fc90749..60d2805 100644
--- a/public/scss/main.css
+++ b/public/scss/main.css
@@ -1,49 +1,452 @@
-body.light {
-  background-color: #ffe7d6;
-  color: #73464c; }
+@charset "UTF-8";
+* {
+  transition: 2s; }
 
-body.dark {
-  background-color: black;
-  color: white; }
+body {
+  background-color: #413c74;
+  color: #ff8ad0;
+  transition: 2s; }
+  body.light {
+    background-color: #ffffff;
+    color: #413c74; }
+
+a {
+  background-color: transparent;
+  color: #ffdc6d;
+  transition: 2s; }
+  a.light {
+    background-color: transparent;
+    color: #9b5bb4; }
+
+a.footer-nav-item.active,
+a.footer-nav-item:hover {
+  color: #ff8ad0;
+  background-color: #413c74;
+  border-color: #413c74;
+  transition: 0.2s; }
+  a.footer-nav-item.active.light,
+  a.footer-nav-item:hover.light {
+    color: #413c74;
+    background-color: #ffffff;
+    border-color: #ffffff; }
+
+footer {
+  background-color: #ff8ad0;
+  color: #413c74;
+  transition: 2s; }
+  footer.light {
+    background-color: #413c74;
+    color: #ffffff; }
+
+footer a {
+  color: #413c74;
+  background-color: #ff8ad0;
+  transition: 2s; }
+  footer a.light {
+    color: #ffffff;
+    background-color: #413c74; }
+
+.togglelabel {
+  background-color: #ff8ad0;
+  border-color: #413c74;
+  transition: 2s; }
+  .togglelabel.light {
+    background-color: #413c74;
+    border-color: #ffffff; }
+
+.togglelabel.light::after {
+  background-color: #ffffff;
+  border-color: #ffffff;
+  color: #413c74;
+  transition: 2s; }
+
+.togglelabel::after {
+  background-color: #413c74;
+  border-color: #413c74;
+  color: #ff8ad0;
+  transition: 2s; }
+
+body.light #title {
+  color: #ffffff;
+  background-color: #413c74;
+  transition: 2s; }
+
+body #title {
+  color: #413c74;
+  background-color: #ff8ad0;
+  transition: 2s; }
+
+article {
+  background-color: #413c74;
+  border-color: #ff8ad0;
+  transition: 2s; }
+  article.light {
+    background-color: #ffffff;
+    border-color: #413c74; }
+
+h2 {
+  background-color: #ffdc6d;
+  color: #413c74;
+  transition: 2s; }
+  h2.light {
+    color: #ffffff; }
+
+h2 a {
+  color: #413c74; }
+  h2 a.light {
+    color: #ffffff; }
+
+h3 {
+  background-color: #61d478;
+  color: #413c74;
+  transition: 2s; }
+
+h3 a {
+  color: #413c74; }
+  h3 a:hover {
+    background-color: transparent; }
+
+h3.light {
+  background-color: #5183b9;
+  color: #ffffff;
+  transition: 2s; }
+  h3.lighta {
+    color: #ffffff; }
+
+h5,
+h6,
+h4 {
+  background-color: #ffffff;
+  color: #413c74;
+  transition: 2s; }
+  h5 a,
+  h6 a,
+  h4 a {
+    color: #413c74;
+    background-color: transparent; }
+
+h4.light,
+h5.light,
+h6.light {
+  background-color: #413c74;
+  color: #ffffff;
+  transition: 2s; }
+
+h2.light {
+  background-color: #9b5bb4;
+  color: #ffffff;
+  transition: 2s; }
+
+article.light a {
+  background-color: transparent;
+  color: #9b5bb4;
+  transition: 2s; }
+  article.light a.hash-link {
+    color: #ffffff; }
+  article.light a.hash-link:hover {
+    background-color: transparent;
+    color: #ffffff; }
+
+a:hover {
+  color: #413c74;
+  background-color: #ffdc6d;
+  transition: 0.2s;
+  border-color: #ffdc6d; }
+
+.previous.light:hover,
+.next.light:hover,
+.postdescription a.light:hover,
+article.light a:hover {
+  color: #ffffff;
+  background-color: #9b5bb4;
+  transition: 0.2s;
+  border-color: #9b5bb4; }
+
+.light.hash-link:hover,
+.hash-link:hover {
+  background-color: transparent;
+  transition: 2s; }
+
+h1a.light,
+h2a.light,
+h3a.light,
+h4a.light,
+h5a.light,
+h6a.light {
+  background-color: transparent;
+  color: #ffffff; }
+  h1a.light:hover,
+  h2a.light:hover,
+  h3a.light:hover,
+  h4a.light:hover,
+  h5a.light:hover,
+  h6a.light:hover {
+    background-color: transparent; }
+
+header.light {
+  background-color: #ffffff;
+  transition: 2s; }
+
+header {
+  transition: 2s; }
+
+.posttitle a {
+  background-color: transparent;
+  color: #413c74; }
+  .posttitle a:hover {
+    background-color: transparent; }
+
+html,
+body {
+  height: 100%;
+  flex: auto; }
+
+footer {
+  min-height: 42pt;
+  position: sticky;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  bottom: 0; }
+
+#content {
+  min-height: calc(100% - 42pt * 3);
+  right: auto;
+  margin-bottom: 84pt; }
+
+#content p,
+#content ul,
+#content ol,
+#content table,
+code,
+.postdescription,
+hr {
+  margin-right: 24%;
+  margin-left: 24%; }
+
+p code {
+  margin-left: 0;
+  margin-right: 0; }
+
+#content ol ol,
+#content ul ul {
+  margin-left: 0.12em; }
+
+#footer-left {
+  margin-top: auto;
+  margin-bottom: auto;
+  margin-left: 24pt;
+  justify-self: left;
+  margin-right: auto;
+  display: inline-flex; }
+
+#footer-right {
+  margin-top: auto;
+  margin-bottom: auto;
+  margin-left: auto;
+  justify-self: right;
+  margin-right: 24pt;
+  align-content: center;
+  display: inline-flex; }
+
+#footer-center {
+  margin-top: auto;
+  margin-bottom: auto;
+  margin-left: auto;
+  margin-right: auto;
+  justify-content: center;
+  justify-self: center;
+  display: inline-flex; }
+
+* {
+  padding: 0;
+  margin: 0; }
+
+#footer-right * {
+  display: flex;
+  margin-top: auto;
+  margin-bottom: auto; }
+
+#footer-center * {
+  display: flex;
+  margin-right: 8pt;
+  margin-left: 8pt;
+  margin-top: auto;
+  margin-bottom: auto;
+  justify-content: center;
+  align-items: center; }
+
+.postinfo {
+  text-align: right; }
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  padding-right: 6%;
+  margin-right: 6%;
+  padding-top: 12pt;
+  padding-bottom: 12pt;
+  justify-content: right;
+  display: flex;
+  align-items: center;
+  text-align: right; }
+
+h2,
+h3,
+h4,
+h5,
+h6 {
+  margin-top: 1em;
+  margin-bottom: 1em; }
+
+article {
+  margin-inline: auto; }
+
+.titlecontainer,
+header {
+  width: 100%;
+  padding-top: 42pt; }
 
 @font-face {
   font-family: CaskaydiaCove;
   src: url(/font/CaskaydiaCove.ttf); }
 
+@font-face {
+  font-family: CaskaydiaCoveMono;
+  src: url(/font/CaskaydiaCoveMono.ttf); }
+
 * {
   font-family: CaskaydiaCove;
-  font-size: 16pt; }
+  font-size: 12pt; }
+
+p,
+.postdescription,
+ul {
+  line-height: 2em; }
 
 h1 {
   font-size: 42pt; }
 
+h2 a {
+  font-size: 42pt;
+  font-style: bold; }
+
+h3 a, h4 a {
+  font-size: 32pt; }
+
+h5 a, h6 a {
+  font-size: 24pt; }
+
 a {
   text-decoration: none; }
 
-footer {
-  font-size: 20pt; }
+footer * {
+  font-size: 24pt;
+  font-family: CaskaydiaCoveMono; }
 
-html, body {
-  height: 100%;
-  flex: auto; }
+label::after {
+  font-family: CaskaydiaCoveMono;
+  font-size: 24pt; }
 
-footer {
-  height: 10%;
-  min-height: 24pt;
-  position: sticky;
-  display: flex;
-  align-items: center;
-  justify-content: center; }
+h6 {
+  font-style: italic; }
 
-#footer-content {
-  width: 100%; }
-
-#content {
-  min-height: 90%; }
-
-#footer-right {
-  justify-self: right; }
+::before,
+code {
+  font-family: CaskaydiaCoveMono; }
 
 * {
-  padding: 0;
-  margin: 0; }
+  border-width: 2pt; }
+
+input[type="checkbox"] {
+  cursor: pointer; }
+
+.toggleinput {
+  opacity: 0;
+  max-height: 0;
+  max-width: 0;
+  overflow: hidden; }
+
+.togglelabel {
+  width: 42pt;
+  height: 24pt;
+  border-radius: 48pt;
+  cursor: pointer;
+  align-items: center;
+  display: flex; }
+
+.togglelabel::after {
+  left: calc(100% - 67pt);
+  content: "";
+  position: absolute;
+  height: 20pt;
+  width: 20pt;
+  border-width: 1pt;
+  border-radius: 100pt;
+  transition: 1s;
+  display: inline-block;
+  vertical-align: middle;
+  text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  content: "";
+  border-style: solid; }
+
+input:checked + label:after {
+  left: calc(100% - 49pt); }
+
+input:checked + label::after {
+  content: "滛"; }
+
+.footer-nav-item {
+  border-radius: 100%;
+  height: 1em;
+  width: 1em;
+  justify-content: center;
+  align-items: center;
+  border-style: solid; }
+
+.togglelabel {
+  border: solid; }
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  border-top-right-radius: 48pt;
+  border-bottom-right-radius: 48pt; }
+  h1 .hash-link:hover,
+  h2 .hash-link:hover,
+  h3 .hash-link:hover,
+  h4 .hash-link:hover,
+  h5 .hash-link:hover,
+  h6 .hash-link:hover {
+    cursor: pointer; }
+    h1 .hash-link:hover::before,
+    h2 .hash-link:hover::before,
+    h3 .hash-link:hover::before,
+    h4 .hash-link:hover::before,
+    h5 .hash-link:hover::before,
+    h6 .hash-link:hover::before {
+      content: ""; }
+
+.postdescription,
+#content p,
+#content ul,
+#content ol,
+#content table {
+  border-left-style: solid;
+  border-width: 0.24em;
+  padding-left: 2em; }
+
+p a,
+.postdescription a,
+ul a {
+  border-style: solid;
+  padding: 0.12em; }
diff --git a/public/sitemap.xml b/public/sitemap.xml
index 2fc3c32..f1d6f9c 100644
--- a/public/sitemap.xml
+++ b/public/sitemap.xml
@@ -2,29 +2,31 @@
 <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
   xmlns:xhtml="http://www.w3.org/1999/xhtml">
   <url>
+    <loc>http://example.org/</loc>
+    <lastmod>2022-04-15T20:45:43+02:00</lastmod>
+  </url><url>
+    <loc>http://example.org/software/</loc>
+    <lastmod>2022-04-15T20:45:43+02:00</lastmod>
+  </url><url>
+    <loc>http://example.org/music/</loc>
+    <lastmod>2022-04-15T20:45:35+02:00</lastmod>
+  </url><url>
+    <loc>http://example.org/links/nice_things/</loc>
+    <lastmod>2022-04-15T20:01:01+02:00</lastmod>
+  </url><url>
+    <loc>http://example.org/links/contact/</loc>
+    <lastmod>2022-04-15T16:19:04+02:00</lastmod>
+  </url><url>
+    <loc>http://example.org/posts/</loc>
+    <lastmod>2022-04-10T19:06:26+02:00</lastmod>
+  </url><url>
     <loc>http://example.org/links/</loc>
     <lastmod>2022-04-09T17:37:48+02:00</lastmod>
   </url><url>
     <loc>http://example.org/about/</loc>
     <lastmod>2022-04-09T14:23:49+02:00</lastmod>
   </url><url>
-    <loc>http://example.org/posts/aeiuo/</loc>
-    <lastmod>2022-04-09T14:12:18+02:00</lastmod>
-  </url><url>
-    <loc>http://example.org/</loc>
-    <lastmod>2022-04-09T14:12:18+02:00</lastmod>
-  </url><url>
-    <loc>http://example.org/posts/</loc>
-    <lastmod>2022-04-09T14:12:18+02:00</lastmod>
-  </url><url>
-    <loc>http://example.org/dir1/b/</loc>
-    <lastmod>2022-04-09T14:02:24+02:00</lastmod>
-  </url><url>
-    <loc>http://example.org/dir1/</loc>
-    <lastmod>2022-04-09T14:02:24+02:00</lastmod>
-  </url><url>
-    <loc>http://example.org/posts/example/</loc>
-    <lastmod>2022-04-09T13:36:54+02:00</lastmod>
+    <loc>http://example.org/links/buddies/</loc>
   </url><url>
     <loc>http://example.org/categories/</loc>
   </url><url>
diff --git a/public/software/index.html b/public/software/index.html
new file mode 100644
index 0000000..f6abb30
--- /dev/null
+++ b/public/software/index.html
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html lang="en"><head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>software</title>
+    
+    
+    <link rel="stylesheet" href="/scss/main.css">
+    <link rel="icon" type="image/x-icon" href="/svg/favicon.svg">
+</head>
+<body class="colorswitch"><div id="content">
+<main>
+    <article>
+        <header class="colorswitch">
+            <h1 id="title">software</h1>
+        </header>
+        
+        
+    </article>
+    <div id="pagelist">
+    
+    
+    </div>
+    </div>
+</main>
+</div><footer class="colorswitch">
+<span id="footer-left"></span>
+<span id="footer-center">
+<nav id="footer-nav" aria-label="navigation">
+    
+    
+    <a class="footer-nav-item colorswitch" href="/" title="home"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/about/" title="about"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/links/" title="links"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/music/" title="music"></a>
+    
+    <a class="footer-nav-item active colorswitch" href="/software/" title="software"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/posts/" title="posts">龎</a>
+    
+</nav>
+</span>
+<span id="footer-right">
+        <input type="checkbox" id="darkmode-toggle" aria-label="darkmode toggle" class="toggleinput">
+        <label class="togglelabel colorswitch" for="darkmode-toggle" aria-label="darkmode toggle" role="checkbox"></label>
+</span>
+</footer>
+<script src="/js/main.js"></script>
+  </body>
+</html>
diff --git a/public/software/index.xml b/public/software/index.xml
new file mode 100644
index 0000000..97b1dc2
--- /dev/null
+++ b/public/software/index.xml
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8" standalone="yes"?>
+<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
+  <channel>
+    <title>software on batsite</title>
+    <link>http://example.org/software/</link>
+    <description>Recent content in software on batsite</description>
+    <generator>Hugo -- gohugo.io</generator>
+    <language>eng</language>
+    <lastBuildDate>Fri, 15 Apr 2022 20:45:43 +0200</lastBuildDate><atom:link href="http://example.org/software/index.xml" rel="self" type="application/rss+xml" />
+  </channel>
+</rss>
diff --git a/public/tags/index.html b/public/tags/index.html
index 2e22461..099bb20 100644
--- a/public/tags/index.html
+++ b/public/tags/index.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html><head>
+<html lang="en"><head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>Tags</title>
@@ -8,38 +8,46 @@
     <link rel="stylesheet" href="/scss/main.css">
     <link rel="icon" type="image/x-icon" href="/svg/favicon.svg">
 </head>
-<body><div id="content">
+<body class="colorswitch"><div id="content">
 <main>
     <article>
-        <header>
-            <h1>List - Tags</h1>
+        <header class="colorswitch">
+            <h1 id="title">Tags</h1>
         </header>
         
         
     </article>
-    <ul>
+    <div id="pagelist">
     
     
-    </ul>
+    </div>
+    </div>
 </main>
-
-        </div><footer>
-<div id="footer-center">
-<nav id="footer-nav">
+</div><footer class="colorswitch">
+<span id="footer-left"></span>
+<span id="footer-center">
+<nav id="footer-nav" aria-label="navigation">
     
     
-    <a class="footer-nav-item" href="/" title=""> home</a>
+    <a class="footer-nav-item colorswitch" href="/" title="home"></a>
     
-    <a class="footer-nav-item" href="/about/" title="About"> about</a>
+    <a class="footer-nav-item colorswitch" href="/about/" title="about"></a>
     
-    <a class="footer-nav-item" href="/links/" title="Links"> links</a>
+    <a class="footer-nav-item colorswitch" href="/links/" title="links"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/music/" title="music"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/software/" title="software"></a>
+    
+    <a class="footer-nav-item colorswitch" href="/posts/" title="posts">龎</a>
     
 </nav>
-</div>
-<div id="footer-right">
-    <input type="checkbox" id="darkmode-toggle">
-</div>
+</span>
+<span id="footer-right">
+        <input type="checkbox" id="darkmode-toggle" aria-label="darkmode toggle" class="toggleinput">
+        <label class="togglelabel colorswitch" for="darkmode-toggle" aria-label="darkmode toggle" role="checkbox"></label>
+</span>
 </footer>
-<script src="/js/darkmode.js"></script>
-</body>
+<script src="/js/main.js"></script>
+  </body>
 </html>
diff --git a/public/tags/index.xml b/public/tags/index.xml
index 312d9c2..ecbe39e 100644
--- a/public/tags/index.xml
+++ b/public/tags/index.xml
@@ -5,6 +5,6 @@
     <link>http://example.org/tags/</link>
     <description>Recent content in Tags on batsite</description>
     <generator>Hugo -- gohugo.io</generator>
-    <language>en-us</language><atom:link href="http://example.org/tags/index.xml" rel="self" type="application/rss+xml" />
+    <language>eng</language><atom:link href="http://example.org/tags/index.xml" rel="self" type="application/rss+xml" />
   </channel>
 </rss>
