From 731f7549d4b81e424bfd97f81641ec41e0f55f4b Mon Sep 17 00:00:00 2001
From: Quinten <quinten0508@protonmail.com>
Date: Sun, 2 Mar 2025 23:11:10 +0100
Subject: [PATCH] update, finally * added porter robinson concert * changed
 gallery layout to multipage * fixed ox element width not stretching on
 chromium * removed (some) instances of unnecessary relative path linking (./
 instead of /)

---
 Mees Kees - buiten de lijntjes.pdf            | Bin 0 -> 31506789 bytes
 TODO.html                                     |  38 ++-
 assets/bg.png                                 | Bin 0 -> 106 bytes
 assets/bg.pxo                                 | Bin 0 -> 479 bytes
 assets/bg2.png                                | Bin 0 -> 183 bytes
 assets/buttons/OmBViY96.htm                   | 250 ++++++++++++++
 assets/buttons/addchannel.gif                 | Bin 0 -> 1768 bytes
 assets/buttons/bottom95oftheweb.gif           | Bin 0 -> 3297 bytes
 .../buttons/designedwithrecycledwebspace.gif  | Bin 0 -> 21999 bytes
 assets/buttons/github-check.gif               | Bin 0 -> 2398 bytes
 assets/buttons/gnunano.gif                    | Bin 0 -> 440 bytes
 assets/buttons/internetarchivee.gif           | Bin 0 -> 2105 bytes
 assets/fallingstar.pxo                        | Bin 0 -> 1408 bytes
 assets/oneko-tux-old.gif                      | Bin 3645 -> 0 bytes
 assets/scripts/md-block.js                    | 304 ++++++++++++++++++
 assets/scripts/oneko.js                       |  52 ++-
 assets/scripts/oneko_old.js                   | 239 ++++++++++++++
 assets/scripts/uptime.js                      |   1 -
 gallery.html                                  | 151 ++++++---
 gallery/20240708_amsterdam.html               | 194 +++++++++++
 gallery/20240802_chamonix.html                | 196 +++++++++++
 gallery/20250301_porter.html                  | 239 ++++++++++++++
 index.html                                    |  21 +-
 links.html                                    |   7 +-
 robots.txt                                    |  37 ++-
 style.css                                     |  12 +-
 template.html                                 |  15 +-
 updates.html                                  |  29 +-
 28 files changed, 1665 insertions(+), 120 deletions(-)
 create mode 100644 Mees Kees - buiten de lijntjes.pdf
 create mode 100644 assets/bg.png
 create mode 100644 assets/bg.pxo
 create mode 100644 assets/bg2.png
 create mode 100644 assets/buttons/OmBViY96.htm
 create mode 100644 assets/buttons/addchannel.gif
 create mode 100644 assets/buttons/bottom95oftheweb.gif
 create mode 100644 assets/buttons/designedwithrecycledwebspace.gif
 create mode 100644 assets/buttons/github-check.gif
 create mode 100644 assets/buttons/gnunano.gif
 create mode 100644 assets/buttons/internetarchivee.gif
 create mode 100644 assets/fallingstar.pxo
 delete mode 100644 assets/oneko-tux-old.gif
 create mode 100644 assets/scripts/md-block.js
 create mode 100644 assets/scripts/oneko_old.js
 create mode 100644 gallery/20240708_amsterdam.html
 create mode 100644 gallery/20240802_chamonix.html
 create mode 100644 gallery/20250301_porter.html

