ref: 3906bf099df6dea54b0cbeff50ccc246f69a0c2c
parent: 5c75b0b41069ef4bd8afb90841740ce083b8fab2
author: zamfofex <zamfofex@twdb.moe>
date: Fri Dec 13 01:51:16 EST 2024
improve the webpage
--- a/index.html
+++ b/index.html
@@ -1,258 +1,323 @@
-<!-- moonfish is licensed under the AGPL (v3 or later) -->
-<!-- copyright 2024 zamfofex -->
-
-<html lang="en">
-<meta charset="utf-8">
-<meta name="viewport" content="width=device-width">
-
-<title> moonfish — a simple chess bot </title>
-
-<style>
-
-body {
- font-family:
- "DejaVu Sans",
- "DejaVu LGC Sans",
- "Verdana",
- "Bitstream Vera Sans",
- "Geneva",
- sans-serif;
- margin: 0;
- background: linear-gradient(#DEF, #FFF) fixed;
- color: #444;
-}
-
-body > header > *, body > header ~ * {
- margin-left: auto !important;
- margin-right: auto !important;
- padding-left: 64px !important;
- padding-right: 64px !important;
- max-width: 64em;
-}
-
-p {
- margin: 0;
-}
-
-svg {
- height: 3em;
-}
-
-header {
- background:
- linear-gradient(90deg, #123 256px, #0000),
- radial-gradient(circle, #ABC8, #0000 2px) 0 0 / 48px 48px repeat,
- radial-gradient(circle, #ABC1, #0000 24px) 0 0 / 48px 48px repeat,
- radial-gradient(circle, #ABC8, #0000 2px) 24px 24px / 48px 48px repeat,
- radial-gradient(circle, #ABC1, #0000 24px) 24px 24px / 48px 48px repeat
- #123;
- padding: 1em 0;
- color: #EEE;
- border-bottom: 2px solid #68A;
- position: sticky;
- top: -5em;
- margin-bottom: 2em;
- z-index: 1;
-}
-
-header > div {
- display: flex;
- align-items: center;
- font-style: italic;
-}
-
-header > div > p {
- margin: 0 2em;
-}
-
-header > p {
- margin: 0;
- margin-top: 2em;
- display: flex;
- gap: 2em;
-}
-
-header > p > a {
- color: #EEE;
- transition: text-decoration-color ease 0.25s;
-}
-
-header > p > a:not(:hover) {
- text-decoration-color: #0000;
-}
-
-header > * {
- filter: drop-shadow(0 0 2em #ABC);
-}
-
-section section {
- border: 2px solid #486;
- background: #FFF;
-}
-
-section section {
- border: 2px solid #486;
- background: #FFF;
- padding: 0 2em 1em;
- border-radius: 1em;
- overflow: hidden;
- text-align: center;
- flex: 1;
- min-width: 12em;
-}
-
-section section > h3 {
- background: #DFE;
- font-style: italic;
- margin: 0 -2em 1em;
- padding: 0.5em 2em;
- font-size: 1em;
-}
-
-section section a {
- display: block;
- background: #BDF;
- color: #444;
- padding: 0.5em 1em;
- border-radius: 2em;
- margin: 0.5em 0;
- text-decoration: none;
- box-shadow: 0 0 0.5em #0002;
- transition: box-shadow ease 0.25s;
-}
-
-section section a:hover {
- box-shadow: 0 0.5em 1em #0004;
-}
-
-section > div {
- display: flex;
- gap: 2em;
- margin: 2em 0;
- filter: drop-shadow(0 0.5em 0.5em #0002);
- flex-flow: wrap;
-}
-
-h2 {
- font-size: 1.5em;
- margin: 0;
- text-align: center;
-}
-
-</style>
-
-<header>
- <div>
- <svg viewbox="-0.5 -3 29 9" stroke-linejoin="round" stroke-linecap="round">
- <title> moonfish's logo </title>
- <mask id="m">
- <rect x="-50" y="-50" width="100" height="100" fill="#FFF" />
- <use href="#f" fill="#000" stroke="#000" stroke-width="2.5" transform="translate(17.5 0) scale(0.75 1) translate(-17.5 0)" />
- </mask>
- <g mask="url('#m')">
- <g id="w4">
- <g id="w3">
- <g id="w2">
- <g id="w1">
- <path id="w0" fill="none" stroke="#CEF" stroke-width="0.25" d="M 0 5 Q 0.25 5 0.5 4.75 Q 0.75 5 1 5" />
- <use href="#w0" x="1" />
- </g>
- <use href="#w1" x="2" />
- </g>
- <use href="#w2" x="4" />
- </g>
- <use href="#w3" x="7" />
- </g>
- <use href="#w4" x="13" />
- </g>
- <g fill="#EEE">
- <path d="M 0 0 0 4 1 4 1 1.5 2 3.5 3 3.5 4 1.5 4 4 5 4 5 0 3.75 0 2.5 2.25 1.25 0" />
- <g transform="translate(0 2) scale(1 1.125)">
- <path id="o" d="M 7.25 -2 a 1.75 2 0 0 0 0 4 a 1.75 2 0 0 0 0 -4 m 0 1 a 0.75 1 0 0 1 0 2 a 0.75 1 0 0 1 0 -2" />
- <use href="#o" x="4" />
- </g>
- <path d="M 13.5 4 13.5 0 14.5 0 16 2.5 16 0 17 0 17 4 16 4 14.5 1.5 14.5 4" />
- </g>
- <g transform="translate(17.5 0) scale(0.75 1) translate(-17.5 0)" fill="none" stroke="#EEE">
- <path d="M 16 5 C 20 6 17.5 -3 22 -1.75" id="f" />
- <path d="M 18 0.5 C 26 -0.5 17 4.25 21.5 3.75" />
- <path d="M 26 0.5 C 23.5 -0.5 22.5 1.75 24.5 2 S 25.5 4.5 23 3.5" />
- <path d="M 26 -2 Q 30 -3 27 3.75 C 29 -1 32 0 31 3.75" />
- </g>
- </svg>
- <p> a simple chess bot </p>
- </div>
- <p> <a href="#about">about</a> <a href="#download">download</a> <a href="https://git.sr.ht/~zamfofex/moonfish">hack</a> <a href="https://lichess.org/?user=munfish#friend">play</a> <a href="https://web.libera.chat/#moonfish">chat</a> </p>
-</header>
-
-<section id="about">
- <h2> about moonfish </h2>
- <div>
- <section>
- <h3> free software </h3>
- <p> this means anyone can benefit from moonfish by having access to its source code </p>
- <p> <a href="https://gnu.org/philosophy/free-sw">more about free software</a> </p>
- </section>
- <section>
- <h3> simple and fun </h3>
- <p> moonfish is simple and lightweight, which means it's easy and fun to understand how it works </p>
- <p> <a href="https://git.sr.ht/~zamfofex/moonfish">read the source code</a> </p>
- </section>
- <section>
- <h3> portable </h3>
- <p> written in straight-forward C89, moonfish can run in effectively any operating system and platform </p>
- <p> <a href="https://git.sr.ht/~zamfofex/moonfish#compiling-from-source">compile moonfish</a> </p>
- </section>
- <section>
- <h3> welcoming </h3>
- <p> moonfish has a small but kind community, where you can feel comfortable being yourself </p>
- <p> <a href="https://web.libera.chat/#moonfish">chat on IRC</a> </p>
- </section>
- <section>
- <h3> effective </h3>
- <p> moonfish uses MCTS, which allows for it to be reasonably effective despite being so simple </p>
- <p> <a href="https://en.wikipedia.org/wiki/Monte_Carlo_tree_search">more about MCTS</a> </p>
- </section>
- <section>
- <h3> efficient </h3>
- <p> moonfish makes efficient uses of resources, allowing for it to run in constrained environments such as embedded devices </p>
- <p> <a href="https://git.sr.ht/~zamfofex/moonfish#porting-moonfish">port moonfish</a> </p>
- </section>
- </div>
-</section>
-
-<section id="download">
- <h2> download </h2>
- <div>
- <section>
- <h3> source code </h3>
- <p> this is moonfish's source code, choose this if you want to help hack on moonfish! </p>
- <p> <a href="https://git.sr.ht/~zamfofex/moonfish">sourcehut Git repository</a> </p>
- </section>
- <section>
- <h3> Linux x86-64 (static) </h3>
- <p> choose this if you want to run moonfish on 64-bit Linux </p>
- <p> <a download href="moonfish">download moonfish!</a> </p>
- </section>
- <section>
- <h3> UNIX (minified) </h3>
- <p> this is a shell script with compressed source code, so it requires a shell, as well as <code>xz</code> and <code>cc</code> (it is very small!) </p>
- <p> <a download href="moonfish.sh">download shell script</a> </p>
- </section>
- <section>
- <h3> Windows </h3>
- <p> you can compile moonfish for Windows using MinGW or Visual Studio </p>
- <p> <a href="https://git.sr.ht/~zamfofex/moonfish#compiling-on-windows">compilation instructions</a> </p>
- </section>
- <section>
- <h3> Mac OS X (and other UNIX) </h3>
- <p> you can compile moonfish for UNIX and UNIX clones, including Mac OS </p>
- <p> <a href="https://git.sr.ht/~zamfofex/moonfish#compiling-from-source">compilation instructions</a> </p>
- </section>
- <section>
- <h3> others </h3>
- <p> because of moonfish's adherence to the C89 standard, you can port moonfish to other platforms relatively easily </p>
- <p> <a href="https://git.sr.ht/~zamfofex/moonfish#porting-moonfish">port moonfish</a> </p>
- </section>
- </div>
-</section>
+<!-- moonfish is licensed under the AGPL (v3 or later) -->
+<!-- copyright 2024 zamfofex -->
+
+<!doctype html>
+<html lang="en">
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width">
+
+<title> moonfish — a simple chess bot </title>
+
+<style>
+
+::selection {+ background: #A8E8;
+}
+
+html, body {+ min-height: 100%;
+}
+
+body {+ font-family:
+ "DejaVu Sans",
+ "DejaVu LGC Sans",
+ "Verdana",
+ "Bitstream Vera Sans",
+ "Geneva",
+ sans-serif;
+ margin: 0;
+ --background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4096 4096"><filter id="f"><feTurbulence baseFrequency="0.125" stitchTiles="stitch" /><feComponentTransfer result="stars"><feFuncR type="discrete" tableValues="1 1" /><feFuncG type="discrete" tableValues="1 1" /><feFuncB type="discrete" tableValues="1 1" /><feFuncA type="discrete" tableValues="0 0.5" /></feComponentTransfer><feMorphology operator="dilate" radius="1" /><feGaussianBlur stdDeviation="32" /><feComposite in2="stars" /></filter><rect width="100%" height="100%" filter="url(%23f)" /></svg>') 50% 0 / 100vmax auto;+ background:
+ var(--background),
+ linear-gradient(#0000 12em, #1028, #001 calc(100% - 12em)),
+ linear-gradient(90deg, #213, #0000, #246, #0000, #132)
+ #123;
+ color: #444;
+}
+
+body > header > *, body > header ~ * {+ margin-left: auto !important;
+ margin-right: auto !important;
+ padding-left: 64px !important;
+ padding-right: 64px !important;
+ max-width: 64em;
+}
+
+p {+ margin: 0;
+}
+
+svg {+ height: 3em;
+ filter: drop-shadow(0 0 2em #ABC);
+}
+
+header {+ background:
+ var(--background),
+ linear-gradient(90deg, #213, #0000, #246, #0000, #132)
+ #123;
+ padding: 1em 0;
+ color: #EEE;
+ border-bottom: 2px solid #68A;
+ position: sticky;
+ top: -5em;
+ margin-bottom: 2em;
+ z-index: 1;
+}
+
+.logo {+ display: flex;
+ align-items: center;
+ font-style: italic;
+}
+
+.logo > p {+ margin: 0 2em;
+}
+
+header > p {+ margin: 0;
+ margin-top: 2em;
+ display: flex;
+ gap: 1em;
+}
+
+header > p > a {+ color: #EEE;
+ transition: text-decoration-color ease 0.25s;
+}
+
+header > p > a:not(:hover) {+ text-decoration-color: #0000;
+}
+
+header > * {+ text-shadow: 0 0 2em #ABC;
+}
+
+section section {+ border: 4px solid #A8E;
+ background: #FFF;
+ padding: 0 2em 1em;
+ border-radius: 2em;
+ overflow: hidden;
+ text-align: center;
+ flex: 1;
+ min-width: 12em;
+ box-shadow: 0 0 0.5em #A8E, 0 0 1em #0008;
+}
+
+section section > h3 {+ background: #CBD;
+ font-style: italic;
+ margin: 0 -2em 1em;
+ padding: 0.5em 2em;
+ font-size: 1em;
+}
+
+section section a {+ display: block;
+ background: #C8D;
+ color: #444;
+ padding: 0.5em 1em;
+ border-radius: 2em;
+ margin: 0.5em 0;
+ text-decoration: none;
+ box-shadow: 0 0 0.5em #0002;
+ transition: box-shadow ease 0.25s;
+ font-weight: bold;
+}
+
+section section a:hover {+ box-shadow: 0 0.5em 1em #0004;
+}
+
+section > div {+ display: flex;
+ gap: 4em;
+ margin: 2em 0;
+ flex-flow: wrap;
+ align-items: center;
+}
+
+section section:nth-child(6n + 1) { transform: translate(1em, 1em); }+section section:nth-child(6n + 2) { transform: translate(-1em, -1em); }+section section:nth-child(6n + 3) { transform: translate(-1em, 0); }+section section:nth-child(6n + 4) { transform: translate(0, 1em); }+section section:nth-child(6n + 5) { transform: translate(-2em, -1em); }+section section:nth-child(6n + 6) { transform: translate(0, 0); }+
+h2 {+ font-size: 1.5em;
+ margin: 0;
+ text-align: center;
+ color: #FED;
+ text-shadow: 0 0 1em #FEE;
+ margin: 0 auto;
+ max-width: max-content;
+}
+
+@media (min-width: 1024px) {+ h2 {+ position: sticky;
+ top: 0;
+ z-index: 2;
+ line-height: 3rem;
+ }
+}
+
+pre, code {+ font-family:
+ "DejaVu Sans Mono",
+ "DejaVu LGC Sans Mono",
+ "Bitstream Vera Sans Mono",
+ "Liberation Mono",
+ "Consolas",
+ monospace;
+}
+
+.ascii {+ position: relative;
+ user-select: none;
+ text-shadow: 0 0 1em #000, 0 0 1em #000, 0 0 1em #000, 0 0 1em #000, 0 0 1em #000, 0 0 1em #000;
+}
+
+.ascii pre {+ margin: 0;
+ font-weight: bold;
+ opacity: 75%;
+ position: absolute;
+ bottom: 0;
+ right: 8em;
+ font-size: 0.5em;
+}
+
+@media (max-width: 768px) {+ .ascii {+ display: none;
+ }
+}
+
+</style>
+
+<header>
+ <div class="logo">
+ <svg viewbox="-0.5 -3 29 9" stroke-linejoin="round" stroke-linecap="round">
+ <title> moonfish's logo </title>
+ <mask id="m">
+ <rect x="-50" y="-50" width="100" height="100" fill="#FFF" />
+ <use href="#f" fill="#000" stroke="#000" stroke-width="2.5" transform="translate(17.5 0) scale(0.75 1) translate(-17.5 0)" />
+ </mask>
+ <g mask="url('#m')">+ <g id="w4">
+ <g id="w3">
+ <g id="w2">
+ <g id="w1">
+ <path id="w0" fill="none" stroke="#CEF" stroke-width="0.25" d="M 0 5 Q 0.25 5 0.5 4.75 Q 0.75 5 1 5" />
+ <use href="#w0" x="1" />
+ </g>
+ <use href="#w1" x="2" />
+ </g>
+ <use href="#w2" x="4" />
+ </g>
+ <use href="#w3" x="7" />
+ </g>
+ <use href="#w4" x="13" />
+ </g>
+ <g fill="#EEE">
+ <path d="M 0 0 0 4 1 4 1 1.5 2 3.5 3 3.5 4 1.5 4 4 5 4 5 0 3.75 0 2.5 2.25 1.25 0" />
+ <g transform="translate(0 2) scale(1 1.125)">
+ <path id="o" d="M 7.25 -2 a 1.75 2 0 0 0 0 4 a 1.75 2 0 0 0 0 -4 m 0 1 a 0.75 1 0 0 1 0 2 a 0.75 1 0 0 1 0 -2" />
+ <use href="#o" x="4" />
+ </g>
+ <path d="M 13.5 4 13.5 0 14.5 0 16 2.5 16 0 17 0 17 4 16 4 14.5 1.5 14.5 4" />
+ </g>
+ <g transform="translate(17.5 0) scale(0.75 1) translate(-17.5 0)" fill="none" stroke="#EEE">
+ <path d="M 16 5 C 20 6 17.5 -3 22 -1.75" id="f" />
+ <path d="M 18 0.5 C 26 -0.5 17 4.25 21.5 3.75" />
+ <path d="M 26 0.5 C 23.5 -0.5 22.5 1.75 24.5 2 S 25.5 4.5 23 3.5" />
+ <path d="M 26 -2 Q 30 -3 27 3.75 C 29 -1 32 0 31 3.75" />
+ </g>
+ </svg>
+ <p> a simple chess bot </p>
+ </div>
+ <p> <a href="#about">about</a> <a href="#download">download</a> <a href="https://git.sr.ht/~zamfofex/moonfish">hack</a> <a href="https://lichess.org/?user=munfish#friend">play</a> <a href="https://web.libera.chat/#moonfish">chat</a> </p>
+ <div class="ascii"><pre>
+ ___ z _ _ __ /) _o_ _+_
+)\/ -\ z (_) (_) /'_) /| |M| \W/ \_/
+)/\___/ /_\ /_\ (__) (__) /_\ (_) (_)</pre></div>
+</header>
+
+<section id="about">
+ <h2> about moonfish </h2>
+ <div>
+ <section>
+ <h3> free software </h3>
+ <p> this means anyone can benefit from moonfish by having access to its source code </p>
+ <p> <a href="https://gnu.org/philosophy/free-sw">more about free software</a> </p>
+ </section>
+ <section>
+ <h3> simple and fun </h3>
+ <p> moonfish is simple and lightweight, which means it's easy and fun to understand how it works </p>
+ <p> <a href="https://git.sr.ht/~zamfofex/moonfish">read the source code</a> </p>
+ </section>
+ <section>
+ <h3> portable </h3>
+ <p> written in straight-forward C89, moonfish can run in effectively any operating system and platform </p>
+ <p> <a href="https://git.sr.ht/~zamfofex/moonfish#compiling-from-source">compile moonfish</a> </p>
+ </section>
+ <section>
+ <h3> welcoming </h3>
+ <p> moonfish has a small but kind community, where you can feel comfortable being yourself </p>
+ <p> <a href="https://web.libera.chat/#moonfish">chat on IRC</a> </p>
+ </section>
+ <section>
+ <h3> effective </h3>
+ <p> moonfish uses MCTS, which allows for it to be reasonably effective despite being so simple </p>
+ <p> <a href="https://en.wikipedia.org/wiki/Monte_Carlo_tree_search">more about MCTS</a> </p>
+ </section>
+ <section>
+ <h3> efficient </h3>
+ <p> moonfish makes efficient uses of resources, allowing for it to run in constrained environments such as embedded devices </p>
+ <p> <a href="https://git.sr.ht/~zamfofex/moonfish#porting-moonfish">port moonfish</a> </p>
+ </section>
+ </div>
+</section>
+
+<section id="download">
+ <h2> download </h2>
+ <div>
+ <section>
+ <h3> source code </h3>
+ <p> this is moonfish's source code, choose this if you want to help hack on moonfish! </p>
+ <p> <a href="https://git.sr.ht/~zamfofex/moonfish">sourcehut Git repository</a> </p>
+ </section>
+ <section>
+ <h3> Linux x86-64 (static) </h3>
+ <p> choose this if you want to run moonfish on 64-bit Linux </p>
+ <p> <a download href="moonfish">download moonfish!</a> </p>
+ </section>
+ <section>
+ <h3> UNIX (minified) </h3>
+ <p> this is a shell script with compressed source code, so it requires a shell, as well as <code>xz</code> and <code>cc</code> (it is very small!) </p>
+ <p> <a download href="moonfish.sh">download shell script</a> </p>
+ </section>
+ <section>
+ <h3> Windows </h3>
+ <p> you can compile moonfish for Windows using MinGW or Visual Studio </p>
+ <p> <a href="https://git.sr.ht/~zamfofex/moonfish#compiling-on-windows">compilation instructions</a> </p>
+ </section>
+ <section>
+ <h3> Mac OS X (and other UNIX) </h3>
+ <p> you can compile moonfish for UNIX and UNIX clones, including Mac OS </p>
+ <p> <a href="https://git.sr.ht/~zamfofex/moonfish#compiling-from-source">compilation instructions</a> </p>
+ </section>
+ <section>
+ <h3> others </h3>
+ <p> because of moonfish's adherence to the C89 standard, you can port moonfish to other platforms relatively easily </p>
+ <p> <a href="https://git.sr.ht/~zamfofex/moonfish#porting-moonfish">port moonfish</a> </p>
+ </section>
+ </div>
+</section>
--
⑨