diff --git a/Mees Kees - buiten de lijntjes.pdf b/Mees Kees - buiten de lijntjes.pdf
new file mode 100644
index 0000000000000000000000000000000000000000..62b127824ee9b1bbb7f14283bb84d77eb7b57072
GIT binary patch
diff --git a/TODO.html b/TODO.html
index 64e561b..293a8c2 100644
--- a/TODO.html
+++ b/TODO.html
@@ -3,7 +3,7 @@
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <script type="module" src="https://md-block.verou.me/md-block.js"></script>
+  <script type="module" src="./assets/scripts/md-block.js"></script>
   <style>
     @font-face {
     font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
@@ -56,8 +56,12 @@
     # TODOs and IDEAS Scrapbook
 
     --- 
+    ---
+    ## Automate some tools
+    * https://www.html-tidy.org/
+    
     --- 
-    ## Make a "template" webpage
+    ## ☑️Make a "template" webpage
     ### What do we want on here from the main page?
     * ✔ list of local links
     * ? socials 
@@ -68,29 +72,30 @@
     * How badly do we need this? - maybe 5 or 6 main pages, blocks etc won't be visible (probably), but still requires re-use. Do we even want blogs? Also, this seems better left alone, to be implemented later(tm) when needed
     
     ---
-    ## File browser-esque horizontal directory indicator
+    ## ❓File browser-esque horizontal directory indicator
     * /home/links with each being clickable etc as navigation back "up"
-    * If tux is clicked, change to win7 icon "change filepaths too w/ regex :3"
+    * If tux is clicked, change to win7 icon / change filepaths too to windows-esque "C:\etc" - probably too much effort
       * Maybe multiple clicks, tux "falling off"
 
     ---
-    ## Make a "links" page
+    ## ☑️Make a "links" page
     Like a collection of bookmarks, possibly organized, realistically not really. Just add a short description to the href or as subscript ig
 
     ---
-    ## Make onsite links prioritized over offsite links
+    ## ☑️ Make onsite links prioritized over offsite links
     * Make offsite links dimmer in color?
 
     ---
-    ## Make a blog page
-    ANY stories, text, ramblings, whatever. Probably very infrequent.
+    ## ☑️ Make a blog page
+    ANY stories, text, ramblings, whatever. Probably very infrequent. (updates && gallery i guess)
 
     ---
-    ## Make a short bio (scary!)
+    ## ❗Make a short bio (scary!)
+    nop
 
 
     ---
-    ## Space weather!
+    ## ☑️Space weather!
     * https://services.swpc.noaa.gov/images/animations/ovation/north/latest.jpg
       * fetch new image every 10min to new API :3
     * some one sentence forecast from https://services.swpc.noaa.gov as well 
@@ -98,27 +103,28 @@
 
 
     ---
-    ## Add fun animations to the background
+    ## ❗Add fun animations to the background
     Comets, twinkling stars, other animated pixel dithering waves or something idk!
     [maybe like this?](https://github.com/tsparticles/presets/tree/main/presets/stars#readme)
 
     ---
-    ## Change background
+    ## ❗Change background
     To allow the idea above here, and because it fucks your eyesight and doesnt render suuuper well
 
     ---
-    ## Make website more 'alive'
+    ## ❗Make website more 'alive'
     * Add animations, transitions (dont make em obnoxious, maybe only add them on optional / for fun interactions)
     * More "always moving" things, incl add fun animations to bg 2 ideas above
 
     ---
-    ## Add fancy borders, see bookmark
+    ## ❗Add fancy borders, see bookmark
+    - does this even fit the website? might get too busy esp. with animations.
 
 
     ---
     ## Layout changes to the base website
 
-    ### Seperate on-website links (onlinks) from offlinks
+    ### ☑️Seperate on-website links (onlinks) from offlinks
     * Make onlinks prioritized
     * Put offlinks in a seperate, smaller, visually deprioritized box
       * Move this box to the side, as sidebar? -> say goodbye to mobile 4ever :sob: 
@@ -134,7 +140,7 @@
     | https://status.cafe/users/ctrl64   |  broken  |
     | https://hacktivis.me/bookmarks     |  broken  |
     | https://tweakers.net/              |  completely different layout |
-    | https://mathieutuli.com/           | fun inspo
+    | https://mathieutuli.com/           | fun inspo |
   
     -> Is this problem REALLY unsolved? *sigh*
     
diff --git a/assets/bg.png b/assets/bg.png
new file mode 100644
index 0000000000000000000000000000000000000000..7c00236b8ccdf930b44addd490f84c2cad9eca13
GIT binary patch
diff --git a/assets/bg.pxo b/assets/bg.pxo
new file mode 100644
index 0000000000000000000000000000000000000000..452d49cafd8a7b49665039361bdf18606a56abb2
GIT binary patch
diff --git a/assets/bg2.png b/assets/bg2.png
new file mode 100644
index 0000000000000000000000000000000000000000..d7c121492747850975322ae942e18728026d12e8
GIT binary patch
diff --git a/assets/buttons/OmBViY96.htm b/assets/buttons/OmBViY96.htm
new file mode 100644
index 0000000..a87c833
--- /dev/null
+++ b/assets/buttons/OmBViY96.htm
@@ -0,0 +1,250 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+        <title>The Linux Kernel Archives</title>
+        <meta charset="utf-8" />
+	<link rel="icon" type="image/png" href="https://www.kernel.org/theme/images/logos/favicon.png" />
+        <link rel="stylesheet" href="https://www.kernel.org/theme/css/main.css" type="text/css" />
+        <link href="https://www.kernel.org/feeds/all.atom.xml" type="application/atom+xml" rel="alternate" title="The Linux Kernel Archives Atom Feed" />
+
+        <link href="https://www.kernel.org/feeds/kdist.xml" type="application/atom+xml" rel="alternate" title="Latest Linux Kernel Releases" />
+
+        <!--[if IE]>
+                <script src="https://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
+
+        <!--[if lte IE 7]>
+                <link rel="stylesheet" type="text/css" media="all" href="https://www.kernel.org/css/ie.css"/>
+                <script src="https://www.kernel.org/js/IE8.js" type="text/javascript"></script><![endif]-->
+
+        <!--[if lt IE 7]>
+                <link rel="stylesheet" type="text/css" media="all" href="https://www.kernel.org/css/ie6.css"/><![endif]-->
+
+</head>
+
+<body id="index" class="home">
+        <header id="banner" class="body">
+	        <div id="tux-gear"></div>
+                <h1><a href="https://www.kernel.org/">The Linux Kernel Archives </a></h1>
+                <nav><ul>
+                    <li ><a href="https://www.kernel.org/category/about.html">About</a></li>
+                    <li ><a href="https://www.kernel.org/category/contact-us.html">Contact us</a></li>
+                    <li ><a href="https://www.kernel.org/category/faq.html">FAQ</a></li>
+                    <li ><a href="https://www.kernel.org/category/releases.html">Releases</a></li>
+                    <li ><a href="https://www.kernel.org/category/signatures.html">Signatures</a></li>
+                    <li ><a href="https://www.kernel.org/category/site-news.html">Site news</a></li>
+                </ul></nav>
+        </header><!-- /#banner -->
+        
+<aside id="featured" class="body">
+    <article>
+        <table id="protocols">
+        <tr>
+          <th>Protocol</th>
+          <th>Location</th>
+        </tr>
+        <tr>
+          <td><a href="https://www.ietf.org/rfc/rfc2616.txt">HTTP</a></td>
+          <td><a href="https://www.kernel.org/pub/">https://www.kernel.org/pub/</a></td>
+        </tr>
+
+        <tr>
+          <td><a href="https://git-scm.com/">GIT</a></td>
+          <td><a href="https://git.kernel.org/">https://git.kernel.org/</a></td>
+        </tr>
+
+        <tr>
+            <td><a href="https://rsync.samba.org/">RSYNC</a></td>
+            <td>rsync://rsync.kernel.org/pub/</td>
+        </tr>
+        </table>
+
+        <table id="latest">
+        <tr>
+            <td colspan="2" id="latest_label">
+                <strong>Latest Release</strong>
+            </td>
+        </tr>
+        <tr>
+            <td id="latest_link">
+                <a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/linux-6.10.8.tar.xz">6.10.8</a>
+            </td>
+            <td id="latest_button">
+                <a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/linux-6.10.8.tar.xz"><img src="https://www.kernel.org/theme/images/icons/downloadarrow_small.png" width="48" height="48" border="0" alt="Download"/></a>
+            </td>
+        </tr>
+        </table>
+        <!--//
+            // Wait! Are you looking at the source because you are trying to parse the releases table?
+            // Save yourself a lot of effort and use these instead:
+            // - https://www.kernel.org/releases.json
+            // - https://www.kernel.org/finger_banner
+            //-->
+        <table id="releases">
+        <tr align="left">
+            <td>mainline:</td>
+            <td><strong>6.11-rc6</strong></td>
+            <td>2024-09-01</td>
+            <td>[<a href="https://git.kernel.org/torvalds/t/linux-6.11-rc6.tar.gz" title="Download complete tarball">tarball</a>] </td>
+            <td> </td>
+            <td>[<a href="https://git.kernel.org/torvalds/p/v6.11-rc6/v6.10" title="Download patch to previous mainline">patch</a>] </td>
+            <td>[<a href="https://git.kernel.org/torvalds/p/v6.11-rc6/v6.11-rc5" title="Download incremental patch">inc.&nbsp;patch</a>] </td>
+            <td>[<a href="https://git.kernel.org/torvalds/ds/v6.11-rc6/v6.11-rc5" title="View diff in cgit">view&nbsp;diff</a>] </td>
+            <td>[<a href="https://git.kernel.org/torvalds/h/v6.11-rc6" title="Browse the git tree using cgit">browse</a>]  </td>
+            <td> </td>
+        </tr>
+        <tr align="left">
+            <td>stable:</td>
+            <td><strong>6.10.8</strong></td>
+            <td>2024-09-04</td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/linux-6.10.8.tar.xz" title="Download complete tarball">tarball</a>] </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/linux-6.10.8.tar.sign" title="Download PGP verification signature">pgp</a>]  </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/patch-6.10.8.xz" title="Download patch to previous mainline">patch</a>] </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/incr/patch-6.10.7-8.xz" title="Download incremental patch">inc.&nbsp;patch</a>] </td>
+            <td>[<a href="https://git.kernel.org/stable/ds/v6.10.8/v6.10.7" title="View diff in cgit">view&nbsp;diff</a>] </td>
+            <td>[<a href="https://git.kernel.org/stable/h/v6.10.8" title="Browse the git tree using cgit">browse</a>]  </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/ChangeLog-6.10.8" title="View detailed change logs">changelog</a>] </td>
+        </tr>
+        <tr align="left">
+            <td>longterm:</td>
+            <td><strong>6.6.49</strong></td>
+            <td>2024-09-04</td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/linux-6.6.49.tar.xz" title="Download complete tarball">tarball</a>] </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/linux-6.6.49.tar.sign" title="Download PGP verification signature">pgp</a>]  </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/patch-6.6.49.xz" title="Download patch to previous mainline">patch</a>] </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/incr/patch-6.6.48-49.xz" title="Download incremental patch">inc.&nbsp;patch</a>] </td>
+            <td>[<a href="https://git.kernel.org/stable/ds/v6.6.49/v6.6.48" title="View diff in cgit">view&nbsp;diff</a>] </td>
+            <td>[<a href="https://git.kernel.org/stable/h/v6.6.49" title="Browse the git tree using cgit">browse</a>]  </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/ChangeLog-6.6.49" title="View detailed change logs">changelog</a>] </td>
+        </tr>
+        <tr align="left">
+            <td>longterm:</td>
+            <td><strong>6.1.108</strong></td>
+            <td>2024-09-04</td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/linux-6.1.108.tar.xz" title="Download complete tarball">tarball</a>] </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/linux-6.1.108.tar.sign" title="Download PGP verification signature">pgp</a>]  </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/patch-6.1.108.xz" title="Download patch to previous mainline">patch</a>] </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/incr/patch-6.1.107-108.xz" title="Download incremental patch">inc.&nbsp;patch</a>] </td>
+            <td>[<a href="https://git.kernel.org/stable/ds/v6.1.108/v6.1.107" title="View diff in cgit">view&nbsp;diff</a>] </td>
+            <td>[<a href="https://git.kernel.org/stable/h/v6.1.108" title="Browse the git tree using cgit">browse</a>]  </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v6.x/ChangeLog-6.1.108" title="View detailed change logs">changelog</a>] </td>
+        </tr>
+        <tr align="left">
+            <td>longterm:</td>
+            <td><strong>5.15.166</strong></td>
+            <td>2024-09-04</td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v5.x/linux-5.15.166.tar.xz" title="Download complete tarball">tarball</a>] </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v5.x/linux-5.15.166.tar.sign" title="Download PGP verification signature">pgp</a>]  </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v5.x/patch-5.15.166.xz" title="Download patch to previous mainline">patch</a>] </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v5.x/incr/patch-5.15.165-166.xz" title="Download incremental patch">inc.&nbsp;patch</a>] </td>
+            <td>[<a href="https://git.kernel.org/stable/ds/v5.15.166/v5.15.165" title="View diff in cgit">view&nbsp;diff</a>] </td>
+            <td>[<a href="https://git.kernel.org/stable/h/v5.15.166" title="Browse the git tree using cgit">browse</a>]  </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v5.x/ChangeLog-5.15.166" title="View detailed change logs">changelog</a>] </td>
+        </tr>
+        <tr align="left">
+            <td>longterm:</td>
+            <td><strong>5.10.225</strong></td>
+            <td>2024-09-04</td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v5.x/linux-5.10.225.tar.xz" title="Download complete tarball">tarball</a>] </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v5.x/linux-5.10.225.tar.sign" title="Download PGP verification signature">pgp</a>]  </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v5.x/patch-5.10.225.xz" title="Download patch to previous mainline">patch</a>] </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v5.x/incr/patch-5.10.224-225.xz" title="Download incremental patch">inc.&nbsp;patch</a>] </td>
+            <td>[<a href="https://git.kernel.org/stable/ds/v5.10.225/v5.10.224" title="View diff in cgit">view&nbsp;diff</a>] </td>
+            <td>[<a href="https://git.kernel.org/stable/h/v5.10.225" title="Browse the git tree using cgit">browse</a>]  </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v5.x/ChangeLog-5.10.225" title="View detailed change logs">changelog</a>] </td>
+        </tr>
+        <tr align="left">
+            <td>longterm:</td>
+            <td><strong>5.4.283</strong></td>
+            <td>2024-09-04</td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v5.x/linux-5.4.283.tar.xz" title="Download complete tarball">tarball</a>] </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v5.x/linux-5.4.283.tar.sign" title="Download PGP verification signature">pgp</a>]  </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v5.x/patch-5.4.283.xz" title="Download patch to previous mainline">patch</a>] </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v5.x/incr/patch-5.4.282-283.xz" title="Download incremental patch">inc.&nbsp;patch</a>] </td>
+            <td>[<a href="https://git.kernel.org/stable/ds/v5.4.283/v5.4.282" title="View diff in cgit">view&nbsp;diff</a>] </td>
+            <td>[<a href="https://git.kernel.org/stable/h/v5.4.283" title="Browse the git tree using cgit">browse</a>]  </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v5.x/ChangeLog-5.4.283" title="View detailed change logs">changelog</a>] </td>
+        </tr>
+        <tr align="left">
+            <td>longterm:</td>
+            <td><strong>4.19.321</strong></td>
+            <td>2024-09-04</td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v4.x/linux-4.19.321.tar.xz" title="Download complete tarball">tarball</a>] </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v4.x/linux-4.19.321.tar.sign" title="Download PGP verification signature">pgp</a>]  </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v4.x/patch-4.19.321.xz" title="Download patch to previous mainline">patch</a>] </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v4.x/incr/patch-4.19.320-321.xz" title="Download incremental patch">inc.&nbsp;patch</a>] </td>
+            <td>[<a href="https://git.kernel.org/stable/ds/v4.19.321/v4.19.320" title="View diff in cgit">view&nbsp;diff</a>] </td>
+            <td>[<a href="https://git.kernel.org/stable/h/v4.19.321" title="Browse the git tree using cgit">browse</a>]  </td>
+            <td>[<a href="https://cdn.kernel.org/pub/linux/kernel/v4.x/ChangeLog-4.19.321" title="View detailed change logs">changelog</a>] </td>
+        </tr>
+        <tr align="left">
+            <td>linux-next:</td>
+            <td><strong>next-20240904</strong></td>
+            <td>2024-09-04</td>
+            <td> </td>
+            <td> </td>
+            <td> </td>
+            <td> </td>
+            <td> </td>
+            <td>[<a href="https://git.kernel.org/next/linux-next/h/next-20240904" title="Browse the git tree using cgit">browse</a>]  </td>
+            <td> </td>
+        </tr>
+        </table>
+    </article>
+</aside>
+        <section id="extras" class="body">
+                <div class="blogroll">
+                        <h2>Other resources</h2>
+                        <ul>
+                            <li><a href="https://git.kernel.org/">Git Trees</a></li>
+                            <li><a href="https://docs.kernel.org/">Documentation</a></li>
+                            <li><a href="https://lore.kernel.org/">Kernel Mailing Lists</a></li>
+                            <li><a href="https://patchwork.kernel.org/">Patchwork</a></li>
+                            <li><a href="https://www.wiki.kernel.org/">Wikis</a></li>
+                            <li><a href="https://bugzilla.kernel.org/">Bugzilla</a></li>
+                            <li><a href="https://mirrors.kernel.org/">Mirrors</a></li>
+                            <li><a href="https://www.linux.com/">Linux.com</a></li>
+                            <li><a href="https://www.linuxfoundation.org/">Linux Foundation</a></li>
+                        </ul>
+                </div><!-- /.blogroll -->
+                <div class="social">
+                        <h2>Social</h2>
+                        <ul>
+                            <li><a href="https://www.kernel.org/feeds/all.atom.xml" type="application/atom+xml" rel="alternate">Site Atom feed</a></li>
+                            <li><a href="https://www.kernel.org/feeds/kdist.xml" type="application/atom+xml" rel="alternate">Releases Atom Feed</a></li>
+
+                            <li><a href="https://planet.kernel.org/">Kernel Planet</a></li>
+                        </ul>
+                </div><!-- /.social -->
+        </section><!-- /#extras -->
+
+        <footer id="contentinfo" class="body">
+                <address id="about" class="vcard body">
+                    This site is operated by the Linux Kernel Organization, Inc., a <a href="https://www.kernel.org/nonprofit.html">501(c)3 nonprofit corporation</a>, with support from the following sponsors.
+                </address><!-- /#about -->
+
+                <address id="donors">
+                  <a href="https://metal.equinix.com/"><img src="https://www.kernel.org/theme/images/logos/equinix-metal.png"
+                  alt="Equinix Metal" height="35" width="328" /></a>
+                  &nbsp;
+                  <a href="https://www.fastly.com/"><img src="https://www.kernel.org/theme/images/logos/fastly-logo.png"
+                  alt="Fastly" width="91" height="35" /></a>
+                  &nbsp;
+                  <a href="https://www.constellix.com/"><img src="https://www.kernel.org/theme/images/logos/constellix-green-logo.png"
+                  alt="Constellix" width="193" height="21" /></a>
+                  <br />
+                  <a href="https://www.redhat.com/"><img src="https://www.kernel.org/theme/images/logos/redhat-community.png"
+                  alt="Red Hat" height="36" width="150" /></a>
+                  &nbsp;
+                  <a href="https://www.purestorage.com/"><img src="https://www.kernel.org/theme/images/logos/purestorage.png"
+                  alt="PureStorage" width="179" height="45" /></a>
+                  &nbsp;
+                  <a href="https://www.google.com/"><img src="https://www.kernel.org/theme/images/logos/google.png"
+                  alt="Google" height="42" width="128" /></a>
+                  <br/>&nbsp;<br/>
+                  <a href="https://www.linuxfoundation.org/"><img src="https://www.kernel.org/theme/images/logos/thelinuxfoundation.png"
+                  alt="The Linux Foundation" width="137" height="45" /></a>
+                </address><!-- /#about -->
+        </footer><!-- /#contentinfo -->
+
+</body>
+</html>
\ No newline at end of file
diff --git a/assets/buttons/addchannel.gif b/assets/buttons/addchannel.gif
new file mode 100644
index 0000000000000000000000000000000000000000..e09e8e417d41f919535bb98ef574808b25393276
GIT binary patch
diff --git a/assets/buttons/bottom95oftheweb.gif b/assets/buttons/bottom95oftheweb.gif
new file mode 100644
index 0000000000000000000000000000000000000000..5c79932c4beae16afa1befa12c3d64ec8c7112b3
GIT binary patch
diff --git a/assets/buttons/designedwithrecycledwebspace.gif b/assets/buttons/designedwithrecycledwebspace.gif
new file mode 100644
index 0000000000000000000000000000000000000000..575c51799cedf8fa015d39127323f8bf200c0c20
GIT binary patch
diff --git a/assets/buttons/github-check.gif b/assets/buttons/github-check.gif
new file mode 100644
index 0000000000000000000000000000000000000000..a450e121473c570c24842879ef46fae8d263f8cd
GIT binary patch
diff --git a/assets/buttons/gnunano.gif b/assets/buttons/gnunano.gif
new file mode 100644
index 0000000000000000000000000000000000000000..d728c0384818156324ba7f825d7fe86feb7269bb
GIT binary patch
diff --git a/assets/buttons/internetarchivee.gif b/assets/buttons/internetarchivee.gif
new file mode 100644
index 0000000000000000000000000000000000000000..21ccfa3e22eb08bd6053d20b7a12540b1a7d8c35
GIT binary patch
diff --git a/assets/fallingstar.pxo b/assets/fallingstar.pxo
new file mode 100644
index 0000000000000000000000000000000000000000..088c8ab31bd0c97c8741a6c34adbd8c2c90f6bf6
GIT binary patch
diff --git a/assets/oneko-tux-old.gif b/assets/oneko-tux-old.gif
deleted file mode 100644
index c4af325e3f153fc0deb2aecb6b317f46243aeaad..0000000000000000000000000000000000000000
GIT binary patch
diff --git a/assets/scripts/md-block.js b/assets/scripts/md-block.js
new file mode 100644
index 0000000..6e2e924
--- /dev/null
+++ b/assets/scripts/md-block.js
@@ -0,0 +1,304 @@
+/**
+ * <md-block> custom element
+ * @author Lea Verou
+ */
+
+let marked = window.marked;
+let DOMPurify = window.DOMPurify;
+let Prism = window.Prism;
+
+export const URLs = {
+	marked: "https://cdn.jsdelivr.net/npm/marked/src/marked.min.js",
+	DOMPurify: "https://cdn.jsdelivr.net/npm/dompurify@2.3.3/dist/purify.es.min.js"
+}
+
+// Fix indentation
+function deIndent(text) {
+	let indent = text.match(/^[\r\n]*([\t ]+)/);
+
+	if (indent) {
+		indent = indent[1];
+
+		text = text.replace(RegExp("^" + indent, "gm"), "");
+	}
+
+	return text;
+}
+
+export class MarkdownElement extends HTMLElement {
+	constructor() {
+		super();
+
+		this.renderer = Object.assign({}, this.constructor.renderer);
+
+		for (let property in this.renderer) {
+			this.renderer[property] = this.renderer[property].bind(this);
+		}
+	}
+
+	get rendered() {
+		return this.getAttribute("rendered");
+	}
+
+	get mdContent () {
+		return this._mdContent;
+	}
+
+	set mdContent (html) {
+		this._mdContent = html;
+		this._contentFromHTML = false;
+
+		this.render();
+	}
+
+	connectedCallback() {
+		Object.defineProperty(this, "untrusted", {
+			value: this.hasAttribute("untrusted"),
+			enumerable: true,
+			configurable: false,
+			writable: false
+		});
+
+		if (this._mdContent === undefined) {
+			this._contentFromHTML = true;
+			this._mdContent = deIndent(this.innerHTML);
+			// https://github.com/markedjs/marked/issues/874#issuecomment-339995375
+			// marked expects markdown quotes (>) to be un-escaped, otherwise they won't render correctly
+			this._mdContent = this._mdContent.replace(/&gt;/g, '>');
+		}
+
+		this.render();
+	}
+
+	async render () {
+		if (!this.isConnected || this._mdContent === undefined) {
+			return;
+		}
+
+		if (!marked) {
+			marked = import(URLs.marked).then(m => m.marked);
+		}
+
+		marked = await marked;
+
+		marked.setOptions({
+			gfm: true,
+			smartypants: true,
+			langPrefix: "language-",
+		});
+
+		marked.use({renderer: this.renderer});
+
+		let html = this._parse();
+
+		if (this.untrusted) {
+			let mdContent = this._mdContent;
+			html = await MarkdownElement.sanitize(html);
+			if (this._mdContent !== mdContent) {
+				// While we were running this async call, the content changed
+				// We don’t want to overwrite with old data. Abort mission!
+				return;
+			}
+		}
+
+		this.innerHTML = html;
+
+		if (!Prism && URLs.Prism && this.querySelector("code")) {
+			Prism = import(URLs.Prism);
+
+			if (URLs.PrismCSS) {
+				let link = document.createElement("link");
+				link.rel = "stylesheet";
+				link.href = URLs.PrismCSS;
+				document.head.appendChild(link);
+			}
+		}
+
+		if (Prism) {
+			await Prism; // in case it's still loading
+			Prism.highlightAllUnder(this);
+		}
+
+		if (this.src) {
+			this.setAttribute("rendered", this._contentFromHTML? "fallback" : "remote");
+		}
+		else {
+			this.setAttribute("rendered", this._contentFromHTML? "content" : "property");
+		}
+
+		// Fire event
+		let event = new CustomEvent("md-render", {bubbles: true, composed: true});
+		this.dispatchEvent(event);
+	}
+
+	static async sanitize(html) {
+		if (!DOMPurify) {
+			DOMPurify = import(URLs.DOMPurify).then(m => m.default);
+		}
+
+		DOMPurify = await DOMPurify; // in case it's still loading
+
+		return DOMPurify.sanitize(html);
+	}
+};
+
+export class MarkdownSpan extends MarkdownElement {
+	constructor() {
+		super();
+	}
+
+	_parse () {
+		return marked.parseInline(this._mdContent);
+	}
+
+	static renderer = {
+		codespan (code) {
+			if (this._contentFromHTML) {
+				// Inline HTML code needs to be escaped to not be parsed as HTML by the browser
+				// This results in marked double-escaping it, so we need to unescape it
+				code = code.replace(/&amp;(?=[lg]t;)/g, "&");
+			}
+			else {
+				// Remote code may include characters that need to be escaped to be visible in HTML
+				code = code.replace(/</g, "&lt;");
+			}
+
+			return `<code>${code}</code>`;
+		}
+	}
+}
+
+export class MarkdownBlock extends MarkdownElement {
+	constructor() {
+		super();
+	}
+
+	get src() {
+		return this._src;
+	}
+
+	set src(value) {
+		this.setAttribute("src", value);
+	}
+
+	get hmin() {
+		return this._hmin || 1;
+	}
+
+	set hmin(value) {
+		this.setAttribute("hmin", value);
+	}
+
+	get hlinks() {
+		return this._hlinks ?? null;
+	}
+
+	set hlinks(value) {
+		this.setAttribute("hlinks", value);
+	}
+
+	_parse () {
+		return marked.parse(this._mdContent);
+	}
+
+	static renderer = Object.assign({
+		heading (text, level, _raw, slugger) {
+			level = Math.min(6, level + (this.hmin - 1));
+			const id = slugger.slug(text);
+			const hlinks = this.hlinks;
+
+			let content;
+
+			if (hlinks === null) {
+				// No heading links
+				content = text;
+			}
+			else {
+				content = `<a href="#${id}" class="anchor">`;
+
+				if (hlinks === "") {
+					// Heading content is the link
+					content += text + "</a>";
+				}
+				else {
+					// Headings are prepended with a linked symbol
+					content += hlinks + "</a>" + text;
+				}
+			}
+
+			return `
+				<h${level} id="${id}">
+					${content}
+				</h${level}>`;
+		},
+
+		code (code, language, escaped) {
+			if (this._contentFromHTML) {
+				// Inline HTML code needs to be escaped to not be parsed as HTML by the browser
+				// This results in marked double-escaping it, so we need to unescape it
+				code = code.replace(/&amp;(?=[lg]t;)/g, "&");
+			}
+			else {
+				// Remote code may include characters that need to be escaped to be visible in HTML
+				code = code.replace(/</g, "&lt;");
+			}
+
+			return `<pre class="language-${language}"><code>${code}</code></pre>`;
+		}
+	}, MarkdownSpan.renderer);
+
+	static get observedAttributes() {
+		return ["src", "hmin", "hlinks"];
+	}
+
+	attributeChangedCallback(name, oldValue, newValue) {
+		if (oldValue === newValue) {
+			return;
+		}
+
+		switch (name) {
+			case "src":
+				let url;
+				try {
+					url = new URL(newValue, location);
+				}
+				catch (e) {
+					return;
+				}
+
+				let prevSrc = this.src;
+				this._src = url;
+
+				if (this.src !== prevSrc) {
+					fetch(this.src)
+					.then(response => {
+						if (!response.ok) {
+							throw new Error(`Failed to fetch ${this.src}: ${response.status} ${response.statusText}`);
+						}
+
+						return response.text();
+					})
+					.then(text => {
+						this.mdContent = text;
+					})
+					.catch(e => {});
+				}
+
+				break;
+			case "hmin":
+				if (newValue > 0) {
+					this._hmin = +newValue;
+
+					this.render();
+				}
+				break;
+			case "hlinks":
+				this._hlinks = newValue;
+				this.render();
+		}
+	}
+}
+
+
+customElements.define("md-block", MarkdownBlock);
+customElements.define("md-span", MarkdownSpan);
diff --git a/assets/scripts/oneko.js b/assets/scripts/oneko.js
index bd8b882..3159dad 100644
--- a/assets/scripts/oneko.js
+++ b/assets/scripts/oneko.js
@@ -1,4 +1,5 @@
-// oneko.js: https://github.com/adryd325/oneko.js
+// oneko.js: https://github.com/tylxr59/oneko.js
+// fork from original, https://github.com/adryd325/oneko.js
 
 (function oneko() {
   const isReducedMotion =
@@ -90,7 +91,7 @@
     nekoEl.style.width = "32px";
     nekoEl.style.height = "32px";
     nekoEl.style.position = "fixed";
-    nekoEl.style.pointerEvents = "none";
+    nekoEl.style.pointerEvents = "auto";
     nekoEl.style.imageRendering = "pixelated";
     nekoEl.style.left = `${nekoPosX - 16}px`;
     nekoEl.style.top = `${nekoPosY - 16}px`;
@@ -164,7 +165,7 @@
       }
       idleAnimation =
         avalibleIdleAnimations[
-          Math.floor(Math.random() * avalibleIdleAnimations.length)
+        Math.floor(Math.random() * avalibleIdleAnimations.length)
         ];
     }
 
@@ -196,6 +197,49 @@
     idleAnimationFrame += 1;
   }
 
+  function explodeHearts() {
+    const parent = nekoEl.parentElement;
+    const rect = nekoEl.getBoundingClientRect();
+    const scrollLeft = window.scrollX || document.documentElement.scrollLeft;
+    const scrollTop = window.scrollY || document.documentElement.scrollTop;
+    const centerX = rect.left + rect.width / 2 + scrollLeft;
+    const centerY = rect.top + rect.height / 2 + scrollTop;
+
+    for (let i = 0; i < 10; i++) {
+      const heart = document.createElement('div');
+      heart.className = 'heart';
+      heart.textContent = '❤';
+      const offsetX = (Math.random() - 0.5) * 50;
+      const offsetY = (Math.random() - 0.5) * 50;
+      heart.style.left = `${centerX + offsetX - 16}px`;
+      heart.style.top = `${centerY + offsetY - 16}px`;
+      heart.style.transform = `translate(-50%, -50%) rotate(${Math.random() * 360}deg)`;
+      parent.appendChild(heart);
+
+      setTimeout(() => {
+        parent.removeChild(heart);
+      }, 1000);
+    }
+  }
+
+  const style = document.createElement('style');
+  style.innerHTML = `
+		  @keyframes heartBurst {
+			  0% { transform: scale(0); opacity: 1; }
+			  100% { transform: scale(1); opacity: 0; }
+		  }
+		  .heart {
+			  position: absolute;
+			  font-size: 2em;
+			  animation: heartBurst 0.5s ease-out;
+			  animation-fill-mode: forwards;
+			  color: #ab9df2;
+		  }
+	  `;
+
+  document.head.appendChild(style);
+  nekoEl.addEventListener('click', explodeHearts);
+
   function frame() {
     frameCount += 1;
     const diffX = nekoPosX - mousePosX;
@@ -236,4 +280,4 @@
   }
 
   init();
-})();
+})();
\ No newline at end of file
diff --git a/assets/scripts/oneko_old.js b/assets/scripts/oneko_old.js
new file mode 100644
index 0000000..bd8b882
--- /dev/null
+++ b/assets/scripts/oneko_old.js
@@ -0,0 +1,239 @@
+// oneko.js: https://github.com/adryd325/oneko.js
+
+(function oneko() {
+  const isReducedMotion =
+    window.matchMedia(`(prefers-reduced-motion: reduce)`) === true ||
+    window.matchMedia(`(prefers-reduced-motion: reduce)`).matches === true;
+
+  if (isReducedMotion) return;
+
+  const nekoEl = document.createElement("div");
+
+  let nekoPosX = 32;
+  let nekoPosY = 32;
+
+  let mousePosX = 0;
+  let mousePosY = 0;
+
+  let frameCount = 0;
+  let idleTime = 0;
+  let idleAnimation = null;
+  let idleAnimationFrame = 0;
+
+  const nekoSpeed = 10;
+  const spriteSets = {
+    idle: [[-3, -3]],
+    alert: [[-7, -3]],
+    scratchSelf: [
+      [-5, 0],
+      [-6, 0],
+      [-7, 0],
+    ],
+    scratchWallN: [
+      [0, 0],
+      [0, -1],
+    ],
+    scratchWallS: [
+      [-7, -1],
+      [-6, -2],
+    ],
+    scratchWallE: [
+      [-2, -2],
+      [-2, -3],
+    ],
+    scratchWallW: [
+      [-4, 0],
+      [-4, -1],
+    ],
+    tired: [[-3, -2]],
+    sleeping: [
+      [-2, 0],
+      [-2, -1],
+    ],
+    N: [
+      [-1, -2],
+      [-1, -3],
+    ],
+    NE: [
+      [0, -2],
+      [0, -3],
+    ],
+    E: [
+      [-3, 0],
+      [-3, -1],
+    ],
+    SE: [
+      [-5, -1],
+      [-5, -2],
+    ],
+    S: [
+      [-6, -3],
+      [-7, -2],
+    ],
+    SW: [
+      [-5, -3],
+      [-6, -1],
+    ],
+    W: [
+      [-4, -2],
+      [-4, -3],
+    ],
+    NW: [
+      [-1, 0],
+      [-1, -1],
+    ],
+  };
+
+  function init() {
+    nekoEl.id = "oneko";
+    nekoEl.ariaHidden = true;
+    nekoEl.style.width = "32px";
+    nekoEl.style.height = "32px";
+    nekoEl.style.position = "fixed";
+    nekoEl.style.pointerEvents = "none";
+    nekoEl.style.imageRendering = "pixelated";
+    nekoEl.style.left = `${nekoPosX - 16}px`;
+    nekoEl.style.top = `${nekoPosY - 16}px`;
+    nekoEl.style.zIndex = Number.MAX_VALUE;
+
+    let nekoFile = "./oneko.gif"
+    const curScript = document.currentScript
+    if (curScript && curScript.dataset.cat) {
+      nekoFile = curScript.dataset.cat
+    }
+    nekoEl.style.backgroundImage = `url(${nekoFile})`;
+
+    document.body.appendChild(nekoEl);
+
+    document.addEventListener("mousemove", function (event) {
+      mousePosX = event.clientX;
+      mousePosY = event.clientY;
+    });
+
+    window.requestAnimationFrame(onAnimationFrame);
+  }
+
+  let lastFrameTimestamp;
+
+  function onAnimationFrame(timestamp) {
+    // Stops execution if the neko element is removed from DOM
+    if (!nekoEl.isConnected) {
+      return;
+    }
+    if (!lastFrameTimestamp) {
+      lastFrameTimestamp = timestamp;
+    }
+    if (timestamp - lastFrameTimestamp > 100) {
+      lastFrameTimestamp = timestamp
+      frame()
+    }
+    window.requestAnimationFrame(onAnimationFrame);
+  }
+
+  function setSprite(name, frame) {
+    const sprite = spriteSets[name][frame % spriteSets[name].length];
+    nekoEl.style.backgroundPosition = `${sprite[0] * 32}px ${sprite[1] * 32}px`;
+  }
+
+  function resetIdleAnimation() {
+    idleAnimation = null;
+    idleAnimationFrame = 0;
+  }
+
+  function idle() {
+    idleTime += 1;
+
+    // every ~ 20 seconds
+    if (
+      idleTime > 10 &&
+      Math.floor(Math.random() * 200) == 0 &&
+      idleAnimation == null
+    ) {
+      let avalibleIdleAnimations = ["sleeping", "scratchSelf"];
+      if (nekoPosX < 32) {
+        avalibleIdleAnimations.push("scratchWallW");
+      }
+      if (nekoPosY < 32) {
+        avalibleIdleAnimations.push("scratchWallN");
+      }
+      if (nekoPosX > window.innerWidth - 32) {
+        avalibleIdleAnimations.push("scratchWallE");
+      }
+      if (nekoPosY > window.innerHeight - 32) {
+        avalibleIdleAnimations.push("scratchWallS");
+      }
+      idleAnimation =
+        avalibleIdleAnimations[
+          Math.floor(Math.random() * avalibleIdleAnimations.length)
+        ];
+    }
+
+    switch (idleAnimation) {
+      case "sleeping":
+        if (idleAnimationFrame < 8) {
+          setSprite("tired", 0);
+          break;
+        }
+        setSprite("sleeping", Math.floor(idleAnimationFrame / 4));
+        if (idleAnimationFrame > 192) {
+          resetIdleAnimation();
+        }
+        break;
+      case "scratchWallN":
+      case "scratchWallS":
+      case "scratchWallE":
+      case "scratchWallW":
+      case "scratchSelf":
+        setSprite(idleAnimation, idleAnimationFrame);
+        if (idleAnimationFrame > 9) {
+          resetIdleAnimation();
+        }
+        break;
+      default:
+        setSprite("idle", 0);
+        return;
+    }
+    idleAnimationFrame += 1;
+  }
+
+  function frame() {
+    frameCount += 1;
+    const diffX = nekoPosX - mousePosX;
+    const diffY = nekoPosY - mousePosY;
+    const distance = Math.sqrt(diffX ** 2 + diffY ** 2);
+
+    if (distance < nekoSpeed || distance < 48) {
+      idle();
+      return;
+    }
+
+    idleAnimation = null;
+    idleAnimationFrame = 0;
+
+    if (idleTime > 1) {
+      setSprite("alert", 0);
+      // count down after being alerted before moving
+      idleTime = Math.min(idleTime, 7);
+      idleTime -= 1;
+      return;
+    }
+
+    let direction;
+    direction = diffY / distance > 0.5 ? "N" : "";
+    direction += diffY / distance < -0.5 ? "S" : "";
+    direction += diffX / distance > 0.5 ? "W" : "";
+    direction += diffX / distance < -0.5 ? "E" : "";
+    setSprite(direction, frameCount);
+
+    nekoPosX -= (diffX / distance) * nekoSpeed;
+    nekoPosY -= (diffY / distance) * nekoSpeed;
+
+    nekoPosX = Math.min(Math.max(16, nekoPosX), window.innerWidth - 16);
+    nekoPosY = Math.min(Math.max(16, nekoPosY), window.innerHeight - 16);
+
+    nekoEl.style.left = `${nekoPosX - 16}px`;
+    nekoEl.style.top = `${nekoPosY - 16}px`;
+  }
+
+  init();
+})();
diff --git a/assets/scripts/uptime.js b/assets/scripts/uptime.js
index 8c6f666..fbb3f30 100644
--- a/assets/scripts/uptime.js
+++ b/assets/scripts/uptime.js
@@ -45,7 +45,6 @@ document.addEventListener('DOMContentLoaded', async function() {
         }
     }
 
-    // Fetch the uptime immediately and then every 10 seconds
     fetchUptime();
     setInterval(fetchUptime, 10000);
 });
diff --git a/gallery.html b/gallery.html
index 78a36cf..af43b28 100644
--- a/gallery.html
+++ b/gallery.html
@@ -6,23 +6,91 @@
     <meta name="description" content="Quinten's gallery, where they infrequently post images of whatever.">
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="stylesheet" href="style.css">
+    <link rel="stylesheet" href="/style.css">
+
+    <script defer src="/assets/scripts/heartbeat.js"></script>
+    <script defer src="/assets/scripts/onekoswap.js"></script>
+    <script defer src="/assets/scripts/oneko.js" data-cat="/assets/oneko.gif"></script>
 
     <style>
         h6 {
             margin-bottom: 1rem;
         }
-
+        .gallery-divider {
+            width: 100%; /* Fill the horizontal space */
+            white-space: nowrap; /* Prevent wrapping */
+            overflow: hidden; /* Hide overflow */
+            font-size: 2rem;
+            margin: 0;
+            margin-top: 1em;
+            margin-bottom: 1em;
+        }
         .masonry { /* Masonry container */
             column-count: 2;
             column-gap: 1em;
         }
+            .gallery-masonry-img { /* Masonry bricks or child elements */
+              background-color: #eee;
+              display: inline-block;
+              margin: 0 0 1em;
+              width: 100%;
+            }
 
-        .gallery-img { /* Masonry bricks or child elements */
-          background-color: #eee;
-          display: inline-block;
-          margin: 0 0 1em;
-          width: 100%;
+        .gallery-img {
+            margin-top: 1em;
+            margin-bottom: 3em;
+            display: block;
+            margin-left: auto;
+            margin-right: auto;
+            width: 60%;
+            height: auto;
+        }
+
+        .gallery-video-box {
+            margin-top: 1em;
+            margin-bottom: 3em;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+        }
+            .gallery-video {
+                width: 100%;
+                height: auto;
+            }
+        .gallery-media-caption {
+            font-weight: 500;
+            font-style: italic;
+            font-size: 1.2rem;
+            margin: 0;
+            padding: 0;
+            margin-top: 0.5em;
+            color: #e9e9e9a2;
+            }
+        .gallery-spoiler-text {
+          background: white;
+          color: transparent;
+          cursor: help;
+          user-select: none;
+          transition: background 0.2s ease, color 0.1s ease;;
+        }
+            .gallery-spoiler-text:hover,
+            .gallery-spoiler-text:focus {
+              background: black;
+              color: inherit;
+            }
+
+        ul {
+            list-style-type: none;
+            margin: 0;
+            padding-left: 0;
+        }
+        a {
+            color: #E9E9E9;
+            text-decoration: underline;
+            position: relative;
+        }
+        ul li::before {
+            content: "* ";
         }
     </style>
 
@@ -97,46 +165,32 @@
 
             <div class="box">
                 <h3>Gallery</h3>
-                <p>Just posting some pictures here whenever I feel like it ^^</p>
-                <h6>Warning: full-res images of ~1.5MB each!</h6>
-            </div>
+                <p>A media-first infrequent blog-gallery-post-whatever page.</p>
+                <h6>Warning: full-res images of ~1.5MB e.a. and 1080p30 HEVC videos!
+                <br>
+                Also: If videos say they are corrupt, refresh the page. This seems to happen randomly and isn't my fault, blame Firefox (probably??)</h6>
+                <br>
+                <br>
+                <h4>Directory</h4>
+                    <ul>
 
-
-            <div class="box gallerybox">
-                <h4>Home</h4>
-                <p>Clear skies = starry night! Came for the Pleiades (saw plenty, but no photos) and stayed for the pretty stars up above. Also snatched a hint of the northern lights as they faded away (Kp7+ during daytime).</p>
-                <h6>2024/08/11</h6>
-                <div class="masonry">
-                    <img class="gallery-img" loading="lazy" src="./assets/gallery/20240811_home/98f78a31-4b39-4120-8ed8-62f36c3ca70e.webp" alt="A long-exposure image of a clear night sky, full with stars and a clear density difference in the form of a band: the milky way.">
-                    <img class="gallery-img" loading="lazy" src="./assets/gallery/20240811_home/1f6fd402-7b5b-420c-a940-f37a2d858c17.webp" alt="An image of a blueish horizon taken at night, silhouettes of a forest at the bottom. Two large blobs of a purple/pink-ish hue are visible.">
-                </div>
-            </div>
-
-            <div class="box gallerybox" id="Chamonix_20240802">
-                <h4>Chamonix</h4>
-                <p>Heavy thunderstorms a few kms north in the mountains made for some nice shots. These are all raw frames from videos.</p>
-                <h6>2024/08/02</h6>
-                <div class="masonry">
-                    <img class="gallery-img" loading="lazy" src="./assets/gallery/20240802_chamonix/10718a89-7aba-4740-9a98-3ef5703770c6.webp" alt="Photo of a curvy lightning flash coming in from the top right of the frame, lighting a dark sky in hues of purple and blue.">
-                    <img class="gallery-img" loading="lazy" src="./assets/gallery/20240802_chamonix/ea7310c1-8db4-451c-83a8-fbc836c2f88d.webp" alt="Another photo of a lightning bolt, this time in black and white and covering the all horizontal space.">
-                    <img class="gallery-img" loading="lazy" src="./assets/gallery/20240802_chamonix/a286c492-b9fb-4799-a675-472a1db0f3e5.webp" alt="A smaller lightning flash.">
-                    <img class="gallery-img" loading="lazy" src="./assets/gallery/20240802_chamonix/0cc60bc9-0a97-4cf5-a820-f7c8e5f078e0.webp" alt="The largest lightning flash, covering most of the frame. The photo is overexposed, making the entire sky seem a bright purple and blue.">
-                    <img class="gallery-img" loading="lazy" src="./assets/gallery/20240802_chamonix/f43391d0-3665-4ad3-9b06-440bcd71baec.webp" alt="A photo of the night sky, showing a horizontal band of sky surrounded by thick clouds. The sky contains a large amount of stars.">
+                        <li><a href="/gallery/20250301_porter.html"><p style="display: inline;">Porter Robinson SMILE :D World Tour</p></a>
+                            <br><span> >>2025/03/01 @ Melkweg, Amsterdam</span></li>
+                        
+                        <li><a href="/gallery/20240802_chamonix.html"><p style="display: inline;">Thunderstorms in the French Alps</p></a>
+                            <br><span> >>2024/08/02 @ Chamonix</span></li>
+                        
+                        <li><a href="/gallery/20240708_amsterdam.html"><p style="display: inline;">Day out in Amsterdam</p></a>
+                            <br><span> >>2024/07/08 @ Amsterdam</span></li>
+                        
+                        <li><a href=""><p style="display: inline;"></p></a>
+                            <br><span> >></span></li>
                     
-                </div>
+                        </ul>
             </div>
 
-            <div class="box gallerybox" id="Amsterdam_20240708">
-                <h4>Amsterdam</h4>
-                <p>Fun day out in Amsterdam</p>
-                <h6>2024/07/08</h6>
-                <div class="masonry">
-                    <img class="gallery-img" loading="lazy" src="./assets/gallery/20240708_amsterdam/dda733da-5158-4cef-abf3-df8e179af10d.webp" alt="A photo of the park next to the Rijksmuseum in Amsterdam, The Netherlands, taken through a fence. The garden consists of neatly organised rectangular patches, most containing a variety of colorful flowers and being surrounded by small hedges. Many people are sitting on wooden benches or walking around in the small park.">
-                    <img class="gallery-img" loading="lazy" src="./assets/gallery/20240708_amsterdam/79acb362-9361-4466-bbcd-454bc082406d.webp" alt="A photo looking directly up in a narrow street. Both on the left and right are old, narrow, dark-red brick houses typical of Amsterdam (see &quot;grachtenpanden&quot;). There are bare light bulbs hanging on a line across the two sides of the street, a cloudy blue-ish sky and parts of two navy blue patio umbrellas.">
-                    <img class="gallery-img" loading="lazy" src="./assets/gallery/20240708_amsterdam/272d8d9f-e1d3-4910-ac47-f15c908af5fd.webp" alt="A photo taken from inside of a small metro station. It shows art on one of the tunnels. A dog (corgi) and cat (calico?) can be seen in front, with various other inanimate objects also visible further along the tunnel. Context for this art: All of these items and animals have been found while digging up this metro tunnel.">
-                    <img class="gallery-img" loading="lazy" src="./assets/gallery/20240708_amsterdam/bd7b70b5-fbe5-43db-be5b-e69576e6e6e5.webp" alt="A photo taken inside the museum of modern contemporary art. Perspective from inside of a small room with black wall with bright pink round spots all over it, and displays on either side inside of the walls containing more circles of various colors pink, dark blue, and purple. Looking out through a doorway in the center we see a small part of a hallway lit in bright pink, and a completely turqouise stairway leading up behind that.">
-                </div>
-            </div>
+
+
 
 
 
@@ -147,10 +201,10 @@
                 <p>Description</p>
                 <h6>YYYY/MM/DD</h6>
                 <div class="masonry">
-                    <img class="gallery-img" loading="lazy" src="./assets/gallery/" alt="">
-                    <img class="gallery-img" loading="lazy" src="./assets/gallery/" alt="">
-                    <img class="gallery-img" loading="lazy" src="./assets/gallery/" alt="">
-                    <img class="gallery-img" loading="lazy" src="./assets/gallery/" alt="">
+                    <img class="gallery-masonry-img" loading="lazy" src="./assets/gallery/" alt="">
+                    <img class="gallery-masonry-img" loading="lazy" src="./assets/gallery/" alt="">
+                    <img class="gallery-masonry-img" loading="lazy" src="./assets/gallery/" alt="">
+                    <img class="gallery-masonry-img" loading="lazy" src="./assets/gallery/" alt="">
                 </div>
             </div>
             -->
@@ -194,7 +248,4 @@
 
 
 </body>
-<script src="/assets/scripts/heartbeat.js"></script>
-<script src="/assets/scripts/onekoswap.js"></script>
-<script src="/assets/scripts/oneko.js" data-cat="/assets/oneko.gif"></script>
 </html>
\ No newline at end of file
diff --git a/gallery/20240708_amsterdam.html b/gallery/20240708_amsterdam.html
new file mode 100644
index 0000000..bf04448
--- /dev/null
+++ b/gallery/20240708_amsterdam.html
@@ -0,0 +1,194 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <title>Gallery - Quintens Outpost</title>
+    <meta name="description" content="Quinten's gallery, where they infrequently post images of whatever.">
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="/style.css">
+
+    <script defer src="/assets/scripts/heartbeat.js"></script>
+    <script defer src="/assets/scripts/onekoswap.js"></script>
+    <script defer src="/assets/scripts/oneko.js" data-cat="/assets/oneko.gif"></script>
+
+    <style>
+        h6 {
+            margin-bottom: 1rem;
+        }
+        .gallery-divider {
+            width: 100%; /* Fill the horizontal space */
+            white-space: nowrap; /* Prevent wrapping */
+            overflow: hidden; /* Hide overflow */
+            font-size: 2rem;
+            margin: 0;
+            margin-top: 1em;
+            margin-bottom: 1em;
+        }
+        .masonry { /* Masonry container */
+            column-count: 2;
+            column-gap: 1em;
+        }
+            .gallery-masonry-img { /* Masonry bricks or child elements */
+              background-color: #eee;
+              display: inline-block;
+              margin: 0 0 1em;
+              width: 100%;
+            }
+
+        .gallery-img {
+            margin-top: 1em;
+            margin-bottom: 3em;
+            display: block;
+            margin-left: auto;
+            margin-right: auto;
+            width: 60%;
+            height: auto;
+        }
+
+        .gallery-video-box {
+            margin-top: 1em;
+            margin-bottom: 3em;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+        }
+            .gallery-video {
+                width: 100%;
+                height: auto;
+            }
+            .gallery-media-caption {
+                font-weight: 500;
+                font-style: italic;
+                font-size: 1.2rem;
+                margin: 0;
+                padding: 0;
+                margin-top: 0.5em;
+                color: #e9e9e9a2;
+                }
+
+            .gallery-spoiler-text {
+              background: white;
+              color: transparent;
+              cursor: help;
+              user-select: none;
+              transition: background 0.2s ease, color 0.1s ease;;
+            }
+            .gallery-spoiler-text:hover,
+            .gallery-spoiler-text:focus {
+              background: black;
+              color: inherit;
+            }
+    </style>
+
+</head>
+
+<body>
+
+    <div class="container" id="top">
+
+        <div class="sidebar sidebar-left">
+        </div>
+        <div class="container-main">
+
+            <div id="maintitlebox">
+                <div id="titleandcat" class="box">
+                    <!-- <img src="/assets/dance_transparent.gif" id="sapari-dance" alt="sapari cat dancing gif"> -->
+                    <h1 id="maintitle"><a style="text-decoration: none; color: #E9E9E9;" href="/">Quinten's Outpost</a></h1>
+                    <!-- <img src="/assets/dance_transparent.gif" id="sapari-dance" alt="sapari cat dancing gif"></img> -->
+
+                </div>
+                <button id="oneko-button" class="button">:3</button>
+            </div>
+
+            <div id="subtitlebox">
+                <div id="links" class="box">
+                    <a class="linkbox link" href="/">
+                    <p>home</p></a>
+                    <a class="linkbox link" href="/links.html">
+                    <p>links</p></a>
+                    <a class="linkbox link" href="/updates.html">
+                    <p>updates</p></a>
+                    <a class="linkbox link" href="/gallery.html">
+                    <p>gallery</p></a>
+                    <!-- new button template
+                    <a class="linkbox link" href="" target="_blank">
+                    <p></p></a>
+                    -->
+                </div>
+                <div id="heartbeatbox" class="box">
+                    <a href="https://heartbeat.quinten0508.com" target="_blank" class="link"><p>Status</p></a><p>:&nbsp;</p>
+                    <p id="heartbeat-time">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</p> <!-- &nbsp; prevents text shift after load, doenst work with online T-T -->
+                </div>
+            </div>
+
+            <div id="external-links">
+                <div id="links" class="box">
+                    <a class="linkbox link" href="https://x.com/quinten0508" rel="me" target="_blank">
+                    <p>twitter</p></a>
+                    <a class="linkbox link" href="https://www.last.fm/user/Quinten0508" rel="me" target="_blank">
+                    <p>last.fm</p></a>
+                    <a class="linkbox link" href="https://gitea.quinten0508.com/quinten/website-frontend" rel="me" target="_blank">
+                    <p>source</p></a>
+                    <a class="linkbox link" href="https://t.me/quinten0508" rel="me" target="_blank">
+                    <p>telegram</p></a>
+                    <!-- :3 13 year old firefox bug https://bugzilla.mozilla.org/show_bug.cgi?id=646552 -->
+                    <a class="linkbox link" onClick="javascript:window.open('mailto:quinten@tuta.com', 'mail');event.preventDefault()" href="mailto:quinten@tuta.com" rel="me" target="_blank"> 
+                    <p>email</p></a>
+                    <!-- new button template
+                    <a class="linkbox link" href="" target="_blank">
+                    <p></p></a>
+                    -->
+                </div>
+            </div>
+
+            <div id="directory-box" class="box">
+                <!-- must resist the urge to dynamically generate this, fuck js -->
+                 <h5 style="display: inline-block;  padding: 0;">Current directory:</h5>
+                 <p style="display: inline-block;">
+                <img src="/assets/icons/tux.svg" id="directory-icon">/<a class="link" href="/">home/quinten</a>/<a class="link" href="/gallery.html">gallery</a>/<a class="link" href="/gallery/20250301_porter.html">20250301_porter</a>
+                </p>
+            </div>
+
+
+            <div class="box gallerybox" id="Amsterdam_20240708">
+                <h4>Amsterdam</h4>
+                <p>Fun day out in Amsterdam</p>
+                <h6>2024/07/08</h6>
+                <div class="masonry">
+                    <img class="gallery-masonry-img" loading="lazy" src="/assets/gallery/20240708_amsterdam/dda733da-5158-4cef-abf3-df8e179af10d.webp" alt="A photo of the park next to the Rijksmuseum in Amsterdam, The Netherlands, taken through a fence. The garden consists of neatly organised rectangular patches, most containing a variety of colorful flowers and being surrounded by small hedges. Many people are sitting on wooden benches or walking around in the small park.">
+                    <img class="gallery-masonry-img" loading="lazy" src="/assets/gallery/20240708_amsterdam/79acb362-9361-4466-bbcd-454bc082406d.webp" alt="A photo looking directly up in a narrow street. Both on the left and right are old, narrow, dark-red brick houses typical of Amsterdam (see &quot;grachtenpanden&quot;). There are bare light bulbs hanging on a line across the two sides of the street, a cloudy blue-ish sky and parts of two navy blue patio umbrellas.">
+                    <img class="gallery-masonry-img" loading="lazy" src="/assets/gallery/20240708_amsterdam/272d8d9f-e1d3-4910-ac47-f15c908af5fd.webp" alt="A photo taken from inside of a small metro station. It shows art on one of the tunnels. A dog (corgi) and cat (calico?) can be seen in front, with various other inanimate objects also visible further along the tunnel. Context for this art: All of these items and animals have been found while digging up this metro tunnel.">
+                    <img class="gallery-masonry-img" loading="lazy" src="/assets/gallery/20240708_amsterdam/bd7b70b5-fbe5-43db-be5b-e69576e6e6e5.webp" alt="A photo taken inside the museum of modern contemporary art. Perspective from inside of a small room with black wall with bright pink round spots all over it, and displays on either side inside of the walls containing more circles of various colors pink, dark blue, and purple. Looking out through a doorway in the center we see a small part of a hallway lit in bright pink, and a completely turqouise stairway leading up behind that.">
+                </div>
+            </div>
+
+
+        </div> <!--container-main-->
+
+        <div class="sidebar sidebar-right" id="links-tree">
+            <div class="box" style="margin: 0;">
+                <h5 style="padding-bottom: 0;">Tree</h5>
+                <ul style="margin-bottom: 0;">
+                    <li><a href="#top">Top</a></li>
+                    <li><a href="#Chamonix_20240802">Chamonix</a></li>
+                    <li><a href="#Amsterdam_20240708">Amsterdam</a></li>
+                </ul>
+            </div>      
+
+        </div>
+        <!--</div>
+        </div>-->
+        
+        
+        </div> <!--sidebar-->
+        <div id="stripes">
+            <img src="/assets/stripes.svg" id="stripes">
+        </div>
+
+    </div>  <!--container-->
+
+
+
+</body>
+</html>
\ No newline at end of file
diff --git a/gallery/20240802_chamonix.html b/gallery/20240802_chamonix.html
new file mode 100644
index 0000000..2e1b075
--- /dev/null
+++ b/gallery/20240802_chamonix.html
@@ -0,0 +1,196 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <title>Gallery - Quintens Outpost</title>
+    <meta name="description" content="Quinten's gallery, where they infrequently post images of whatever.">
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="/style.css">
+
+    <script defer src="/assets/scripts/heartbeat.js"></script>
+    <script defer src="/assets/scripts/onekoswap.js"></script>
+    <script defer src="/assets/scripts/oneko.js" data-cat="/assets/oneko.gif"></script>
+
+    <style>
+        h6 {
+            margin-bottom: 1rem;
+        }
+        .gallery-divider {
+            width: 100%; /* Fill the horizontal space */
+            white-space: nowrap; /* Prevent wrapping */
+            overflow: hidden; /* Hide overflow */
+            font-size: 2rem;
+            margin: 0;
+            margin-top: 1em;
+            margin-bottom: 1em;
+        }
+        .masonry { /* Masonry container */
+            column-count: 2;
+            column-gap: 1em;
+        }
+            .gallery-masonry-img { /* Masonry bricks or child elements */
+              background-color: #eee;
+              display: inline-block;
+              margin: 0 0 1em;
+              width: 100%;
+            }
+
+        .gallery-img {
+            margin-top: 1em;
+            margin-bottom: 3em;
+            display: block;
+            margin-left: auto;
+            margin-right: auto;
+            width: 60%;
+            height: auto;
+        }
+
+        .gallery-video-box {
+            margin-top: 1em;
+            margin-bottom: 3em;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+        }
+            .gallery-video {
+                width: 100%;
+                height: auto;
+            }
+            .gallery-media-caption {
+                font-weight: 500;
+                font-style: italic;
+                font-size: 1.2rem;
+                margin: 0;
+                padding: 0;
+                margin-top: 0.5em;
+                color: #e9e9e9a2;
+                }
+
+            .gallery-spoiler-text {
+              background: white;
+              color: transparent;
+              cursor: help;
+              user-select: none;
+              transition: background 0.2s ease, color 0.1s ease;;
+            }
+            .gallery-spoiler-text:hover,
+            .gallery-spoiler-text:focus {
+              background: black;
+              color: inherit;
+            }
+    </style>
+
+</head>
+
+<body>
+
+    <div class="container" id="top">
+
+        <div class="sidebar sidebar-left">
+        </div>
+        <div class="container-main">
+
+            <div id="maintitlebox">
+                <div id="titleandcat" class="box">
+                    <!-- <img src="/assets/dance_transparent.gif" id="sapari-dance" alt="sapari cat dancing gif"> -->
+                    <h1 id="maintitle"><a style="text-decoration: none; color: #E9E9E9;" href="/">Quinten's Outpost</a></h1>
+                    <!-- <img src="/assets/dance_transparent.gif" id="sapari-dance" alt="sapari cat dancing gif"></img> -->
+
+                </div>
+                <button id="oneko-button" class="button">:3</button>
+            </div>
+
+            <div id="subtitlebox">
+                <div id="links" class="box">
+                    <a class="linkbox link" href="/">
+                    <p>home</p></a>
+                    <a class="linkbox link" href="/links.html">
+                    <p>links</p></a>
+                    <a class="linkbox link" href="/updates.html">
+                    <p>updates</p></a>
+                    <a class="linkbox link" href="/gallery.html">
+                    <p>gallery</p></a>
+                    <!-- new button template
+                    <a class="linkbox link" href="" target="_blank">
+                    <p></p></a>
+                    -->
+                </div>
+                <div id="heartbeatbox" class="box">
+                    <a href="https://heartbeat.quinten0508.com" target="_blank" class="link"><p>Status</p></a><p>:&nbsp;</p>
+                    <p id="heartbeat-time">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</p> <!-- &nbsp; prevents text shift after load, doenst work with online T-T -->
+                </div>
+            </div>
+
+            <div id="external-links">
+                <div id="links" class="box">
+                    <a class="linkbox link" href="https://x.com/quinten0508" rel="me" target="_blank">
+                    <p>twitter</p></a>
+                    <a class="linkbox link" href="https://www.last.fm/user/Quinten0508" rel="me" target="_blank">
+                    <p>last.fm</p></a>
+                    <a class="linkbox link" href="https://gitea.quinten0508.com/quinten/website-frontend" rel="me" target="_blank">
+                    <p>source</p></a>
+                    <a class="linkbox link" href="https://t.me/quinten0508" rel="me" target="_blank">
+                    <p>telegram</p></a>
+                    <!-- :3 13 year old firefox bug https://bugzilla.mozilla.org/show_bug.cgi?id=646552 -->
+                    <a class="linkbox link" onClick="javascript:window.open('mailto:quinten@tuta.com', 'mail');event.preventDefault()" href="mailto:quinten@tuta.com" rel="me" target="_blank"> 
+                    <p>email</p></a>
+                    <!-- new button template
+                    <a class="linkbox link" href="" target="_blank">
+                    <p></p></a>
+                    -->
+                </div>
+            </div>
+
+            <div id="directory-box" class="box">
+                <!-- must resist the urge to dynamically generate this, fuck js -->
+                 <h5 style="display: inline-block;  padding: 0;">Current directory:</h5>
+                 <p style="display: inline-block;">
+                <img src="/assets/icons/tux.svg" id="directory-icon">/<a class="link" href="/">home/quinten</a>/<a class="link" href="/gallery.html">gallery</a>
+                </p>
+            </div>
+
+
+            <div class="box gallerybox" id="Chamonix_20240802">
+                <h4>Chamonix</h4>
+                <p>Heavy thunderstorms a few kms north in the mountains made for some nice shots. These are all raw frames from videos.</p>
+                <h6>2024/08/02</h6>
+                <div class="masonry">
+                    <img class="gallery-masonry-img" loading="lazy" src="/assets/gallery/20240802_chamonix/10718a89-7aba-4740-9a98-3ef5703770c6.webp" alt="Photo of a curvy lightning flash coming in from the top right of the frame, lighting a dark sky in hues of purple and blue.">
+                    <img class="gallery-masonry-img" loading="lazy" src="/assets/gallery/20240802_chamonix/ea7310c1-8db4-451c-83a8-fbc836c2f88d.webp" alt="Another photo of a lightning bolt, this time in black and white and covering the all horizontal space.">
+                    <img class="gallery-masonry-img" loading="lazy" src="/assets/gallery/20240802_chamonix/a286c492-b9fb-4799-a675-472a1db0f3e5.webp" alt="A smaller lightning flash.">
+                    <img class="gallery-masonry-img" loading="lazy" src="/assets/gallery/20240802_chamonix/0cc60bc9-0a97-4cf5-a820-f7c8e5f078e0.webp" alt="The largest lightning flash, covering most of the frame. The photo is overexposed, making the entire sky seem a bright purple and blue.">
+                    <img class="gallery-masonry-img" loading="lazy" src="/assets/gallery/20240802_chamonix/f43391d0-3665-4ad3-9b06-440bcd71baec.webp" alt="A photo of the night sky, showing a horizontal band of sky surrounded by thick clouds. The sky contains a large amount of stars.">
+                    
+                </div>
+            </div>
+
+
+        </div> <!--container-main-->
+
+        <div class="sidebar sidebar-right" id="links-tree">
+            <div class="box" style="margin: 0;">
+                <h5 style="padding-bottom: 0;">Tree</h5>
+                <ul style="margin-bottom: 0;">
+                    <li><a href="#top">Top</a></li>
+                    <li><a href="#Chamonix_20240802">Chamonix</a></li>
+                    <li><a href="#Amsterdam_20240708">Amsterdam</a></li>
+                </ul>
+            </div>      
+
+        </div>
+        <!--</div>
+        </div>-->
+        
+        
+        </div> <!--sidebar-->
+        <div id="stripes">
+            <img src="/assets/stripes.svg" id="stripes">
+        </div>
+
+    </div>  <!--container-->
+
+
+
+</body>
+</html>
\ No newline at end of file
diff --git a/gallery/20250301_porter.html b/gallery/20250301_porter.html
new file mode 100644
index 0000000..96994a9
--- /dev/null
+++ b/gallery/20250301_porter.html
@@ -0,0 +1,239 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <title>Gallery - Quintens Outpost</title>
+    <meta name="description" content="Quinten's gallery, where they infrequently post images of whatever.">
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="/style.css">
+
+    <script defer src="/assets/scripts/heartbeat.js"></script>
+    <script defer src="/assets/scripts/onekoswap.js"></script>
+    <script defer src="/assets/scripts/oneko.js" data-cat="/assets/oneko.gif"></script>
+
+    <style>
+        h6 {
+            margin-bottom: 1rem;
+        }
+        .gallery-divider {
+            width: 100%; /* Fill the horizontal space */
+            white-space: nowrap; /* Prevent wrapping */
+            overflow: hidden; /* Hide overflow */
+            font-size: 2rem;
+            margin: 0;
+            margin-top: 1em;
+            margin-bottom: 1em;
+        }
+        .masonry { /* Masonry container */
+            column-count: 2;
+            column-gap: 1em;
+        }
+            .gallery-masonry-img { /* Masonry bricks or child elements */
+              background-color: #eee;
+              display: inline-block;
+              margin: 0 0 1em;
+              width: 100%;
+            }
+
+        .gallery-img {
+            margin-top: 1em;
+            margin-bottom: 3em;
+            display: block;
+            margin-left: auto;
+            margin-right: auto;
+            width: 60%;
+            height: auto;
+        }
+
+        .gallery-video-box {
+            margin-top: 1em;
+            margin-bottom: 3em;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+        }
+            .gallery-video {
+                width: 100%;
+                height: auto;
+            }
+            .gallery-media-caption {
+                font-weight: 500;
+                font-style: italic;
+                font-size: 1.2rem;
+                margin: 0;
+                padding: 0;
+                margin-top: 0.5em;
+                color: #e9e9e9a2;
+                }
+
+            .gallery-spoiler-text {
+              background: white;
+              color: transparent;
+              cursor: help;
+              user-select: none;
+              transition: background 0.2s ease, color 0.1s ease;;
+            }
+            .gallery-spoiler-text:hover,
+            .gallery-spoiler-text:focus {
+              background: black;
+              color: inherit;
+            }
+    </style>
+
+</head>
+
+<body>
+
+    <div class="container" id="top">
+
+        <div class="sidebar sidebar-left">
+        </div>
+        <div class="container-main">
+
+            <div id="maintitlebox">
+                <div id="titleandcat" class="box">
+                    <!-- <img src="/assets/dance_transparent.gif" id="sapari-dance" alt="sapari cat dancing gif"> -->
+                    <h1 id="maintitle"><a style="text-decoration: none; color: #E9E9E9;" href="/">Quinten's Outpost</a></h1>
+                    <!-- <img src="/assets/dance_transparent.gif" id="sapari-dance" alt="sapari cat dancing gif"></img> -->
+
+                </div>
+                <button id="oneko-button" class="button">:3</button>
+            </div>
+
+            <div id="subtitlebox">
+                <div id="links" class="box">
+                    <a class="linkbox link" href="/">
+                    <p>home</p></a>
+                    <a class="linkbox link" href="/links.html">
+                    <p>links</p></a>
+                    <a class="linkbox link" href="/updates.html">
+                    <p>updates</p></a>
+                    <a class="linkbox link" href="/gallery.html">
+                    <p>gallery</p></a>
+                    <!-- new button template
+                    <a class="linkbox link" href="" target="_blank">
+                    <p></p></a>
+                    -->
+                </div>
+                <div id="heartbeatbox" class="box">
+                    <a href="https://heartbeat.quinten0508.com" target="_blank" class="link"><p>Status</p></a><p>:&nbsp;</p>
+                    <p id="heartbeat-time">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</p> <!-- &nbsp; prevents text shift after load, doenst work with online T-T -->
+                </div>
+            </div>
+
+            <div id="external-links">
+                <div id="links" class="box">
+                    <a class="linkbox link" href="https://x.com/quinten0508" rel="me" target="_blank">
+                    <p>twitter</p></a>
+                    <a class="linkbox link" href="https://www.last.fm/user/Quinten0508" rel="me" target="_blank">
+                    <p>last.fm</p></a>
+                    <a class="linkbox link" href="https://gitea.quinten0508.com/quinten/website-frontend" rel="me" target="_blank">
+                    <p>source</p></a>
+                    <a class="linkbox link" href="https://t.me/quinten0508" rel="me" target="_blank">
+                    <p>telegram</p></a>
+                    <!-- :3 13 year old firefox bug https://bugzilla.mozilla.org/show_bug.cgi?id=646552 -->
+                    <a class="linkbox link" onClick="javascript:window.open('mailto:quinten@tuta.com', 'mail');event.preventDefault()" href="mailto:quinten@tuta.com" rel="me" target="_blank"> 
+                    <p>email</p></a>
+                    <!-- new button template
+                    <a class="linkbox link" href="" target="_blank">
+                    <p></p></a>
+                    -->
+                </div>
+            </div>
+
+            <div id="directory-box" class="box">
+                <!-- must resist the urge to dynamically generate this, fuck js -->
+                 <h5 style="display: inline-block;  padding: 0;">Current directory:</h5>
+                 <p style="display: inline-block;">
+                <img src="/assets/icons/tux.svg" id="directory-icon">/<a class="link" href="/">home/quinten</a>/<a class="link" href="/gallery.html">gallery</a>/<a class="link" href="/gallery/20250301_porter.html">20250301_porter</a>
+                </p>
+            </div>
+
+
+<div class="box gallerybox">
+    <h3><a href="/gallery" rel="me" style="text-decoration: none;">←</a> Porter Robinson & Underscores Concert</h3>
+    <h4>Melkweg, Amsterdam</h4>
+    <h6>2025/03/01</h6>
+    <p>Yesterday I visited the SMILE :D World Tour, felt like sharing some highlights ^^</p>
+    <br>
+    <p>The concert started off with underscores, who was the main reason I came to the show!</p>
+        
+    </p>
+    <div class="gallery-video-box">
+        <video controls preload="metadata" class="gallery-video" src="/assets/gallery/20250301_porter/underscores_copsandrobbers.mp4" alt=""></video>
+        <p class="gallery-media-caption">underscores - Cops and robbers</p>
+    </div>
+    <p>April also performed a new unreleased song, as she did for the rest of the SMILE :D tour. Banger as always...</p>
+    <div class="gallery-video-box">
+        <video controls preload="metadata" class="gallery-video" src="/assets/gallery/20250301_porter/underscores_poplife_NEW.mp4" alt=""></video>
+        <p class="gallery-media-caption">underscores & umru - poplife (unreleased)</p>
+    </div>
+    <div class="gallery-video-box">
+        <video controls preload="metadata" class="gallery-video" src="/assets/gallery/20250301_porter/underscores_oldmoneybitch.mp4" alt=""></video>
+        <p class="gallery-media-caption">underscores - Old money bitch</p>
+    </div>
+    <div class="gallery-divider">-------------------------------------------------------------------------</div>
+    <p>After about 30 mins, underscores' act concluded and following a short break Porter finally came on stage. He also had this big blow-up cat called Paws with him which was rather silly (pictured below).</p>
+    <img class="gallery-img" src="/assets/gallery/20250301_porter/porter_cat_paws_alive.jpg" alt="">
+    <div class="gallery-video-box">
+        <video controls preload="metadata" class="gallery-video" src="/assets/gallery/20250301_porter/porter_russianroulette.mp4" alt=""></video>
+        <p class="gallery-media-caption">Porter Robinson - Russian Roulette</p>
+    </div>
+    <div class="gallery-video-box">
+        <video controls preload="metadata" class="gallery-video" src="/assets/gallery/20250301_porter/porter_istherereallynohappiness.mp4" alt=""></video>
+        <p class="gallery-media-caption">Porter Robinson - Is There Really No Happiness?</p>
+    </div>
+    <img class="gallery-img" src="/assets/gallery/20250301_porter/porter_musician.jpg" alt="">
+    <div class="gallery-video-box">
+        <video controls preload="metadata" class="gallery-video" src="/assets/gallery/20250301_porter/porter_getyourwish.mp4" alt=""></video>
+        <p class="gallery-media-caption">Porter Robinson - Get Your Wish</p>
+    </div>
+    <p>Now somewhere near the end, something tragic unfolded...</p>
+    <div class="gallery-video-box" style="margin-bottom: 0">
+        <video controls preload="metadata" class="gallery-video" src="/assets/gallery/20250301_porter/porter_pawsfuckingDIES.mp4" alt=""></video>
+    </div>
+    <p style="margin-top: 0.8em; margin-bottom: 1em"><span class="gallery-spoiler-text">The cat is fucking dead.</span></p>
+    <p>And thus, in retaliation, the crowd focused their rage on its rightful target.</p>
+    <div class="gallery-video-box">
+        <video controls preload="metadata" class="gallery-video" src="/assets/gallery/20250301_porter/porter_wedontlikefrance.mp4" alt=""></video>
+    </div>
+    <div class="gallery-video-box">
+        <video controls preload="metadata" class="gallery-video" src="/assets/gallery/20250301_porter/porter_sadmachine.mp4" alt=""></video>
+        <p class="gallery-media-caption">Porter Robinson - Sad Machine</p>
+    </div>
+    <div class="gallery-video-box">
+        <video controls preload="metadata" class="gallery-video" src="/assets/gallery/20250301_porter/porter_shelter.mp4" alt=""></video>
+        <p class="gallery-media-caption">Porter Robinson - Shelter</p>
+    </div>
+</div>
+
+
+        </div> <!--container-main-->
+
+        <div class="sidebar sidebar-right" id="links-tree">
+            <div class="box" style="margin: 0;">
+                <h5 style="padding-bottom: 0;">Tree</h5>
+                <ul style="margin-bottom: 0;">
+                    <li><a href="#top">Top</a></li>
+                    <li><a href="#Chamonix_20240802">Chamonix</a></li>
+                    <li><a href="#Amsterdam_20240708">Amsterdam</a></li>
+                </ul>
+            </div>      
+
+        </div>
+        <!--</div>
+        </div>-->
+        
+        
+        </div> <!--sidebar-->
+        <div id="stripes">
+            <img src="/assets/stripes.svg" id="stripes">
+        </div>
+
+    </div>  <!--container-->
+
+
+
+</body>
+</html>
\ No newline at end of file
diff --git a/index.html b/index.html
index 698a7b1..68c4ecd 100644
--- a/index.html
+++ b/index.html
@@ -8,6 +8,13 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="style.css">
 
+    <script defer src="/assets/scripts/lastfm.js"></script>
+    <script defer src="/assets/scripts/clock.js"></script>
+    <script defer src="/assets/scripts/heartbeat.js"></script>
+    <script defer src="/assets/scripts/onekoswap.js"></script>
+    <script defer src="/assets/scripts/uptime.js"></script>
+    <script defer src="/assets/scripts/oneko.js" data-cat="/assets/oneko.gif"></script>
+    <script defer src="/assets/scripts/spaceweather.js"></script>
 </head>
 
 <body>
@@ -86,7 +93,7 @@
 
 
                 <div id="clock-box">
-                    <p id="clocktitle"> My time (UTC+2)</p>
+                    <p id="clocktitle"> My time (UTC+1)</p>
                     <div id="clock-contents">
                         <p id="clock">Loading...</p>
                         <img id="clock-icon" alt="clock-icon"></img>
@@ -165,11 +172,8 @@
             </div>      
 
         </div>
-        <!--</div>
-        </div>-->
-        
-        
         </div> <!--sidebar-->
+        
         <div id="stripes">
             <img src="/assets/stripes.svg" id="stripes">
         </div>
@@ -179,11 +183,4 @@
 
 
 </body>
-<script src="/assets/scripts/lastfm.js"></script>
-<script src="/assets/scripts/clock.js"></script>
-<script src="/assets/scripts/heartbeat.js"></script>
-<script src="/assets/scripts/onekoswap.js"></script>
-<script src="/assets/scripts/uptime.js"></script>
-<script src="/assets/scripts/oneko.js" data-cat="/assets/oneko.gif"></script>
-<script src="/assets/scripts/spaceweather.js"></script>
 </html>
\ No newline at end of file
diff --git a/links.html b/links.html
index 848206a..6787ab5 100644
--- a/links.html
+++ b/links.html
@@ -377,10 +377,11 @@
                     <li><a href="https://w14.monkrus.ws/" target="_blank"><p>m0nkrus</p></a>
                         <br><span> >> Adobe for Windows</span></li>
 
-                    <li><a href="https://rutracker.org" target="_blank"><p>rutracker.org</p></a>,
+                    <li><a href="https://rutracker.org" target="_blank"><p>rutracker</p></a>,
                         <a href="https://1337x.to/" target="_blank"><p>1337x</p></a>,
-                        <a href="https://torrents-csv.com/" target="_blank"><p>torrents-csv</p></a>
-                        <br><span> >> public, "trustworthy" trackers</span></li>
+                        <a href="https://torrents-csv.com/" target="_blank"><p>torrents-csv</p></a>,
+                        <a href="https://magnetcatcat.com/" target="_blank"><p>magnetcat</p></a>
+                        <br><span> >> public, "trustworthy" trackers or aggregators</span></li>
 
                     <li><a href="https://ripped.guide" target="_blank"><p>ripped.guide</p></a>,
                         <a href="https://fmhy.net/" target="_blank"><p>freemediaheckyeah</p></a>,
diff --git a/robots.txt b/robots.txt
index 77c4a55..4b9cc6a 100644
--- a/robots.txt
+++ b/robots.txt
@@ -1,33 +1,42 @@
-User-agent: AdsBot-Google
+User-agent: AI2Bot
+User-agent: Ai2Bot-Dolma
 User-agent: Amazonbot
 User-agent: anthropic-ai
 User-agent: Applebot
-User-agent: AwarioRssBot
-User-agent: AwarioSmartBot
+User-agent: Applebot-Extended
 User-agent: Bytespider
 User-agent: CCBot
 User-agent: ChatGPT-User
-User-agent: ClaudeBot
 User-agent: Claude-Web
+User-agent: ClaudeBot
 User-agent: cohere-ai
-User-agent: DataForSeoBot
 User-agent: Diffbot
+User-agent: DuckAssistBot
 User-agent: FacebookBot
+User-agent: facebookexternalhit
 User-agent: FriendlyCrawler
 User-agent: Google-Extended
 User-agent: GoogleOther
+User-agent: GoogleOther-Image
+User-agent: GoogleOther-Video
 User-agent: GPTBot
-User-agent: img2dataset
+User-agent: iaskspider/2.0
+User-agent: ICC-Crawler
 User-agent: ImagesiftBot
-User-agent: magpie-crawler
-User-agent: Meltwater
+User-agent: img2dataset
+User-agent: ISSCyberRiskCrawler
+User-agent: Kangaroo Bot
+User-agent: Meta-ExternalAgent
+User-agent: Meta-ExternalFetcher
+User-agent: OAI-SearchBot
 User-agent: omgili
 User-agent: omgilibot
-User-agent: peer39_crawler
-User-agent: peer39_crawler/1.0
 User-agent: PerplexityBot
-User-agent: PiplBot
-User-agent: scoop.it
-User-agent: Seekr
+User-agent: PetalBot
+User-agent: Scrapy
+User-agent: Sidetrade indexer bot
+User-agent: Timpibot
+User-agent: VelenPublicWebCrawler
+User-agent: Webzio-Extended
 User-agent: YouBot
-Disallow: /
\ No newline at end of file
+Disallow: /
diff --git a/style.css b/style.css
index 6886187..05305d1 100644
--- a/style.css
+++ b/style.css
@@ -85,8 +85,13 @@ The container query length units are:
 
 html {
     background-color: #000000;
-    background-image: url('/assets/bg.gif');
+    background-image: url('/assets/bg2.png');
     background-repeat: repeat;
+    background-size: 1.6rem;
+    image-rendering: pixelated;
+    image-rendering: crisp-edges;
+    image-rendering: -moz-crisp-edges;
+    image-rendering: -webkit-optimize-contrast;
     background-color: transparent;
     margin: 0px;
     border: 0px;
@@ -253,6 +258,9 @@ button {
     align-self: center;
     justify-self: center;
     max-height: 100%;
+    width: 100%; /* Ensure the box takes up the full width of its container */
+    display: block; /* Ensure the box behaves as a block-level element */
+    box-sizing: border-box; /* Include padding and border in the element's total width */
 }
 
 
@@ -562,7 +570,7 @@ button {
     position: sticky; 
     padding: 0; 
     top: 0; 
-    margin-top: 17.5rem;
+    margin-top: 14.85rem; /* idk bra this just happens to be the right value for now */
     padding-top: 1rem;
 }
 
diff --git a/template.html b/template.html
index a154a29..6a6db75 100644
--- a/template.html
+++ b/template.html
@@ -8,6 +8,14 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="style.css">
 
+    <script defer src="/assets/scripts/lastfm.js"></script>
+    <script defer src="/assets/scripts/clock.js"></script>
+    <script defer src="/assets/scripts/heartbeat.js"></script>
+    <script defer src="/assets/scripts/onekoswap.js"></script>
+    <script defer src="/assets/scripts/uptime.js"></script>
+    <script defer src="/assets/scripts/oneko.js" data-cat="/assets/oneko.gif"></script>
+    <script defer src="/assets/scripts/spaceweather.js"></script>
+
 </head>
 
 <body>
@@ -118,11 +126,4 @@
 
 
 </body>
-<script src="/assets/scripts/lastfm.js"></script>
-<script src="/assets/scripts/clock.js"></script>
-<script src="/assets/scripts/heartbeat.js"></script>
-<script src="/assets/scripts/onekoswap.js"></script>
-<script src="/assets/scripts/uptime.js"></script>
-<script src="/assets/scripts/oneko.js" data-cat="/assets/oneko.gif"></script>
-<script src="/assets/scripts/spaceweather.js"></script>
 </html>
\ No newline at end of file
diff --git a/updates.html b/updates.html
index 7d9695c..99af561 100644
--- a/updates.html
+++ b/updates.html
@@ -7,6 +7,14 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="style.css">
+
+    <script defer src="/assets/scripts/lastfm.js"></script>
+    <script defer src="/assets/scripts/clock.js"></script>
+    <script defer src="/assets/scripts/heartbeat.js"></script>
+    <script defer src="/assets/scripts/onekoswap.js"></script>
+    <script defer src="/assets/scripts/uptime.js"></script>
+    <script defer src="/assets/scripts/oneko.js" data-cat="/assets/oneko.gif"></script>
+    <script defer src="/assets/scripts/spaceweather.js"></script>
     <style>
         h5 {    
              font-weight: 400;
@@ -82,13 +90,19 @@
                 <img src="./assets/icons/tux.svg" id="directory-icon">/<a class="link" href="./">home/quinten</a>/<a class="link" href="./updates.html">updates</a>
                 </p>
             </div>
+            <div class="box">
+                <h3>News & Updates</h3>
+            </div>
 
 
-
+            <div class="box">
+                <h4>Sorry for the inactivity</h4>
+                <h5>2025-01-12</h5>
+                <p>Just wanted to say sorry for being a little inactive on here. Lost motivation, but I'll be continuing work on here shortly :D</p>
+            </div>
         
-        <div class="box">
-            <h3>News & Updates</h3>
-        </div>
+
+
         <div class="box">
             <h4>Server upgrade!</h4>
             <h5>2024-07-20</h5>
@@ -142,11 +156,4 @@
 
 
 </body>
-<script src="/assets/scripts/lastfm.js"></script>
-<script src="/assets/scripts/clock.js"></script>
-<script src="/assets/scripts/heartbeat.js"></script>
-<script src="/assets/scripts/onekoswap.js"></script>
-<script src="/assets/scripts/uptime.js"></script>
-<script src="/assets/scripts/oneko.js" data-cat="/assets/oneko.gif"></script>
-<script src="/assets/scripts/spaceweather.js"></script>
 </html>
\ No newline at end of file
