summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--albums.html168
-rw-r--r--ascii.html1244
-rw-r--r--assets/albums/1989.jpgbin66506 -> 0 bytes
-rw-r--r--assets/albums/HARDCORE-HEAVEN.jpgbin100569 -> 0 bytes
-rw-r--r--assets/albums/american-idiot.jpgbin70252 -> 0 bytes
-rw-r--r--assets/albums/biyaaheysf.jpgbin202184 -> 0 bytes
-rw-r--r--assets/albums/blurryface.jpgbin69446 -> 0 bytes
-rw-r--r--assets/albums/celeste.jpgbin124101 -> 0 bytes
-rw-r--r--assets/albums/dance-fever.jpgbin88513 -> 0 bytes
-rw-r--r--assets/albums/death-of-a-bachelor.jpgbin155909 -> 0 bytes
-rw-r--r--assets/albums/deathconsciousness.jpgbin128132 -> 0 bytes
-rw-r--r--assets/albums/electra-heart.jpgbin106092 -> 0 bytes
-rw-r--r--assets/albums/food-house.jpgbin90600 -> 0 bytes
-rw-r--r--assets/albums/funeral.jpgbin136541 -> 0 bytes
-rw-r--r--assets/albums/laurel-hell.jpgbin95780 -> 0 bytes
-rw-r--r--assets/albums/let-them-be-alien.jpgbin76954 -> 0 bytes
-rw-r--r--assets/albums/lungs.jpgbin146223 -> 0 bytes
-rw-r--r--assets/albums/mellon-collie.jpgbin81253 -> 0 bytes
-rw-r--r--assets/albums/octopath.jpgbin126435 -> 0 bytes
-rw-r--r--assets/albums/random-access-memories.jpgbin42662 -> 0 bytes
-rw-r--r--assets/albums/swvwv.jpgbin127565 -> 0 bytes
-rw-r--r--assets/albums/the-suburbs.jpgbin185895 -> 0 bytes
-rw-r--r--assets/books/bone-alt.jpgbin99916 -> 0 bytes
-rw-r--r--assets/books/bone.jpgbin96981 -> 0 bytes
-rw-r--r--assets/books/catch-22.jpgbin25833 -> 0 bytes
-rw-r--r--assets/books/fahrenheit-451.jpgbin48537 -> 0 bytes
-rw-r--r--assets/books/harrison-bergeron-alt.jpgbin333241 -> 0 bytes
-rw-r--r--assets/books/harrison-bergeron.jpgbin16182 -> 0 bytes
-rw-r--r--assets/books/harry-potter.jpgbin76411 -> 0 bytes
-rw-r--r--assets/books/ishmael.jpgbin64667 -> 0 bytes
-rw-r--r--assets/books/narnia-alt.jpgbin809224 -> 0 bytes
-rw-r--r--assets/books/narnia.jpgbin116354 -> 0 bytes
-rw-r--r--assets/books/nineteen-eighty-four.jpegbin38090 -> 0 bytes
-rw-r--r--assets/books/notes-from-the-underground.jpgbin30384 -> 0 bytes
-rw-r--r--assets/books/siddhartha.jpgbin80008 -> 0 bytes
-rw-r--r--assets/books/slaughterhouse-five.jpgbin47780 -> 0 bytes
-rw-r--r--assets/books/the-giver.jpgbin100392 -> 0 bytes
-rw-r--r--assets/books/the-handmaids-tale.jpgbin187384 -> 0 bytes
-rw-r--r--assets/books/the-library-of-babel.pngbin5269 -> 0 bytes
-rw-r--r--assets/books/the-lord-of-the-rings-alt.jpgbin259494 -> 0 bytes
-rw-r--r--assets/books/the-lord-of-the-rings.jpgbin106179 -> 0 bytes
-rw-r--r--assets/books/the-lottery.pngbin536 -> 0 bytes
-rw-r--r--assets/books/the-picture-of-dorian-gray.jpgbin84915 -> 0 bytes
-rw-r--r--assets/books/the-secret-history.jpgbin29624 -> 0 bytes
-rw-r--r--assets/books/twilight.jpgbin32232 -> 0 bytes
-rw-r--r--assets/comics/a-softer-world.pngbin36665 -> 0 bytes
-rw-r--r--assets/comics/avasdemon.jpgbin42497 -> 0 bytes
-rw-r--r--assets/comics/calvin-and-hobbes-alt.jpgbin432584 -> 0 bytes
-rw-r--r--assets/comics/calvin-and-hobbes.jpgbin92197 -> 0 bytes
-rw-r--r--assets/comics/copper.jpgbin158489 -> 0 bytes
-rw-r--r--assets/comics/hark-alt.pngbin19496 -> 0 bytes
-rw-r--r--assets/comics/hark.pngbin165918 -> 0 bytes
-rw-r--r--assets/comics/homestuck.svg12
-rw-r--r--assets/comics/xkcd.pngbin7695 -> 0 bytes
-rw-r--r--assets/posters/2001-a-space-odyssey.jpgbin103668 -> 0 bytes
-rw-r--r--assets/posters/avatar-the-last-airbender-alt.jpgbin564055 -> 0 bytes
-rw-r--r--assets/posters/avatar-the-last-airbender.jpgbin73482 -> 0 bytes
-rw-r--r--assets/posters/blade-runner.jpgbin87332 -> 0 bytes
-rw-r--r--assets/posters/coraline-alt.jpgbin1399856 -> 0 bytes
-rw-r--r--assets/posters/coraline.jpgbin128771 -> 0 bytes
-rw-r--r--assets/posters/dr-strangelove.jpgbin64438 -> 0 bytes
-rw-r--r--assets/posters/my-neighbor-totoro.jpgbin82737 -> 0 bytes
-rw-r--r--bookshelf.html419
-rw-r--r--css/bookshelf.css53
-rw-r--r--links.html224
-rw-r--r--monogram.html40
66 files changed, 1077 insertions, 1083 deletions
diff --git a/albums.html b/albums.html
index 06f89b4..ec425f3 100644
--- a/albums.html
+++ b/albums.html
@@ -1,88 +1,86 @@
---
-layout: default
+layout: main
title: albums
---
- <style>
- body {
- /* background-color: black; */
- }
- main {
- margin: 2.5vw;
- display: grid;
- grid-template-columns: repeat(5, 18vw);
- grid-gap: 15px;
- }
- div {
- display: none;
- position: fixed;
- top: 50%;
- left: 50%;
- margin-left: -20em;
- margin-top: -20em;
- z-index: 1;
- width: 40em;
- height: auto;
- }
- img {
- width: 100%;
- height: auto;
- }
- a img:hover:target {
- width: 200%;
- height: auto;
- }
- img:hover + div {
- display: block;
- border: 2px solid white;
- }
- </style>
-<main>
- <img src="assets/albums/1989.jpg" alt="Taylor Swift - 1989">
- <div id="1989"><img src="assets/albums/1989.jpg" alt="Taylor Swift - 1989"></div>
- <img src="assets/albums/random-access-memories.jpg" alt="Daft Punk - Random Access Memories">
- <div id="random-access-memories"><img src="assets/albums/random-access-memories.jpg" alt="Daft Punk - Random Access Memories"></div>
- <img src="assets/albums/blurryface.jpg" alt="Twenty One Pilots - Blurryface">
- <div id="blurryface"><img src="assets/albums/blurryface.jpg" alt="Twenty One Pilots - Blurryface"></div>
- <img src="assets/albums/death-of-a-bachelor.jpg" alt="Panic! at the Disco - Death of a Bachelor">
- <div id="death-of-a-bachelor"><img src="assets/albums/death-of-a-bachelor.jpg" alt="Panic! at the Disco - Death of a Bachelor"></div>
- <img src="assets/albums/american-idiot.jpg" alt="Green Day - American Idiot">
- <div id="american-idiot"><img src="assets/albums/american-idiot.jpg" alt="Green Day - American Idiot"></div>
- <img src="assets/albums/funeral.jpg" alt="Arcade Fire - Funeral">
- <div id="funeral"><img src="assets/albums/funeral.jpg" alt="Arcade Fire - Funeral"></div>
- <img src="assets/albums/the-suburbs.jpg" alt="Arcade Fire - The Suburbs">
- <div id="the-suburbs"><img src="assets/albums/the-suburbs.jpg" alt="Arcade Fire - The Suburbs"></div>
- <img src="assets/albums/mellon-collie.jpg" alt="The Smashing Pumpkins - Mellon Collie and the Infinite Sadness">
- <div id="mellon-collie"><img src="assets/albums/mellon-collie.jpg" alt="The Smashing Pumpkins - Mellon Collie and the Infinite Sadness"></div>
- <img src="assets/albums/deathconsciousness.jpg" alt="Have A Nice Life - Deathconsciousness">
- <div id="deathconsciousness"><img src="assets/albums/deathconsciousness.jpg" alt="Have A Nice Life - Deathconsciousness"></div>
- <img src="assets/albums/let-them-be-alien.jpg" alt="Lebanon Hanover - Let Them Be Alien">
- <div id="let-them-be-alien"><img src="assets/albums/let-them-be-alien.jpg" alt="Lebanon Hanover - Let Them Be Alien"></div>
- <img src="assets/albums/lungs.jpg" alt="Florence and the Machine - Lungs">
- <div id="lungs"><img src="assets/albums/lungs.jpg" alt="Florence and the Machine - Lungs"></div>
- <img src="assets/albums/dance-fever.jpg" alt="Florence and the Machine - Dance Fever">
- <div id="dance-fever"><img src="assets/albums/dance-fever.jpg" alt="Florence and the Machine - Dance Fever"></div>
- <img src="assets/albums/laurel-hell.jpg" alt="Mitski - Laurel Hell">
- <div id="laurel-hell"><img src="assets/albums/laurel-hell.jpg" alt="Mitski - Laurel Hell"></div>
- <img src="assets/albums/electra-heart.jpg" alt="Marina and the Diamonds - Electra Heart">
- <div id="electra-heart"><img src="assets/albums/electra-heart.jpg" alt="Marina and the Diamonds - Electra Heart"></div>
- <img src="assets/albums/food-house.jpg" alt="Food House - Food House">
- <div id="food-house"><img src="assets/albums/food-house.jpg" alt="Food House - Food House"></div>
- <img src="assets/albums/HARDCORE-HEAVEN.jpg" alt="Alice Gas - HARDCORE HEAVEN">
- <div id="hardcore-heaven"><img src="assets/albums/HARDCORE-HEAVEN.jpg" alt="Alice Gas - HARDCORE HEAVEN"></div>
- <img src="assets/albums/swvwv.jpg" alt="Brian David Gilbert - Songs With Videos Without Videos">
- <div id="swvwv"><img src="assets/albums/swvwv.jpg" alt="Brian David Gilbert - Songs With Videos Without Videos"></div>
- <img src="assets/albums/biyaaheysf.jpg" alt="Machine Girl - ...BECAUSE I'M YOUNG ARROGANT AND HATE EVERYTHING YOU STAND FOR">
- <div id="biyaaheysf"><img src="assets/albums/biyaaheysf.jpg" alt="Machine Girl - ...BECAUSE I'M YOUNG ARROGANT AND HATE EVERYTHING YOU STAND FOR"></div>
- <img src="assets/albums/celeste.jpg" alt="Lena Raine - Celeste Soundtrack">
- <div id="celeste"><img src="assets/albums/celeste.jpg" alt="Lena Raine - Celeste Soundtrack"></div>
- <img src="assets/albums/octopath.jpg" alt="Yasunori Nishiki - Octopath Traveler Soundtrack">
- <div id="octopath"><img src="assets/albums/octopath.jpg" alt="Yasunori Nishiki - Octopath Traveler Soundtrack"></div>
- <!-- <img src="assets/albums/undertale.jpg" alt="Toby Fox - Undertale Soundtrack">
- <div id="undertale"><img src="assets/albums/undertale.jpg" alt="Toby Fox - Undertale Soundtrack"></div> -->
- <!-- <img src="assets/albums/a-moon-shaped-pool.jpg" alt="Radiohead - A Moon Shaped Pool">
- <div id="a-moon-shaped-pool"><img src="assets/albums/a-moon-shaped-pool.jpg" alt="Radiohead - A Moon Shaped Pool"></div> -->
- <!-- <img src="assets/albums/hamilton.jpg" alt="Lin-Manuel Miranda - Hamilton Soundtrack">
- <div id="hamilton"><img src="assets/albums/hamilton.jpg" alt="Lin-Manuel Miranda - Hamilton Soundtrack"></div>
- <img src="assets/albums/inception.jpg" alt="Hans Zimmer - Inception Soundtrack">
- <div id="inception"><img src="assets/albums/inception.jpg" alt="Hans Zimmer - Inception Soundtrack"></div> -->
-</main>
+<style>
+body {
+ /* background-color: black; */
+}
+main {
+ margin: 2.5vw;
+ display: grid;
+ grid-template-columns: repeat(5, 18vw);
+ grid-gap: 15px;
+}
+div {
+ display: none;
+ position: fixed;
+ top: 50%;
+ left: 50%;
+ margin-left: -20em;
+ margin-top: -20em;
+ z-index: 1;
+ width: 40em;
+ height: auto;
+}
+img {
+ width: 100%;
+ height: auto;
+}
+a img:hover:target {
+ width: 200%;
+ height: auto;
+}
+img:hover + div {
+ display: block;
+ border: 2px solid white;
+}
+</style>
+<img src="/files/covers/albums/1989.jpg" alt="Taylor Swift - 1989">
+<div id="1989"><img src="/files/covers/albums/1989.jpg" alt="Taylor Swift - 1989"></div>
+<img src="/files/covers/albums/random-access-memories.jpg" alt="Daft Punk - Random Access Memories">
+<div id="random-access-memories"><img src="/files/covers/albums/random-access-memories.jpg" alt="Daft Punk - Random Access Memories"></div>
+<img src="/files/covers/albums/blurryface.jpg" alt="Twenty One Pilots - Blurryface">
+<div id="blurryface"><img src="/files/covers/albums/blurryface.jpg" alt="Twenty One Pilots - Blurryface"></div>
+<img src="/files/covers/albums/death-of-a-bachelor.jpg" alt="Panic! at the Disco - Death of a Bachelor">
+<div id="death-of-a-bachelor"><img src="/files/covers/albums/death-of-a-bachelor.jpg" alt="Panic! at the Disco - Death of a Bachelor"></div>
+<img src="/files/covers/albums/american-idiot.jpg" alt="Green Day - American Idiot">
+<div id="american-idiot"><img src="/files/covers/albums/american-idiot.jpg" alt="Green Day - American Idiot"></div>
+<img src="/files/covers/albums/funeral.jpg" alt="Arcade Fire - Funeral">
+<div id="funeral"><img src="/files/covers/albums/funeral.jpg" alt="Arcade Fire - Funeral"></div>
+<img src="/files/covers/albums/the-suburbs.jpg" alt="Arcade Fire - The Suburbs">
+<div id="the-suburbs"><img src="/files/covers/albums/the-suburbs.jpg" alt="Arcade Fire - The Suburbs"></div>
+<img src="/files/covers/albums/mellon-collie.jpg" alt="The Smashing Pumpkins - Mellon Collie and the Infinite Sadness">
+<div id="mellon-collie"><img src="/files/covers/albums/mellon-collie.jpg" alt="The Smashing Pumpkins - Mellon Collie and the Infinite Sadness"></div>
+<img src="/files/covers/albums/deathconsciousness.jpg" alt="Have A Nice Life - Deathconsciousness">
+<div id="deathconsciousness"><img src="/files/covers/albums/deathconsciousness.jpg" alt="Have A Nice Life - Deathconsciousness"></div>
+<img src="/files/covers/albums/let-them-be-alien.jpg" alt="Lebanon Hanover - Let Them Be Alien">
+<div id="let-them-be-alien"><img src="/files/covers/albums/let-them-be-alien.jpg" alt="Lebanon Hanover - Let Them Be Alien"></div>
+<img src="/files/covers/albums/lungs.jpg" alt="Florence and the Machine - Lungs">
+<div id="lungs"><img src="/files/covers/albums/lungs.jpg" alt="Florence and the Machine - Lungs"></div>
+<img src="/files/covers/albums/dance-fever.jpg" alt="Florence and the Machine - Dance Fever">
+<div id="dance-fever"><img src="/files/covers/albums/dance-fever.jpg" alt="Florence and the Machine - Dance Fever"></div>
+<img src="/files/covers/albums/laurel-hell.jpg" alt="Mitski - Laurel Hell">
+<div id="laurel-hell"><img src="/files/covers/albums/laurel-hell.jpg" alt="Mitski - Laurel Hell"></div>
+<img src="/files/covers/albums/electra-heart.jpg" alt="Marina and the Diamonds - Electra Heart">
+<div id="electra-heart"><img src="/files/covers/albums/electra-heart.jpg" alt="Marina and the Diamonds - Electra Heart"></div>
+<img src="/files/covers/albums/food-house.jpg" alt="Food House - Food House">
+<div id="food-house"><img src="/files/covers/albums/food-house.jpg" alt="Food House - Food House"></div>
+<img src="/files/covers/albums/HARDCORE-HEAVEN.jpg" alt="Alice Gas - HARDCORE HEAVEN">
+<div id="hardcore-heaven"><img src="/files/covers/albums/HARDCORE-HEAVEN.jpg" alt="Alice Gas - HARDCORE HEAVEN"></div>
+<img src="/files/covers/albums/swvwv.jpg" alt="Brian David Gilbert - Songs With Videos Without Videos">
+<div id="swvwv"><img src="/files/covers/albums/swvwv.jpg" alt="Brian David Gilbert - Songs With Videos Without Videos"></div>
+<img src="/files/covers/albums/biyaaheysf.jpg" alt="Machine Girl - ...BECAUSE I'M YOUNG ARROGANT AND HATE EVERYTHING YOU STAND FOR">
+<div id="biyaaheysf"><img src="/files/covers/albums/biyaaheysf.jpg" alt="Machine Girl - ...BECAUSE I'M YOUNG ARROGANT AND HATE EVERYTHING YOU STAND FOR"></div>
+<img src="/files/covers/albums/celeste.jpg" alt="Lena Raine - Celeste Soundtrack">
+<div id="celeste"><img src="/files/covers/albums/celeste.jpg" alt="Lena Raine - Celeste Soundtrack"></div>
+<img src="/files/covers/albums/octopath.jpg" alt="Yasunori Nishiki - Octopath Traveler Soundtrack">
+<div id="octopath"><img src="/files/covers/albums/octopath.jpg" alt="Yasunori Nishiki - Octopath Traveler Soundtrack"></div>
+<!-- <img src="/files/covers/albums/undertale.jpg" alt="Toby Fox - Undertale Soundtrack">
+<div id="undertale"><img src="/files/covers/albums/undertale.jpg" alt="Toby Fox - Undertale Soundtrack"></div> -->
+<!-- <img src="/files/covers/albums/a-moon-shaped-pool.jpg" alt="Radiohead - A Moon Shaped Pool">
+<div id="a-moon-shaped-pool"><img src="/files/covers/albums/a-moon-shaped-pool.jpg" alt="Radiohead - A Moon Shaped Pool"></div> -->
+<!-- <img src="/files/covers/albums/hamilton.jpg" alt="Lin-Manuel Miranda - Hamilton Soundtrack">
+<div id="hamilton"><img src="/files/covers/albums/hamilton.jpg" alt="Lin-Manuel Miranda - Hamilton Soundtrack"></div>
+<img src="/files/covers/albums/inception.jpg" alt="Hans Zimmer - Inception Soundtrack">
+<div id="inception"><img src="/files/covers/albums/inception.jpg" alt="Hans Zimmer - Inception Soundtrack"></div> -->
diff --git a/ascii.html b/ascii.html
index bd8ff65..8096319 100644
--- a/ascii.html
+++ b/ascii.html
@@ -1,628 +1,628 @@
---
-layout: default
+layout: main
title: ascii
---
- <style>
- html {
- line-height: 1.5;
- font-family: Georgia, serif;
- font-size: 20px;
- }
- body {
- margin: 0 auto;
- max-width: 60em;
- padding: 50px;
- text-align: center;
- }
- table {
- border-collapse: collapse;
- width: 100%;
- display: block;
- }
- table caption {
- margin-bottom: 0.75em;
- }
- tbody {
- margin-top: 0.5em;
- border-top: 1px solid #d0d7de;
- border-bottom: 1px solid #d0d7de;
- }
- th {
- border: 1px solid #d0d7de;
- }
- td {
- border: 1px solid #d0d7de;
- padding: 0.125em 0.5em 0.25em 0.5em;
- }
- .odd {
- background-color: #f6f8fa;
- }
- </style>
- <h1 id="ascii-table">ascii table</h1>
- <table style="width: 100%">
- <colgroup>
- <col style="width: 5%" />
- <col style="width: 6%" />
- <col style="width: 18%" />
- <col style="width: 1%" />
- <col style="width: 6%" />
- <col style="width: 6%" />
- <col style="width: 9%" />
- <col style="width: 1%" />
- <col style="width: 6%" />
- <col style="width: 6%" />
- <col style="width: 9%" />
- <col style="width: 1%" />
- <col style="width: 6%" />
- <col style="width: 6%" />
- <col style="width: 7%" />
- </colgroup>
- <thead>
- <tr class="header">
- <th>hex</th>
- <th>dec</th>
- <th>control char</th>
- <th></th>
- <th>hex</th>
- <th>dec</th>
- <th>punct</th>
- <th></th>
- <th>hex</th>
- <th>dec</th>
- <th>upper</th>
- <th></th>
- <th>hex</th>
- <th>dec</th>
- <th>lower</th>
- </tr>
- </thead>
- <tbody>
- <tr class="odd">
- <td>00</td>
- <td>0</td>
- <td>null (\0)</td>
- <td></td>
- <td>20</td>
- <td>32</td>
- <td><code>space</code></td>
- <td></td>
- <td>40</td>
- <td>64</td>
- <td><code>@</code></td>
- <td></td>
- <td>60</td>
- <td>96</td>
- <td>`</td>
- </tr>
- <tr class="even">
- <td>01</td>
- <td>1</td>
- <td>start of heading</td>
- <td></td>
- <td>21</td>
- <td>33</td>
- <td><code>!</code></td>
- <td></td>
- <td>41</td>
- <td>65</td>
- <td><code>A</code></td>
- <td></td>
- <td>61</td>
- <td>97</td>
- <td><code>a</code></td>
- </tr>
- <tr class="odd">
- <td>02</td>
- <td>2</td>
- <td>start of text</td>
- <td></td>
- <td>22</td>
- <td>34</td>
- <td><code>“</code></td>
- <td></td>
- <td>42</td>
- <td>66</td>
- <td><code>B</code></td>
- <td></td>
- <td>62</td>
- <td>98</td>
- <td><code>b</code></td>
- </tr>
- <tr class="even">
- <td>03</td>
- <td>3</td>
- <td>end of text</td>
- <td></td>
- <td>23</td>
- <td>35</td>
- <td><code>#</code></td>
- <td></td>
- <td>43</td>
- <td>67</td>
- <td><code>C</code></td>
- <td></td>
- <td>63</td>
- <td>99</td>
- <td><code>c</code></td>
- </tr>
- <tr class="odd">
- <td>04</td>
- <td>4</td>
- <td>end of transmission</td>
- <td></td>
- <td>24</td>
- <td>36</td>
- <td><code>$</code></td>
- <td></td>
- <td>44</td>
- <td>68</td>
- <td><code>D</code></td>
- <td></td>
- <td>64</td>
- <td>100</td>
- <td><code>d</code></td>
- </tr>
- <tr class="even">
- <td>05</td>
- <td>5</td>
- <td>enquiry</td>
- <td></td>
- <td>25</td>
- <td>37</td>
- <td><code>%</code></td>
- <td></td>
- <td>45</td>
- <td>69</td>
- <td><code>E</code></td>
- <td></td>
- <td>65</td>
- <td>101</td>
- <td><code>e</code></td>
- </tr>
- <tr class="odd">
- <td>06</td>
- <td>6</td>
- <td>acknowledge</td>
- <td></td>
- <td>26</td>
- <td>38</td>
- <td><code>&amp;</code></td>
- <td></td>
- <td>46</td>
- <td>70</td>
- <td><code>F</code></td>
- <td></td>
- <td>66</td>
- <td>102</td>
- <td><code>f</code></td>
- </tr>
- <tr class="even">
- <td>07</td>
- <td>7</td>
- <td>bell (\a,^H)</td>
- <td></td>
- <td>27</td>
- <td>39</td>
- <td><code>‘</code></td>
- <td></td>
- <td>47</td>
- <td>71</td>
- <td><code>G</code></td>
- <td></td>
- <td>67</td>
- <td>103</td>
- <td><code>g</code></td>
- </tr>
- <tr class="odd">
- <td>08</td>
- <td>8</td>
- <td>backspace (\b)</td>
- <td></td>
- <td>28</td>
- <td>40</td>
- <td><code>(</code></td>
- <td></td>
- <td>48</td>
- <td>72</td>
- <td><code>H</code></td>
- <td></td>
- <td>68</td>
- <td>104</td>
- <td><code>h</code></td>
- </tr>
- <tr class="even">
- <td>09</td>
- <td>9</td>
- <td>tab (\t)</td>
- <td></td>
- <td>29</td>
- <td>41</td>
- <td><code>)</code></td>
- <td></td>
- <td>49</td>
- <td>73</td>
- <td><code>I</code></td>
- <td></td>
- <td>69</td>
- <td>105</td>
- <td><code>i</code></td>
- </tr>
- <tr class="odd">
- <td>0a</td>
- <td>10</td>
- <td>line feed (\n)</td>
- <td></td>
- <td>2a</td>
- <td>42</td>
- <td><code>*</code></td>
- <td></td>
- <td>4a</td>
- <td>74</td>
- <td><code>J</code></td>
- <td></td>
- <td>6a</td>
- <td>106</td>
- <td><code>j</code></td>
- </tr>
- <tr class="even">
- <td>0b</td>
- <td>11</td>
- <td>vertical tab (\v)</td>
- <td></td>
- <td>2b</td>
- <td>43</td>
- <td><code>+</code></td>
- <td></td>
- <td>4b</td>
- <td>75</td>
- <td><code>K</code></td>
- <td></td>
- <td>6b</td>
- <td>107</td>
- <td><code>k</code></td>
- </tr>
- <tr class="odd">
- <td>0c</td>
- <td>12</td>
- <td>form feed (\f)</td>
- <td></td>
- <td>2c</td>
- <td>44</td>
- <td><code>,</code></td>
- <td></td>
- <td>4c</td>
- <td>76</td>
- <td><code>L</code></td>
- <td></td>
- <td>6c</td>
- <td>108</td>
- <td><code>l</code></td>
- </tr>
- <tr class="even">
- <td>0d</td>
- <td>13</td>
- <td>carriage return (\r)</td>
- <td></td>
- <td>2d</td>
- <td>45</td>
- <td><code>-</code></td>
- <td></td>
- <td>4d</td>
- <td>77</td>
- <td><code>M</code></td>
- <td></td>
- <td>6d</td>
- <td>109</td>
- <td><code>m</code></td>
- </tr>
- <tr class="odd">
- <td>0e</td>
- <td>14</td>
- <td>shift out</td>
- <td></td>
- <td>2e</td>
- <td>46</td>
- <td><code>.</code></td>
- <td></td>
- <td>4e</td>
- <td>78</td>
- <td><code>N</code></td>
- <td></td>
- <td>6e</td>
- <td>110</td>
- <td><code>n</code></td>
- </tr>
- <tr class="even">
- <td>0f</td>
- <td>15</td>
- <td>shift in</td>
- <td></td>
- <td>2f</td>
- <td>47</td>
- <td><code>/</code></td>
- <td></td>
- <td>4f</td>
- <td>79</td>
- <td><code>O</code></td>
- <td></td>
- <td>6f</td>
- <td>111</td>
- <td><code>o</code></td>
- </tr>
- <tr class="odd">
- <td>10</td>
- <td>16</td>
- <td>data link escape</td>
- <td></td>
- <td>30</td>
- <td>48</td>
- <td><code>0</code></td>
- <td></td>
- <td>50</td>
- <td>80</td>
- <td><code>P</code></td>
- <td></td>
- <td>70</td>
- <td>112</td>
- <td><code>p</code></td>
- </tr>
- <tr class="even">
- <td>11</td>
- <td>17</td>
- <td>device control one</td>
- <td></td>
- <td>31</td>
- <td>49</td>
- <td><code>1</code></td>
- <td></td>
- <td>51</td>
- <td>81</td>
- <td><code>Q</code></td>
- <td></td>
- <td>71</td>
- <td>113</td>
- <td><code>q</code></td>
- </tr>
- <tr class="odd">
- <td>12</td>
- <td>18</td>
- <td>device control two</td>
- <td></td>
- <td>32</td>
- <td>50</td>
- <td><code>2</code></td>
- <td></td>
- <td>52</td>
- <td>82</td>
- <td><code>R</code></td>
- <td></td>
- <td>72</td>
- <td>114</td>
- <td><code>r</code></td>
- </tr>
- <tr class="even">
- <td>13</td>
- <td>19</td>
- <td>device control three</td>
- <td></td>
- <td>33</td>
- <td>51</td>
- <td><code>3</code></td>
- <td></td>
- <td>53</td>
- <td>83</td>
- <td><code>S</code></td>
- <td></td>
- <td>73</td>
- <td>115</td>
- <td><code>s</code></td>
- </tr>
- <tr class="odd">
- <td>14</td>
- <td>20</td>
- <td>device control four</td>
- <td></td>
- <td>34</td>
- <td>52</td>
- <td><code>4</code></td>
- <td></td>
- <td>54</td>
- <td>84</td>
- <td><code>T</code></td>
- <td></td>
- <td>74</td>
- <td>116</td>
- <td><code>t</code></td>
- </tr>
- <tr class="even">
- <td>15</td>
- <td>21</td>
- <td>negative acknowledge</td>
- <td></td>
- <td>35</td>
- <td>53</td>
- <td><code>5</code></td>
- <td></td>
- <td>55</td>
- <td>85</td>
- <td><code>U</code></td>
- <td></td>
- <td>75</td>
- <td>117</td>
- <td><code>u</code></td>
- </tr>
- <tr class="odd">
- <td>16</td>
- <td>22</td>
- <td>synchronous idle</td>
- <td></td>
- <td>36</td>
- <td>54</td>
- <td><code>6</code></td>
- <td></td>
- <td>56</td>
- <td>86</td>
- <td><code>V</code></td>
- <td></td>
- <td>76</td>
- <td>118</td>
- <td><code>v</code></td>
- </tr>
- <tr class="even">
- <td>17</td>
- <td>23</td>
- <td>end of transmission</td>
- <td></td>
- <td>37</td>
- <td>55</td>
- <td><code>7</code></td>
- <td></td>
- <td>57</td>
- <td>87</td>
- <td><code>W</code></td>
- <td></td>
- <td>77</td>
- <td>119</td>
- <td><code>w</code></td>
- </tr>
- <tr class="odd">
- <td>18</td>
- <td>24</td>
- <td>cancel</td>
- <td></td>
- <td>38</td>
- <td>56</td>
- <td><code>8</code></td>
- <td></td>
- <td>58</td>
- <td>88</td>
- <td><code>X</code></td>
- <td></td>
- <td>78</td>
- <td>120</td>
- <td><code>x</code></td>
- </tr>
- <tr class="even">
- <td>19</td>
- <td>25</td>
- <td>end of medium</td>
- <td></td>
- <td>39</td>
- <td>57</td>
- <td><code>9</code></td>
- <td></td>
- <td>59</td>
- <td>89</td>
- <td><code>Y</code></td>
- <td></td>
- <td>79</td>
- <td>121</td>
- <td><code>y</code></td>
- </tr>
- <tr class="odd">
- <td>1a</td>
- <td>26</td>
- <td>substitute</td>
- <td></td>
- <td>3a</td>
- <td>58</td>
- <td><code>:</code></td>
- <td></td>
- <td>5a</td>
- <td>90</td>
- <td><code>Z</code></td>
- <td></td>
- <td>7a</td>
- <td>122</td>
- <td><code>z</code></td>
- </tr>
- <tr class="even">
- <td>1b</td>
- <td>27</td>
- <td>escape</td>
- <td></td>
- <td>3b</td>
- <td>59</td>
- <td><code>;</code></td>
- <td></td>
- <td>5b</td>
- <td>91</td>
- <td><code>[</code></td>
- <td></td>
- <td>7b</td>
- <td>123</td>
- <td><code>{</code></td>
- </tr>
- <tr class="odd">
- <td>1c</td>
- <td>28</td>
- <td>file separator</td>
- <td></td>
- <td>3c</td>
- <td>60</td>
- <td><code>&lt;</code></td>
- <td></td>
- <td>5c</td>
- <td>92</td>
- <td><code>\</code></td>
- <td></td>
- <td>7c</td>
- <td>124</td>
- <td><code>|</code></td>
- </tr>
- <tr class="even">
- <td>1d</td>
- <td>29</td>
- <td>group separator</td>
- <td></td>
- <td>3d</td>
- <td>61</td>
- <td><code>=</code></td>
- <td></td>
- <td>5d</td>
- <td>93</td>
- <td><code>]</code></td>
- <td></td>
- <td>7d</td>
- <td>125</td>
- <td><code>}</code></td>
- </tr>
- <tr class="odd">
- <td>1e</td>
- <td>30</td>
- <td>record separator</td>
- <td></td>
- <td>3e</td>
- <td>62</td>
- <td><code>&gt;</code></td>
- <td></td>
- <td>5e</td>
- <td>94</td>
- <td><code>^</code></td>
- <td></td>
- <td>7e</td>
- <td>126</td>
- <td><code>~</code></td>
- </tr>
- <tr class="even">
- <td>1f</td>
- <td>31</td>
- <td>unit separator</td>
- <td></td>
- <td>3f</td>
- <td>63</td>
- <td><code>?</code></td>
- <td></td>
- <td>5f</td>
- <td>95</td>
- <td><code>_</code></td>
- <td></td>
- <td>7f</td>
- <td>127</td>
- <td><code>DEL</code></td>
- </tr>
- </tbody>
- </table>
+<style>
+html {
+ line-height: 1.5;
+ font-family: Georgia, serif;
+ font-size: 20px;
+}
+body {
+ margin: 0 auto;
+ max-width: 60em;
+ padding: 50px;
+ text-align: center;
+}
+table {
+ border-collapse: collapse;
+ width: 100%;
+ display: block;
+}
+table caption {
+ margin-bottom: 0.75em;
+}
+tbody {
+ margin-top: 0.5em;
+ border-top: 1px solid #d0d7de;
+ border-bottom: 1px solid #d0d7de;
+}
+th {
+ border: 1px solid #d0d7de;
+}
+td {
+ border: 1px solid #d0d7de;
+ padding: 0.125em 0.5em 0.25em 0.5em;
+}
+.odd {
+ background-color: #f6f8fa;
+}
+</style>
+<h1 id="ascii-table">ascii table</h1>
+<table style="width: 100%">
+ <colgroup>
+ <col style="width: 5%" />
+ <col style="width: 6%" />
+ <col style="width: 18%" />
+ <col style="width: 1%" />
+ <col style="width: 6%" />
+ <col style="width: 6%" />
+ <col style="width: 9%" />
+ <col style="width: 1%" />
+ <col style="width: 6%" />
+ <col style="width: 6%" />
+ <col style="width: 9%" />
+ <col style="width: 1%" />
+ <col style="width: 6%" />
+ <col style="width: 6%" />
+ <col style="width: 7%" />
+ </colgroup>
+ <thead>
+ <tr class="header">
+ <th>hex</th>
+ <th>dec</th>
+ <th>control char</th>
+ <th></th>
+ <th>hex</th>
+ <th>dec</th>
+ <th>punct</th>
+ <th></th>
+ <th>hex</th>
+ <th>dec</th>
+ <th>upper</th>
+ <th></th>
+ <th>hex</th>
+ <th>dec</th>
+ <th>lower</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr class="odd">
+ <td>00</td>
+ <td>0</td>
+ <td>null (\0)</td>
+ <td></td>
+ <td>20</td>
+ <td>32</td>
+ <td><code>space</code></td>
+ <td></td>
+ <td>40</td>
+ <td>64</td>
+ <td><code>@</code></td>
+ <td></td>
+ <td>60</td>
+ <td>96</td>
+ <td>`</td>
+ </tr>
+ <tr class="even">
+ <td>01</td>
+ <td>1</td>
+ <td>start of heading</td>
+ <td></td>
+ <td>21</td>
+ <td>33</td>
+ <td><code>!</code></td>
+ <td></td>
+ <td>41</td>
+ <td>65</td>
+ <td><code>A</code></td>
+ <td></td>
+ <td>61</td>
+ <td>97</td>
+ <td><code>a</code></td>
+ </tr>
+ <tr class="odd">
+ <td>02</td>
+ <td>2</td>
+ <td>start of text</td>
+ <td></td>
+ <td>22</td>
+ <td>34</td>
+ <td><code>“</code></td>
+ <td></td>
+ <td>42</td>
+ <td>66</td>
+ <td><code>B</code></td>
+ <td></td>
+ <td>62</td>
+ <td>98</td>
+ <td><code>b</code></td>
+ </tr>
+ <tr class="even">
+ <td>03</td>
+ <td>3</td>
+ <td>end of text</td>
+ <td></td>
+ <td>23</td>
+ <td>35</td>
+ <td><code>#</code></td>
+ <td></td>
+ <td>43</td>
+ <td>67</td>
+ <td><code>C</code></td>
+ <td></td>
+ <td>63</td>
+ <td>99</td>
+ <td><code>c</code></td>
+ </tr>
+ <tr class="odd">
+ <td>04</td>
+ <td>4</td>
+ <td>end of transmission</td>
+ <td></td>
+ <td>24</td>
+ <td>36</td>
+ <td><code>$</code></td>
+ <td></td>
+ <td>44</td>
+ <td>68</td>
+ <td><code>D</code></td>
+ <td></td>
+ <td>64</td>
+ <td>100</td>
+ <td><code>d</code></td>
+ </tr>
+ <tr class="even">
+ <td>05</td>
+ <td>5</td>
+ <td>enquiry</td>
+ <td></td>
+ <td>25</td>
+ <td>37</td>
+ <td><code>%</code></td>
+ <td></td>
+ <td>45</td>
+ <td>69</td>
+ <td><code>E</code></td>
+ <td></td>
+ <td>65</td>
+ <td>101</td>
+ <td><code>e</code></td>
+ </tr>
+ <tr class="odd">
+ <td>06</td>
+ <td>6</td>
+ <td>acknowledge</td>
+ <td></td>
+ <td>26</td>
+ <td>38</td>
+ <td><code>&amp;</code></td>
+ <td></td>
+ <td>46</td>
+ <td>70</td>
+ <td><code>F</code></td>
+ <td></td>
+ <td>66</td>
+ <td>102</td>
+ <td><code>f</code></td>
+ </tr>
+ <tr class="even">
+ <td>07</td>
+ <td>7</td>
+ <td>bell (\a,^H)</td>
+ <td></td>
+ <td>27</td>
+ <td>39</td>
+ <td><code>‘</code></td>
+ <td></td>
+ <td>47</td>
+ <td>71</td>
+ <td><code>G</code></td>
+ <td></td>
+ <td>67</td>
+ <td>103</td>
+ <td><code>g</code></td>
+ </tr>
+ <tr class="odd">
+ <td>08</td>
+ <td>8</td>
+ <td>backspace (\b)</td>
+ <td></td>
+ <td>28</td>
+ <td>40</td>
+ <td><code>(</code></td>
+ <td></td>
+ <td>48</td>
+ <td>72</td>
+ <td><code>H</code></td>
+ <td></td>
+ <td>68</td>
+ <td>104</td>
+ <td><code>h</code></td>
+ </tr>
+ <tr class="even">
+ <td>09</td>
+ <td>9</td>
+ <td>tab (\t)</td>
+ <td></td>
+ <td>29</td>
+ <td>41</td>
+ <td><code>)</code></td>
+ <td></td>
+ <td>49</td>
+ <td>73</td>
+ <td><code>I</code></td>
+ <td></td>
+ <td>69</td>
+ <td>105</td>
+ <td><code>i</code></td>
+ </tr>
+ <tr class="odd">
+ <td>0a</td>
+ <td>10</td>
+ <td>line feed (\n)</td>
+ <td></td>
+ <td>2a</td>
+ <td>42</td>
+ <td><code>*</code></td>
+ <td></td>
+ <td>4a</td>
+ <td>74</td>
+ <td><code>J</code></td>
+ <td></td>
+ <td>6a</td>
+ <td>106</td>
+ <td><code>j</code></td>
+ </tr>
+ <tr class="even">
+ <td>0b</td>
+ <td>11</td>
+ <td>vertical tab (\v)</td>
+ <td></td>
+ <td>2b</td>
+ <td>43</td>
+ <td><code>+</code></td>
+ <td></td>
+ <td>4b</td>
+ <td>75</td>
+ <td><code>K</code></td>
+ <td></td>
+ <td>6b</td>
+ <td>107</td>
+ <td><code>k</code></td>
+ </tr>
+ <tr class="odd">
+ <td>0c</td>
+ <td>12</td>
+ <td>form feed (\f)</td>
+ <td></td>
+ <td>2c</td>
+ <td>44</td>
+ <td><code>,</code></td>
+ <td></td>
+ <td>4c</td>
+ <td>76</td>
+ <td><code>L</code></td>
+ <td></td>
+ <td>6c</td>
+ <td>108</td>
+ <td><code>l</code></td>
+ </tr>
+ <tr class="even">
+ <td>0d</td>
+ <td>13</td>
+ <td>carriage return (\r)</td>
+ <td></td>
+ <td>2d</td>
+ <td>45</td>
+ <td><code>-</code></td>
+ <td></td>
+ <td>4d</td>
+ <td>77</td>
+ <td><code>M</code></td>
+ <td></td>
+ <td>6d</td>
+ <td>109</td>
+ <td><code>m</code></td>
+ </tr>
+ <tr class="odd">
+ <td>0e</td>
+ <td>14</td>
+ <td>shift out</td>
+ <td></td>
+ <td>2e</td>
+ <td>46</td>
+ <td><code>.</code></td>
+ <td></td>
+ <td>4e</td>
+ <td>78</td>
+ <td><code>N</code></td>
+ <td></td>
+ <td>6e</td>
+ <td>110</td>
+ <td><code>n</code></td>
+ </tr>
+ <tr class="even">
+ <td>0f</td>
+ <td>15</td>
+ <td>shift in</td>
+ <td></td>
+ <td>2f</td>
+ <td>47</td>
+ <td><code>/</code></td>
+ <td></td>
+ <td>4f</td>
+ <td>79</td>
+ <td><code>O</code></td>
+ <td></td>
+ <td>6f</td>
+ <td>111</td>
+ <td><code>o</code></td>
+ </tr>
+ <tr class="odd">
+ <td>10</td>
+ <td>16</td>
+ <td>data link escape</td>
+ <td></td>
+ <td>30</td>
+ <td>48</td>
+ <td><code>0</code></td>
+ <td></td>
+ <td>50</td>
+ <td>80</td>
+ <td><code>P</code></td>
+ <td></td>
+ <td>70</td>
+ <td>112</td>
+ <td><code>p</code></td>
+ </tr>
+ <tr class="even">
+ <td>11</td>
+ <td>17</td>
+ <td>device control one</td>
+ <td></td>
+ <td>31</td>
+ <td>49</td>
+ <td><code>1</code></td>
+ <td></td>
+ <td>51</td>
+ <td>81</td>
+ <td><code>Q</code></td>
+ <td></td>
+ <td>71</td>
+ <td>113</td>
+ <td><code>q</code></td>
+ </tr>
+ <tr class="odd">
+ <td>12</td>
+ <td>18</td>
+ <td>device control two</td>
+ <td></td>
+ <td>32</td>
+ <td>50</td>
+ <td><code>2</code></td>
+ <td></td>
+ <td>52</td>
+ <td>82</td>
+ <td><code>R</code></td>
+ <td></td>
+ <td>72</td>
+ <td>114</td>
+ <td><code>r</code></td>
+ </tr>
+ <tr class="even">
+ <td>13</td>
+ <td>19</td>
+ <td>device control three</td>
+ <td></td>
+ <td>33</td>
+ <td>51</td>
+ <td><code>3</code></td>
+ <td></td>
+ <td>53</td>
+ <td>83</td>
+ <td><code>S</code></td>
+ <td></td>
+ <td>73</td>
+ <td>115</td>
+ <td><code>s</code></td>
+ </tr>
+ <tr class="odd">
+ <td>14</td>
+ <td>20</td>
+ <td>device control four</td>
+ <td></td>
+ <td>34</td>
+ <td>52</td>
+ <td><code>4</code></td>
+ <td></td>
+ <td>54</td>
+ <td>84</td>
+ <td><code>T</code></td>
+ <td></td>
+ <td>74</td>
+ <td>116</td>
+ <td><code>t</code></td>
+ </tr>
+ <tr class="even">
+ <td>15</td>
+ <td>21</td>
+ <td>negative acknowledge</td>
+ <td></td>
+ <td>35</td>
+ <td>53</td>
+ <td><code>5</code></td>
+ <td></td>
+ <td>55</td>
+ <td>85</td>
+ <td><code>U</code></td>
+ <td></td>
+ <td>75</td>
+ <td>117</td>
+ <td><code>u</code></td>
+ </tr>
+ <tr class="odd">
+ <td>16</td>
+ <td>22</td>
+ <td>synchronous idle</td>
+ <td></td>
+ <td>36</td>
+ <td>54</td>
+ <td><code>6</code></td>
+ <td></td>
+ <td>56</td>
+ <td>86</td>
+ <td><code>V</code></td>
+ <td></td>
+ <td>76</td>
+ <td>118</td>
+ <td><code>v</code></td>
+ </tr>
+ <tr class="even">
+ <td>17</td>
+ <td>23</td>
+ <td>end of transmission</td>
+ <td></td>
+ <td>37</td>
+ <td>55</td>
+ <td><code>7</code></td>
+ <td></td>
+ <td>57</td>
+ <td>87</td>
+ <td><code>W</code></td>
+ <td></td>
+ <td>77</td>
+ <td>119</td>
+ <td><code>w</code></td>
+ </tr>
+ <tr class="odd">
+ <td>18</td>
+ <td>24</td>
+ <td>cancel</td>
+ <td></td>
+ <td>38</td>
+ <td>56</td>
+ <td><code>8</code></td>
+ <td></td>
+ <td>58</td>
+ <td>88</td>
+ <td><code>X</code></td>
+ <td></td>
+ <td>78</td>
+ <td>120</td>
+ <td><code>x</code></td>
+ </tr>
+ <tr class="even">
+ <td>19</td>
+ <td>25</td>
+ <td>end of medium</td>
+ <td></td>
+ <td>39</td>
+ <td>57</td>
+ <td><code>9</code></td>
+ <td></td>
+ <td>59</td>
+ <td>89</td>
+ <td><code>Y</code></td>
+ <td></td>
+ <td>79</td>
+ <td>121</td>
+ <td><code>y</code></td>
+ </tr>
+ <tr class="odd">
+ <td>1a</td>
+ <td>26</td>
+ <td>substitute</td>
+ <td></td>
+ <td>3a</td>
+ <td>58</td>
+ <td><code>:</code></td>
+ <td></td>
+ <td>5a</td>
+ <td>90</td>
+ <td><code>Z</code></td>
+ <td></td>
+ <td>7a</td>
+ <td>122</td>
+ <td><code>z</code></td>
+ </tr>
+ <tr class="even">
+ <td>1b</td>
+ <td>27</td>
+ <td>escape</td>
+ <td></td>
+ <td>3b</td>
+ <td>59</td>
+ <td><code>;</code></td>
+ <td></td>
+ <td>5b</td>
+ <td>91</td>
+ <td><code>[</code></td>
+ <td></td>
+ <td>7b</td>
+ <td>123</td>
+ <td><code>{</code></td>
+ </tr>
+ <tr class="odd">
+ <td>1c</td>
+ <td>28</td>
+ <td>file separator</td>
+ <td></td>
+ <td>3c</td>
+ <td>60</td>
+ <td><code>&lt;</code></td>
+ <td></td>
+ <td>5c</td>
+ <td>92</td>
+ <td><code>\</code></td>
+ <td></td>
+ <td>7c</td>
+ <td>124</td>
+ <td><code>|</code></td>
+ </tr>
+ <tr class="even">
+ <td>1d</td>
+ <td>29</td>
+ <td>group separator</td>
+ <td></td>
+ <td>3d</td>
+ <td>61</td>
+ <td><code>=</code></td>
+ <td></td>
+ <td>5d</td>
+ <td>93</td>
+ <td><code>]</code></td>
+ <td></td>
+ <td>7d</td>
+ <td>125</td>
+ <td><code>}</code></td>
+ </tr>
+ <tr class="odd">
+ <td>1e</td>
+ <td>30</td>
+ <td>record separator</td>
+ <td></td>
+ <td>3e</td>
+ <td>62</td>
+ <td><code>&gt;</code></td>
+ <td></td>
+ <td>5e</td>
+ <td>94</td>
+ <td><code>^</code></td>
+ <td></td>
+ <td>7e</td>
+ <td>126</td>
+ <td><code>~</code></td>
+ </tr>
+ <tr class="even">
+ <td>1f</td>
+ <td>31</td>
+ <td>unit separator</td>
+ <td></td>
+ <td>3f</td>
+ <td>63</td>
+ <td><code>?</code></td>
+ <td></td>
+ <td>5f</td>
+ <td>95</td>
+ <td><code>_</code></td>
+ <td></td>
+ <td>7f</td>
+ <td>127</td>
+ <td><code>DEL</code></td>
+ </tr>
+ </tbody>
+</table>
<!--
diff --git a/assets/albums/1989.jpg b/assets/albums/1989.jpg
deleted file mode 100644
index d9d53e9..0000000
--- a/assets/albums/1989.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/HARDCORE-HEAVEN.jpg b/assets/albums/HARDCORE-HEAVEN.jpg
deleted file mode 100644
index fffbadc..0000000
--- a/assets/albums/HARDCORE-HEAVEN.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/american-idiot.jpg b/assets/albums/american-idiot.jpg
deleted file mode 100644
index 94a6691..0000000
--- a/assets/albums/american-idiot.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/biyaaheysf.jpg b/assets/albums/biyaaheysf.jpg
deleted file mode 100644
index 8851887..0000000
--- a/assets/albums/biyaaheysf.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/blurryface.jpg b/assets/albums/blurryface.jpg
deleted file mode 100644
index 49dcb1c..0000000
--- a/assets/albums/blurryface.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/celeste.jpg b/assets/albums/celeste.jpg
deleted file mode 100644
index 3b611fe..0000000
--- a/assets/albums/celeste.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/dance-fever.jpg b/assets/albums/dance-fever.jpg
deleted file mode 100644
index 789711e..0000000
--- a/assets/albums/dance-fever.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/death-of-a-bachelor.jpg b/assets/albums/death-of-a-bachelor.jpg
deleted file mode 100644
index f7d2b4c..0000000
--- a/assets/albums/death-of-a-bachelor.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/deathconsciousness.jpg b/assets/albums/deathconsciousness.jpg
deleted file mode 100644
index 56d4e1a..0000000
--- a/assets/albums/deathconsciousness.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/electra-heart.jpg b/assets/albums/electra-heart.jpg
deleted file mode 100644
index 72619b0..0000000
--- a/assets/albums/electra-heart.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/food-house.jpg b/assets/albums/food-house.jpg
deleted file mode 100644
index e8beee4..0000000
--- a/assets/albums/food-house.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/funeral.jpg b/assets/albums/funeral.jpg
deleted file mode 100644
index 2f0fbd6..0000000
--- a/assets/albums/funeral.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/laurel-hell.jpg b/assets/albums/laurel-hell.jpg
deleted file mode 100644
index 7e2f988..0000000
--- a/assets/albums/laurel-hell.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/let-them-be-alien.jpg b/assets/albums/let-them-be-alien.jpg
deleted file mode 100644
index 4db9f14..0000000
--- a/assets/albums/let-them-be-alien.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/lungs.jpg b/assets/albums/lungs.jpg
deleted file mode 100644
index e92e04f..0000000
--- a/assets/albums/lungs.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/mellon-collie.jpg b/assets/albums/mellon-collie.jpg
deleted file mode 100644
index 1737e1e..0000000
--- a/assets/albums/mellon-collie.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/octopath.jpg b/assets/albums/octopath.jpg
deleted file mode 100644
index a52a6bf..0000000
--- a/assets/albums/octopath.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/random-access-memories.jpg b/assets/albums/random-access-memories.jpg
deleted file mode 100644
index 33ae2de..0000000
--- a/assets/albums/random-access-memories.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/swvwv.jpg b/assets/albums/swvwv.jpg
deleted file mode 100644
index 72ff558..0000000
--- a/assets/albums/swvwv.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/albums/the-suburbs.jpg b/assets/albums/the-suburbs.jpg
deleted file mode 100644
index c110bc2..0000000
--- a/assets/albums/the-suburbs.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/bone-alt.jpg b/assets/books/bone-alt.jpg
deleted file mode 100644
index 527329f..0000000
--- a/assets/books/bone-alt.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/bone.jpg b/assets/books/bone.jpg
deleted file mode 100644
index 58d8c6f..0000000
--- a/assets/books/bone.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/catch-22.jpg b/assets/books/catch-22.jpg
deleted file mode 100644
index 1212728..0000000
--- a/assets/books/catch-22.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/fahrenheit-451.jpg b/assets/books/fahrenheit-451.jpg
deleted file mode 100644
index 7de2c61..0000000
--- a/assets/books/fahrenheit-451.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/harrison-bergeron-alt.jpg b/assets/books/harrison-bergeron-alt.jpg
deleted file mode 100644
index b10a18c..0000000
--- a/assets/books/harrison-bergeron-alt.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/harrison-bergeron.jpg b/assets/books/harrison-bergeron.jpg
deleted file mode 100644
index 0367e4d..0000000
--- a/assets/books/harrison-bergeron.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/harry-potter.jpg b/assets/books/harry-potter.jpg
deleted file mode 100644
index f89148a..0000000
--- a/assets/books/harry-potter.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/ishmael.jpg b/assets/books/ishmael.jpg
deleted file mode 100644
index 4b10a38..0000000
--- a/assets/books/ishmael.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/narnia-alt.jpg b/assets/books/narnia-alt.jpg
deleted file mode 100644
index 83aaf20..0000000
--- a/assets/books/narnia-alt.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/narnia.jpg b/assets/books/narnia.jpg
deleted file mode 100644
index faf84f2..0000000
--- a/assets/books/narnia.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/nineteen-eighty-four.jpeg b/assets/books/nineteen-eighty-four.jpeg
deleted file mode 100644
index 04a1ad6..0000000
--- a/assets/books/nineteen-eighty-four.jpeg
+++ /dev/null
Binary files differ
diff --git a/assets/books/notes-from-the-underground.jpg b/assets/books/notes-from-the-underground.jpg
deleted file mode 100644
index 5f4c974..0000000
--- a/assets/books/notes-from-the-underground.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/siddhartha.jpg b/assets/books/siddhartha.jpg
deleted file mode 100644
index 0963af4..0000000
--- a/assets/books/siddhartha.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/slaughterhouse-five.jpg b/assets/books/slaughterhouse-five.jpg
deleted file mode 100644
index f3fcdc4..0000000
--- a/assets/books/slaughterhouse-five.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/the-giver.jpg b/assets/books/the-giver.jpg
deleted file mode 100644
index be21020..0000000
--- a/assets/books/the-giver.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/the-handmaids-tale.jpg b/assets/books/the-handmaids-tale.jpg
deleted file mode 100644
index ff883ad..0000000
--- a/assets/books/the-handmaids-tale.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/the-library-of-babel.png b/assets/books/the-library-of-babel.png
deleted file mode 100644
index 5ec5aaf..0000000
--- a/assets/books/the-library-of-babel.png
+++ /dev/null
Binary files differ
diff --git a/assets/books/the-lord-of-the-rings-alt.jpg b/assets/books/the-lord-of-the-rings-alt.jpg
deleted file mode 100644
index 0e8df00..0000000
--- a/assets/books/the-lord-of-the-rings-alt.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/the-lord-of-the-rings.jpg b/assets/books/the-lord-of-the-rings.jpg
deleted file mode 100644
index 4593a31..0000000
--- a/assets/books/the-lord-of-the-rings.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/the-lottery.png b/assets/books/the-lottery.png
deleted file mode 100644
index d43ea95..0000000
--- a/assets/books/the-lottery.png
+++ /dev/null
Binary files differ
diff --git a/assets/books/the-picture-of-dorian-gray.jpg b/assets/books/the-picture-of-dorian-gray.jpg
deleted file mode 100644
index 6ea843a..0000000
--- a/assets/books/the-picture-of-dorian-gray.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/the-secret-history.jpg b/assets/books/the-secret-history.jpg
deleted file mode 100644
index dd5cd5e..0000000
--- a/assets/books/the-secret-history.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/books/twilight.jpg b/assets/books/twilight.jpg
deleted file mode 100644
index 12d41d8..0000000
--- a/assets/books/twilight.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/comics/a-softer-world.png b/assets/comics/a-softer-world.png
deleted file mode 100644
index 83d917f..0000000
--- a/assets/comics/a-softer-world.png
+++ /dev/null
Binary files differ
diff --git a/assets/comics/avasdemon.jpg b/assets/comics/avasdemon.jpg
deleted file mode 100644
index de54e8e..0000000
--- a/assets/comics/avasdemon.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/comics/calvin-and-hobbes-alt.jpg b/assets/comics/calvin-and-hobbes-alt.jpg
deleted file mode 100644
index f04470a..0000000
--- a/assets/comics/calvin-and-hobbes-alt.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/comics/calvin-and-hobbes.jpg b/assets/comics/calvin-and-hobbes.jpg
deleted file mode 100644
index 0657fab..0000000
--- a/assets/comics/calvin-and-hobbes.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/comics/copper.jpg b/assets/comics/copper.jpg
deleted file mode 100644
index fded479..0000000
--- a/assets/comics/copper.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/comics/hark-alt.png b/assets/comics/hark-alt.png
deleted file mode 100644
index 2830207..0000000
--- a/assets/comics/hark-alt.png
+++ /dev/null
Binary files differ
diff --git a/assets/comics/hark.png b/assets/comics/hark.png
deleted file mode 100644
index 30525f2..0000000
--- a/assets/comics/hark.png
+++ /dev/null
Binary files differ
diff --git a/assets/comics/homestuck.svg b/assets/comics/homestuck.svg
deleted file mode 100644
index e257591..0000000
--- a/assets/comics/homestuck.svg
+++ /dev/null
@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg width="220pt" height="233pt" viewBox="0 0 220 233" version="1.1" xmlns="http://www.w3.org/2000/svg">
-<g id="#4be14eff">
-<path fill="#4be14e" opacity="1.00" d=" M 106.10 7.03 C 139.87 24.39 173.84 41.38 207.52 58.90 C 174.38 59.12 141.22 58.95 108.07 58.99 C 108.02 60.66 107.98 62.34 107.93 64.01 C 73.45 63.93 38.96 64.13 4.48 63.91 C 17.85 56.67 31.55 50.06 44.99 42.95 C 45.02 32.64 44.98 22.32 45.01 12.01 C 57.34 11.99 69.67 11.99 81.99 12.01 C 81.99 15.67 82.00 19.32 82.01 22.98 C 89.99 19.32 98.02 15.75 105.93 11.96 C 105.99 10.32 106.03 8.68 106.10 7.03 Z"/>
-<path fill="#4be14e" opacity="1.00" d=" M 115.01 65.01 C 139.00 64.99 163.00 64.99 186.99 65.01 C 187.01 89.00 187.01 113.00 186.99 136.99 C 175.33 137.01 163.67 137.01 152.01 136.99 C 151.98 124.66 152.02 112.34 151.99 100.01 C 139.66 99.98 127.34 100.02 115.01 99.99 C 114.99 88.33 114.99 76.67 115.01 65.01 Z"/>
-<path fill="#4be14e" opacity="1.00" d=" M 29.01 69.01 C 53.00 68.99 77.00 68.99 100.99 69.01 C 101.01 93.00 101.01 117.00 100.99 140.99 C 77.00 141.01 53.00 141.01 29.01 140.99 C 28.99 117.00 28.99 93.00 29.01 69.01 Z"/>
-<path fill="#4be14e" opacity="1.00" d=" M 109.01 107.01 C 121.00 106.99 133.00 106.99 144.99 107.01 C 145.01 119.00 145.01 131.00 144.99 142.99 C 133.00 143.01 121.00 143.01 109.01 142.99 C 108.99 131.00 108.99 119.00 109.01 107.01 Z"/>
-<path fill="#4be14e" opacity="1.00" d=" M 29.01 151.01 C 53.00 150.99 77.00 150.99 100.99 151.01 C 101.01 175.00 101.01 199.00 100.99 222.99 C 77.00 223.01 53.00 223.01 29.01 222.99 C 28.99 199.00 28.99 175.00 29.01 151.01 Z"/>
-<path fill="#4be14e" opacity="1.00" d=" M 111.01 151.01 C 135.00 150.99 159.00 150.99 182.99 151.01 C 183.01 175.00 183.01 199.00 182.99 222.99 C 159.00 223.01 135.00 223.01 111.01 222.99 C 110.99 199.00 110.99 175.00 111.01 151.01 Z"/>
-</g>
-</svg> \ No newline at end of file
diff --git a/assets/comics/xkcd.png b/assets/comics/xkcd.png
deleted file mode 100644
index b2a5482..0000000
--- a/assets/comics/xkcd.png
+++ /dev/null
Binary files differ
diff --git a/assets/posters/2001-a-space-odyssey.jpg b/assets/posters/2001-a-space-odyssey.jpg
deleted file mode 100644
index 449ec09..0000000
--- a/assets/posters/2001-a-space-odyssey.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/posters/avatar-the-last-airbender-alt.jpg b/assets/posters/avatar-the-last-airbender-alt.jpg
deleted file mode 100644
index 0af9da6..0000000
--- a/assets/posters/avatar-the-last-airbender-alt.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/posters/avatar-the-last-airbender.jpg b/assets/posters/avatar-the-last-airbender.jpg
deleted file mode 100644
index bbd05cc..0000000
--- a/assets/posters/avatar-the-last-airbender.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/posters/blade-runner.jpg b/assets/posters/blade-runner.jpg
deleted file mode 100644
index 08a860f..0000000
--- a/assets/posters/blade-runner.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/posters/coraline-alt.jpg b/assets/posters/coraline-alt.jpg
deleted file mode 100644
index 758c971..0000000
--- a/assets/posters/coraline-alt.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/posters/coraline.jpg b/assets/posters/coraline.jpg
deleted file mode 100644
index 04df4f4..0000000
--- a/assets/posters/coraline.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/posters/dr-strangelove.jpg b/assets/posters/dr-strangelove.jpg
deleted file mode 100644
index 2d0373e..0000000
--- a/assets/posters/dr-strangelove.jpg
+++ /dev/null
Binary files differ
diff --git a/assets/posters/my-neighbor-totoro.jpg b/assets/posters/my-neighbor-totoro.jpg
deleted file mode 100644
index 5db60b5..0000000
--- a/assets/posters/my-neighbor-totoro.jpg
+++ /dev/null
Binary files differ
diff --git a/bookshelf.html b/bookshelf.html
index ad47a45..35f5850 100644
--- a/bookshelf.html
+++ b/bookshelf.html
@@ -1,185 +1,240 @@
---
-layout: default
+layout: main
title: bookshelf
---
- <link rel="stylesheet" href="css/bookshelf.css"/>
- {% include header.html %}
- <main>
- <h2>Classics</h2>
- <div class="shelf" id="classics">
- <div>
- <img src="assets/books/the-picture-of-dorian-gray.jpg" class="cover"/>
- <h3>The Picture of Dorian Gray</h3>
- <i>Oscar Wilde</i>
- </div>
- <div>
- <img src="assets/books/the-secret-history.jpg" class="cover"/>
- <h3>The Secret History</h3>
- <i>Donna Tartt</i>
- </div>
- </div>
- <hr>
- <h2>Dystopian</h2>
- <div class="shelf" id="dystopia">
- <div>
- <img src="assets/books/the-giver.jpg" class="cover"/>
- <h3>The Giver</h3>
- <i>Lois Lowry</i>
- </div>
- <div>
- <img src="assets/books/fahrenheit-451.jpg" class="cover"/>
- <h3>Fahrenheit 451</h3>
- <i>Ray Bradbury</i>
- </div>
- <!-- <div>
- <img src="assets/books/nineteen-eighty-four.jpeg" class="cover"/>
- <h3>Nineteen Eighty-Four</h3>
- <i>George Orwell</i>
- </div> -->
- <div>
- <img src="assets/books/the-handmaids-tale.jpg" class="cover"/>
- <h3>The Handmaid's Tale</h3>
- <i>Margaret Atwood</i>
- </div>
- </div>
- <hr>
- <h2>Philosophy</h2>
- <div class="shelf" id="philosophy">
- <div>
- <img src="assets/books/ishmael.jpg" class="cover"/>
- <h3>Ishmael</h3>
- <i>Daniel Quinn</i>
- </div>
- <div>
- <img src="assets/books/notes-from-the-underground.jpg" class="cover"/>
- <h3>Notes from the Underground</h3>
- <i>Fyodor Dostoevsky</i>
- </div>
- <div>
- <img src="assets/books/slaughterhouse-five.jpg" class="cover"/>
- <h3>Slaughterhouse-Five</h3>
- <i>Kurt Vonnegut</i>
- </div>
- <div>
- <img src="assets/books/siddhartha.jpg" class="cover"/>
- <h3>Siddhartha</h3>
- <i>Hermann Hesse</i>
- </div>
- <div>
- <img src="assets/books/catch-22.jpg" class="cover"/>
- <h3>Catch-22</h3>
- <i>Joseph Heller</i>
- </div>
- </div>
- <hr>
- <h2>Fantasy</h2>
- <div class="shelf" id="fantasy">
- <div>
- <img src="assets/books/narnia.jpg" class="cover"/>
- <h3>Narnia</h3>
- <i>C.S. Lewis</i>
- </div>
- <div>
- <img src="assets/books/harry-potter.jpg" class="cover"/>
- <h3>Harry Potter</h3>
- <i>J.K. Rowling</i>
- </div>
- <div>
- <img src="assets/books/the-lord-of-the-rings.jpg" class="cover"/>
- <h3>The Lord of the Rings</h3>
- <i>J.R.R. Tolkien</i>
- </div>
- </div>
- <hr>
- <h2>Short Stories</h2>
- <div class="shelf" id="short-stories">
- <div>
- <img src="assets/books/the-library-of-babel.png" class="icon"/>
- <h3>The Library of Babel</h3>
- <i>Jorge Luis Borges</i>
- </div>
- <div>
- <img src="assets/books/the-lottery.png" class="icon"/>
- <h3>The Lottery</h3>
- <i>Shirley Jackson</i>
- </div>
- <div>
- <img src="assets/books/harrison-bergeron.jpg" style="width: 80px;" class="icon"/>
- <h3>Harrison Bergeron</h3>
- <i>Kurt Vonnegut</i>
- </div>
- </div>
- <hr>
- <h2>Comics</h2>
- <div class="shelf" id="comics">
- <div>
- <img src="assets/comics/calvin-and-hobbes.jpg" class="cover"/>
- <h3>Calvin and Hobbes</h3>
- <i>Bill Watterson</i>
- </div>
- <div>
- <img src="assets/books/bone.jpg" class="cover"/>
- <h3>BONE</h3>
- <i>Jeff Smith</i>
- </div>
- <div>
- <img src="assets/comics/copper.jpg" class="cover"/>
- <h3><a href="https://www.boltcityproductions.com/copper/">Copper</a></h3>
- <i>Kazu Kibuishi</i>
- </div>
- <div>
- <img src="assets/comics/hark.png" class="cover"/>
- <h3><a href="http://www.harkavagrant.com/">Hark! a Vagrant</a></h3>
- <i>Kate Beaton</i>
- </div>
- <div>
- <img src="assets/comics/homestuck.svg" class="icon"/>
- <h3><a href="https://homestuck.com">Homestuck</a></h3>
- <i>Andrew Hussie</i>
- </div>
- <div>
- <img src="assets/comics/avasdemon.jpg" class="cover"/>
- <h3><a href="https://www.avasdemon.com/">Ava's Demon</a></h3>
- <i>Michelle Czajkowski</i>
- </div>
- <div>
- <img src="assets/comics/a-softer-world.png" class="icon"/>
- <h3><a href="https://www.asofterworld.com/">a softer world</a></h3>
- <i>Emily Horne and Joey Comeau</i>
- </div>
- <div>
- <img src="assets/comics/xkcd.png" class="icon"/>
- <h3><a href="https://xkcd.com/">xkcd</a></h3>
- <i>Randall Munroe</i>
- </div>
- </div>
- <hr>
- <h2>Media</h2>
- <div class="shelf" id="media">
- <div>
- <img src="assets/posters/2001-a-space-odyssey.jpg" class="poster"/>
- <p><h3>2001: A Space Odyssey</h3></p>
- </div>
- <div>
- <img src="assets/posters/blade-runner.jpg" class="poster"/>
- <p><h3>Blade Runner</h3></p>
- </div>
- <div>
- <img src="assets/posters/dr-strangelove.jpg" class="poster"/>
- <p><h3>Dr. Strangelove</h3></p>
- </div>
- <div>
- <img src="assets/posters/avatar-the-last-airbender.jpg" class="poster"/>
- <p><h3>Avatar: The Last Airbender</h3></p>
- </div>
- <div>
- <img src="assets/posters/coraline.jpg" class="poster"/>
- <p><h3>Coraline</h3></p>
- </div>
- <div>
- <img src="assets/posters/my-neighbor-totoro.jpg" class="poster"/>
- <p><h3>My Neighbor Totoro</h3></p>
- </div>
- </div>
- <hr>
- </main>
+<style>
+a {
+ color: inherit;
+}
+
+h2 {
+ margin-bottom: 4px;
+}
+
+hr {
+ background: black;
+ height: 6px;
+ margin-bottom: 20px;
+}
+
+.cover, .poster, .icon {
+ max-height: 250px;
+ /* max-width: 165px; */
+ max-width: 200px;
+ border-radius: 10px;
+}
+
+.cover {
+ border: 2px solid black;
+ box-shadow: 8px 8px grey;
+}
+
+.icon {
+ filter: drop-shadow(0px 0px 2px black);
+}
+
+.shelf {
+ display: flex;
+ flex-direction: row;
+ justify-content: space-around;
+ text-align: center;
+ align-items: flex-end;
+ flex-wrap: wrap;
+}
+
+.shelf div {
+ margin-right: 1em;
+ margin-top: 20px;
+}
+
+.shelf h3 {
+ margin-bottom: 0px;
+}
+
+@media screen and (max-width: 700px) {
+ h2 {
+ text-align: center;
+ }
+}
+
+@media (prefers-color-scheme: dark) {
+ /* invert library of babel icon */
+}
+</style>
+<h2>Classics</h2>
+<div class="shelf" id="classics">
+ <div>
+ <img src="/files/covers/books/the-picture-of-dorian-gray.jpg" class="cover"/>
+ <h3>The Picture of Dorian Gray</h3>
+ <i>Oscar Wilde</i>
+ </div>
+ <div>
+ <img src="/files/covers/books/the-secret-history.jpg" class="cover"/>
+ <h3>The Secret History</h3>
+ <i>Donna Tartt</i>
+ </div>
+</div>
+<hr>
+<h2>Dystopian</h2>
+<div class="shelf" id="dystopia">
+ <div>
+ <img src="/files/covers/books/the-giver.jpg" class="cover"/>
+ <h3>The Giver</h3>
+ <i>Lois Lowry</i>
+ </div>
+ <div>
+ <img src="/files/covers/books/fahrenheit-451.jpg" class="cover"/>
+ <h3>Fahrenheit 451</h3>
+ <i>Ray Bradbury</i>
+ </div>
+ <!-- <div>
+ <img src="/files/covers/books/nineteen-eighty-four.jpeg" class="cover"/>
+ <h3>Nineteen Eighty-Four</h3>
+ <i>George Orwell</i>
+ </div> -->
+ <div>
+ <img src="/files/covers/books/the-handmaids-tale.jpg" class="cover"/>
+ <h3>The Handmaid's Tale</h3>
+ <i>Margaret Atwood</i>
+ </div>
+</div>
+<hr>
+<h2>Philosophy</h2>
+<div class="shelf" id="philosophy">
+ <div>
+ <img src="/files/covers/books/ishmael.jpg" class="cover"/>
+ <h3>Ishmael</h3>
+ <i>Daniel Quinn</i>
+ </div>
+ <div>
+ <img src="/files/covers/books/notes-from-the-underground.jpg" class="cover"/>
+ <h3>Notes from the Underground</h3>
+ <i>Fyodor Dostoevsky</i>
+ </div>
+ <div>
+ <img src="/files/covers/books/slaughterhouse-five.jpg" class="cover"/>
+ <h3>Slaughterhouse-Five</h3>
+ <i>Kurt Vonnegut</i>
+ </div>
+ <div>
+ <img src="/files/covers/books/siddhartha.jpg" class="cover"/>
+ <h3>Siddhartha</h3>
+ <i>Hermann Hesse</i>
+ </div>
+ <div>
+ <img src="/files/covers/books/catch-22.jpg" class="cover"/>
+ <h3>Catch-22</h3>
+ <i>Joseph Heller</i>
+ </div>
+</div>
+<hr>
+<h2>Fantasy</h2>
+<div class="shelf" id="fantasy">
+ <div>
+ <img src="/files/covers/books/narnia.jpg" class="cover"/>
+ <h3>Narnia</h3>
+ <i>C.S. Lewis</i>
+ </div>
+ <div>
+ <img src="/files/covers/books/harry-potter.jpg" class="cover"/>
+ <h3>Harry Potter</h3>
+ <i>J.K. Rowling</i>
+ </div>
+ <div>
+ <img src="/files/covers/books/the-lord-of-the-rings.jpg" class="cover"/>
+ <h3>The Lord of the Rings</h3>
+ <i>J.R.R. Tolkien</i>
+ </div>
+</div>
+<hr>
+<h2>Short Stories</h2>
+<div class="shelf" id="short-stories">
+ <div>
+ <img src="/files/covers/books/the-library-of-babel.png" class="icon"/>
+ <h3>The Library of Babel</h3>
+ <i>Jorge Luis Borges</i>
+ </div>
+ <div>
+ <img src="/files/covers/books/the-lottery.png" class="icon"/>
+ <h3>The Lottery</h3>
+ <i>Shirley Jackson</i>
+ </div>
+ <div>
+ <img src="/files/covers/books/harrison-bergeron.jpg" style="width: 80px;" class="icon"/>
+ <h3>Harrison Bergeron</h3>
+ <i>Kurt Vonnegut</i>
+ </div>
+</div>
+<hr>
+<h2>Comics</h2>
+<div class="shelf" id="comics">
+ <div>
+ <img src="/files/covers/comics/calvin-and-hobbes.jpg" class="cover"/>
+ <h3>Calvin and Hobbes</h3>
+ <i>Bill Watterson</i>
+ </div>
+ <div>
+ <img src="/files/covers/books/bone.jpg" class="cover"/>
+ <h3>BONE</h3>
+ <i>Jeff Smith</i>
+ </div>
+ <div>
+ <img src="/files/covers/comics/copper.jpg" class="cover"/>
+ <h3><a href="https://www.boltcityproductions.com/copper/">Copper</a></h3>
+ <i>Kazu Kibuishi</i>
+ </div>
+ <div>
+ <img src="/files/covers/comics/hark.png" class="cover"/>
+ <h3><a href="http://www.harkavagrant.com/">Hark! a Vagrant</a></h3>
+ <i>Kate Beaton</i>
+ </div>
+ <div>
+ <img src="/files/covers/comics/homestuck.svg" class="icon"/>
+ <h3><a href="https://homestuck.com">Homestuck</a></h3>
+ <i>Andrew Hussie</i>
+ </div>
+ <div>
+ <img src="/files/covers/comics/avasdemon.jpg" class="cover"/>
+ <h3><a href="https://www.avasdemon.com/">Ava's Demon</a></h3>
+ <i>Michelle Czajkowski</i>
+ </div>
+ <div>
+ <img src="/files/covers/comics/a-softer-world.png" class="icon"/>
+ <h3><a href="https://www.asofterworld.com/">a softer world</a></h3>
+ <i>Emily Horne and Joey Comeau</i>
+ </div>
+ <div>
+ <img src="/files/covers/comics/xkcd.png" class="icon"/>
+ <h3><a href="https://xkcd.com/">xkcd</a></h3>
+ <i>Randall Munroe</i>
+ </div>
+</div>
+<hr>
+<h2>Media</h2>
+<div class="shelf" id="media">
+ <div>
+ <img src="/files/posters/2001-a-space-odyssey.jpg" class="poster"/>
+ <p><h3>2001: A Space Odyssey</h3></p>
+ </div>
+ <div>
+ <img src="/files/posters/blade-runner.jpg" class="poster"/>
+ <p><h3>Blade Runner</h3></p>
+ </div>
+ <div>
+ <img src="/files/posters/dr-strangelove.jpg" class="poster"/>
+ <p><h3>Dr. Strangelove</h3></p>
+ </div>
+ <div>
+ <img src="/files/posters/avatar-the-last-airbender.jpg" class="poster"/>
+ <p><h3>Avatar: The Last Airbender</h3></p>
+ </div>
+ <div>
+ <img src="/files/posters/coraline.jpg" class="poster"/>
+ <p><h3>Coraline</h3></p>
+ </div>
+ <div>
+ <img src="/files/posters/my-neighbor-totoro.jpg" class="poster"/>
+ <p><h3>My Neighbor Totoro</h3></p>
+ </div>
+</div>
+<hr>
diff --git a/css/bookshelf.css b/css/bookshelf.css
deleted file mode 100644
index b8795fa..0000000
--- a/css/bookshelf.css
+++ /dev/null
@@ -1,53 +0,0 @@
-a {
- color: inherit;
-}
-
-h2 {
- margin-bottom: 4px;
-}
-
-hr {
- background: black;
- height: 6px;
- margin-bottom: 20px;
-}
-
-.cover, .poster, .icon {
- max-height: 250px;
- /* max-width: 165px; */
- max-width: 200px;
- border-radius: 10px;
-}
-
-.cover {
- border: 2px solid black;
- box-shadow: 8px 8px grey;
-}
-
-.icon {
- filter: drop-shadow(0px 0px 2px black);
-}
-
-.shelf {
- display: flex;
- flex-direction: row;
- justify-content: space-around;
- text-align: center;
- align-items: flex-end;
- flex-wrap: wrap;
-}
-
-.shelf div {
- margin-right: 1em;
- margin-top: 20px;
-}
-
-.shelf h3 {
- margin-bottom: 0px;
-}
-
-@media screen and (max-width: 700px) {
- h2 {
- text-align: center;
- }
-}
diff --git a/links.html b/links.html
index 98aa55a..cf1bd63 100644
--- a/links.html
+++ b/links.html
@@ -1,117 +1,113 @@
---
-layout: default
+layout: main
title: links
---
-
- {% include header.html %}
- <main>
- <h2>JJ's collection of links</h2>
- <!-- <h3>Software</h3>
- <ul>
- <li><a href="https://fraidyc.at/">Fraidycat</a> - follow from afar</li>
- <li><a href="https://slides.com/">slides.com</a> and <a href="https://revealjs.com/">reveal.js</a> - presentations on the web</a></li>
- <li><a href="https://www.manim.community/">Manim</a> - mathematical animations</li>
- <li><a href="https://asciinema.org/">Asciinema</a> - record and share your terminal sessions</li>
- <li><a href="https://0x0.st/">0x0.st</a> - temporary file hosting</li>
- <li><a href="https://letsboard.co/">Let's Board</a> - collaborative online whiteboards</li>
- <li><a href="https://jspaint.app/">JSPaint</a> - simple paint tool</li>
- <li><a href="https://www.photopea.com/">Photopea</a> - online photo editor</li>
- <li><a href="https://www.remove.bg/">remove.bg</a> - remove image backgrounds</li>
- <li><a href="https://www.unscreen.com/">unscreen</a> - remove video backgrounds</li>
- <li><a href="https://tineye.com/">TinEye</a> - reverse image search</li>
- <li><a href="https://www.openstreetmap.org/">OpenStreetMap</a> - the wikipedia of mapping</li>
- <li><a href="https://www.windy.com/">Windy</a> - real-time weather patterns</li>
- <li><a href="https://proxy.vulpes.one/">Gemini Proxy</a> - browse the textual web</li>
- <li><a href="https://sdf.org/">sdl.org</a> and <a href="https://www.teknik.io/">teknik.io</a> - public access services</li>
- </ul> -->
- <h3>Knowledge</h3>
- <ul>
- <li><a href="https://wikipedia.org/">Wikipedia</a> - the free encyclopedia</li>
- <li><a href="https://archive.org/">Internet Archive</a> - the digital library</li>
- <li><a href="https://gen.lib.rus.ec/">Library Genesis</a> - the modern library of alexandria</li>
- <li><a href="https://annas-archive.org/">Anna's Archive</a> - preserving humanity's written heritage</li>
- <li><a href="https://sci-hub.st/">Sci-Hub</a> - public access research</li>
- <li><a href="https://www.gutenberg.org/">Project Gutenburg</a> - free ebooks</li>
- <li><a href="https://standardebooks.org/">Standard Ebooks</a> - nicely typeset, public domain ebooks</li>
- <li><a href="https://moby-thesaurus.org/">Moby Thesaurus</a> - the most comprehensive english-language thesaurus</li>
- <li><a href="https://www.youtube.com/3Blue1Brown">3Blue1Brown</a> - visualized mathematics</li>
- </ul>
- <h3>Tutorials</h3>
- <ul>
- <li><a href="https://www.khanacademy.org/">Khan Academy</a> - a free and online K-12 curriculum</li>
- <li><a href="https://www.youtube.com/c/TheOrganicChemistryTutor">The Organic Chemistry Tutor</a> - simply the best basic chemistry resource</li>
- <li><a href="https://www.youtube.com/playlist?list=PLZHQObOWTQDPD3MizzM2xVFitgF8hE_ab">3Blue1Brown's Essence of Linear Algebra</a> - linear algebra, visualized in the R^n</li>
- <li><a href="https://www.people.vcu.edu/~rhammack/BookOfProof/">Book of Proof</a> - a standard introduction to mathematical proof</li>
- <li><a href="https://www.internetingishard.com/">Interneting Is Hard</a> - a friendly html+css tutorial</li>
- <li><a href="https://javascript.info/">The Modern JavaScript Tutorial</a> - a comprehensive javascript tutorial</li>
- <li><a href="https://developer.mozilla.org/">Mozilla Developer Network</a> - documentation for the web</li>
- <li><a href="https://doc.rust-lang.org/stable/book/">The Rust Programming Language</a> - the way to learn rust</li>
- <li><a href="https://www.lesswrong.com/posts/xg3hXCYQPJkwHyik2/the-best-textbooks-on-every-subject">The Best Textbooks on Every Subject</a></li>
- </ul>
- <!-- <h3>Websites</h3>
- <ul>
- <li><a href="https://libraryofbabel.info/">The Library of Babel</a> - every book ever or to be written</li>
- <li><a href="https://http.cat/">HTTP Cats</a> - appropriate status codes</li>
- <li><a href="https://colors.lol/">colors.lol</a> - overly descriptive color palettes</li>
- <li><a href="https://picular.co">Picular</a> - The color of anything</li>
- <li><a href="https://www.dictionaryofobscuresorrows.com/">The Dictionary of Obscure Sorrows</a></li>
- <li><a href="https://www.thisworddoesnotexist.com/">This Word Does Not Exist</a></li>
- <li><a href="https://wordhistories.net/">Word Histories</a></li>
- <li><a href="http://talkobamato.me/">Talk Obama To Me</a></li>
- <li><a href="https://www.thiswebsitewillselfdestruct.com/">This Website Will Self Destruct</a></li>
- <li><a href="http://www.superbad.com/">superbad.com</a></li>
- <li><a href="http://beesbeesbees.com/">beesbeesbees.com</a></li>
- <li><a href="https://web.archive.org/web/2/https://scamdaddy.net/">scamdaddy.net</a></li>
- </ul> -->
- <h3>Articles</h3>
- <ul>
- <li><a href="https://drewdevault.com/2018/07/09/Simple-correct-fast.html">Simple, correct, fast: in that order</a></li>
- <li><a href="http://worrydream.com/ABriefRantOnTheFutureOfInteractionDesign/">A brief rant on the future of interaction design</a></li>
- <li><a href="https://thorstenball.com/blog/2020/09/08/how-can-you-not-be-romantic-about-programming/">How can you not be romantic about programming?</a></li>
- <li><a href="https://norvig.com/spell-correct.html">How to write a spelling corrector</a></li>
- <li><a href="https://www.a1k0n.net/2011/07/20/donut-math.html">Donut math: how donut.c works</a></li>
- <li><a href="https://nullprogram.com/blog/2020/12/31/">State machines are wonderful tools</a></li>
- <li><a href="https://indieweb.org/POSSE">Publish on your own site, syndicate elsewhere</a></li>
- <li><a href="https://dutzi.party/userscripts-are-fun/">Userscripts are fun and are very much still relevant</a></li>
- <li><a href="https://carter.sande.duodecima.technology/javascript-page-navigation/">Browsers are pretty good at loading pages, it turns out</a></li>
- <li><a href="https://eev.ee/blog/2020/02/01/old-css-new-css/">Old CSS, new CSS</a></li>
- </ul>
- <!-- <h3>Games</h3>
- <ul>
- <li><a href="https://adventofcode.com/">Advent of Code</a></li>
- <li><a href="https://www.newgrounds.com/portal/view/365143">The Impossible Quiz</a></li>
- <li><a href="https://www.kingdomofloathing.com">Kingdom of Loathing</a></li>
- <li><a href="https://ninja-muffin24.itch.io/funkin">Friday Night Funkin'</a></li>
- <li><a href="https://awooo.ru/VVVVVV/">VVVVVV</a></li>
- <li><a href="https://netgames.io/games/">Netgames</a></li>
- <li><a href="https://skribbl.io/">Skribbl.io</a></li>
- <li><a href="https://lichess.org/">lichess</a></li>
- </ul> -->
- <h3>Aesthetic</h3>
- <ul>
- <li><a href="https://emersion.fr/">Simon Ser</a></li>
- <li><a href="https://hojberg.xyz/">Simon Højberg</a></li>
- <li><a href="https://thea.codes/">Thea Flowers</a></li>
- <li><a href="https://dustri.org/">Julien Voisin</a></li>
- <li><a href="https://czeng.org/">Catherine Zeng</a></li>
- <li><a href="https://nora.codes/">Leonora Tindall</a></li>
- <li><a href="https://victoria.dev/">Victoria Drake</a></li>
- <li><a href="https://tilde.team/~kiedtl/">Kiëd Llaentenn</a></li>
- <li><a href="https://christine.website/">Christine Dodrill</a></li>
- <li><a href="https://derekmeer.com/">Derek Meer</a></li>
- <li><a href="https://julian.digital/">Julian Lehr</a></li>
- <li><a href="https://abhinavsarkar.net/">Abhinav Sarkar</a></li>
- <li><a href="https://lea.verou.me/about/">Lea Verou</a></li>
- <li><a href="https://www.joshwcomeau.com/">Josh Comeau</a></li>
- <li><a href="https://acko.net/">Steven Wittens</a></li>
- <li><a href="https://www.gwern.net/index">Gwern Branwen</a></li>
- <li><a href="https://thedigitaldiarist.ca/">Alicia Neptune</a></li>
- <li><a href="https://memex.marginalia.nu/">marginalia</a></li>
- <li><a href="https://tilde.club/~alun/">alun</a></li>
- </ul>
- <h3>More Links</h3>
- <ul>
- <li><a href="https://href.cool/about/">href.cool</a></li>
- <li><a href="https://webring.xxiivv.com/">xxiivv</a></li>
- </ul>
- </main>
+<h2>a collection of links</h2>
+<!-- <h3>Software</h3>
+<ul>
+ <li><a href="https://fraidyc.at/">Fraidycat</a> - follow from afar</li>
+ <li><a href="https://slides.com/">slides.com</a> and <a href="https://revealjs.com/">reveal.js</a> - presentations on the web</a></li>
+ <li><a href="https://www.manim.community/">Manim</a> - mathematical animations</li>
+ <li><a href="https://asciinema.org/">Asciinema</a> - record and share your terminal sessions</li>
+ <li><a href="https://0x0.st/">0x0.st</a> - temporary file hosting</li>
+ <li><a href="https://letsboard.co/">Let's Board</a> - collaborative online whiteboards</li>
+ <li><a href="https://jspaint.app/">JSPaint</a> - simple paint tool</li>
+ <li><a href="https://www.photopea.com/">Photopea</a> - online photo editor</li>
+ <li><a href="https://www.remove.bg/">remove.bg</a> - remove image backgrounds</li>
+ <li><a href="https://www.unscreen.com/">unscreen</a> - remove video backgrounds</li>
+ <li><a href="https://tineye.com/">TinEye</a> - reverse image search</li>
+ <li><a href="https://www.openstreetmap.org/">OpenStreetMap</a> - the wikipedia of mapping</li>
+ <li><a href="https://www.windy.com/">Windy</a> - real-time weather patterns</li>
+ <li><a href="https://proxy.vulpes.one/">Gemini Proxy</a> - browse the textual web</li>
+ <li><a href="https://sdf.org/">sdl.org</a> and <a href="https://www.teknik.io/">teknik.io</a> - public access services</li>
+</ul> -->
+<h3>Knowledge</h3>
+<ul>
+ <li><a href="https://wikipedia.org/">Wikipedia</a> - the free encyclopedia</li>
+ <li><a href="https://archive.org/">Internet Archive</a> - the digital library</li>
+ <li><a href="https://gen.lib.rus.ec/">Library Genesis</a> - the modern library of alexandria</li>
+ <li><a href="https://annas-archive.org/">Anna's Archive</a> - preserving humanity's written heritage</li>
+ <li><a href="https://sci-hub.st/">Sci-Hub</a> - public access research</li>
+ <li><a href="https://www.gutenberg.org/">Project Gutenburg</a> - free ebooks</li>
+ <li><a href="https://standardebooks.org/">Standard Ebooks</a> - nicely typeset, public domain ebooks</li>
+ <li><a href="https://moby-thesaurus.org/">Moby Thesaurus</a> - the most comprehensive english-language thesaurus</li>
+ <li><a href="https://www.youtube.com/3Blue1Brown">3Blue1Brown</a> - visualized mathematics</li>
+</ul>
+<h3>Tutorials</h3>
+<ul>
+ <li><a href="https://www.khanacademy.org/">Khan Academy</a> - a free and online K-12 curriculum</li>
+ <li><a href="https://www.youtube.com/c/TheOrganicChemistryTutor">The Organic Chemistry Tutor</a> - simply the best basic chemistry resource</li>
+ <li><a href="https://www.youtube.com/playlist?list=PLZHQObOWTQDPD3MizzM2xVFitgF8hE_ab">3Blue1Brown's Essence of Linear Algebra</a> - linear algebra, visualized in the R^n</li>
+ <li><a href="https://www.people.vcu.edu/~rhammack/BookOfProof/">Book of Proof</a> - a standard introduction to mathematical proof</li>
+ <li><a href="https://www.internetingishard.com/">Interneting Is Hard</a> - a friendly html+css tutorial</li>
+ <li><a href="https://javascript.info/">The Modern JavaScript Tutorial</a> - a comprehensive javascript tutorial</li>
+ <li><a href="https://developer.mozilla.org/">Mozilla Developer Network</a> - documentation for the web</li>
+ <li><a href="https://doc.rust-lang.org/stable/book/">The Rust Programming Language</a> - the way to learn rust</li>
+ <li><a href="https://www.lesswrong.com/posts/xg3hXCYQPJkwHyik2/the-best-textbooks-on-every-subject">The Best Textbooks on Every Subject</a></li>
+</ul>
+<!-- <h3>Websites</h3>
+<ul>
+ <li><a href="https://libraryofbabel.info/">The Library of Babel</a> - every book ever or to be written</li>
+ <li><a href="https://http.cat/">HTTP Cats</a> - appropriate status codes</li>
+ <li><a href="https://colors.lol/">colors.lol</a> - overly descriptive color palettes</li>
+ <li><a href="https://picular.co">Picular</a> - The color of anything</li>
+ <li><a href="https://www.dictionaryofobscuresorrows.com/">The Dictionary of Obscure Sorrows</a></li>
+ <li><a href="https://www.thisworddoesnotexist.com/">This Word Does Not Exist</a></li>
+ <li><a href="https://wordhistories.net/">Word Histories</a></li>
+ <li><a href="http://talkobamato.me/">Talk Obama To Me</a></li>
+ <li><a href="https://www.thiswebsitewillselfdestruct.com/">This Website Will Self Destruct</a></li>
+ <li><a href="http://www.superbad.com/">superbad.com</a></li>
+ <li><a href="http://beesbeesbees.com/">beesbeesbees.com</a></li>
+ <li><a href="https://web.archive.org/web/2/https://scamdaddy.net/">scamdaddy.net</a></li>
+</ul> -->
+<h3>Articles</h3>
+<ul>
+ <li><a href="https://drewdevault.com/2018/07/09/Simple-correct-fast.html">Simple, correct, fast: in that order</a></li>
+ <li><a href="http://worrydream.com/ABriefRantOnTheFutureOfInteractionDesign/">A brief rant on the future of interaction design</a></li>
+ <li><a href="https://thorstenball.com/blog/2020/09/08/how-can-you-not-be-romantic-about-programming/">How can you not be romantic about programming?</a></li>
+ <li><a href="https://norvig.com/spell-correct.html">How to write a spelling corrector</a></li>
+ <li><a href="https://www.a1k0n.net/2011/07/20/donut-math.html">Donut math: how donut.c works</a></li>
+ <li><a href="https://nullprogram.com/blog/2020/12/31/">State machines are wonderful tools</a></li>
+ <li><a href="https://indieweb.org/POSSE">Publish on your own site, syndicate elsewhere</a></li>
+ <li><a href="https://dutzi.party/userscripts-are-fun/">Userscripts are fun and are very much still relevant</a></li>
+ <li><a href="https://carter.sande.duodecima.technology/javascript-page-navigation/">Browsers are pretty good at loading pages, it turns out</a></li>
+ <li><a href="https://eev.ee/blog/2020/02/01/old-css-new-css/">Old CSS, new CSS</a></li>
+</ul>
+<!-- <h3>Games</h3>
+<ul>
+ <li><a href="https://adventofcode.com/">Advent of Code</a></li>
+ <li><a href="https://www.newgrounds.com/portal/view/365143">The Impossible Quiz</a></li>
+ <li><a href="https://www.kingdomofloathing.com">Kingdom of Loathing</a></li>
+ <li><a href="https://ninja-muffin24.itch.io/funkin">Friday Night Funkin'</a></li>
+ <li><a href="https://awooo.ru/VVVVVV/">VVVVVV</a></li>
+ <li><a href="https://netgames.io/games/">Netgames</a></li>
+ <li><a href="https://skribbl.io/">Skribbl.io</a></li>
+ <li><a href="https://lichess.org/">lichess</a></li>
+</ul> -->
+<h3>Aesthetic</h3>
+<ul>
+ <li><a href="https://emersion.fr/">Simon Ser</a></li>
+ <li><a href="https://hojberg.xyz/">Simon Højberg</a></li>
+ <li><a href="https://thea.codes/">Thea Flowers</a></li>
+ <li><a href="https://dustri.org/">Julien Voisin</a></li>
+ <li><a href="https://czeng.org/">Catherine Zeng</a></li>
+ <li><a href="https://nora.codes/">Leonora Tindall</a></li>
+ <li><a href="https://victoria.dev/">Victoria Drake</a></li>
+ <li><a href="https://tilde.team/~kiedtl/">Kiëd Llaentenn</a></li>
+ <li><a href="https://christine.website/">Christine Dodrill</a></li>
+ <li><a href="https://derekmeer.com/">Derek Meer</a></li>
+ <li><a href="https://julian.digital/">Julian Lehr</a></li>
+ <li><a href="https://abhinavsarkar.net/">Abhinav Sarkar</a></li>
+ <li><a href="https://lea.verou.me/about/">Lea Verou</a></li>
+ <li><a href="https://www.joshwcomeau.com/">Josh Comeau</a></li>
+ <li><a href="https://acko.net/">Steven Wittens</a></li>
+ <li><a href="https://www.gwern.net/index">Gwern Branwen</a></li>
+ <li><a href="https://thedigitaldiarist.ca/">Alicia Neptune</a></li>
+ <li><a href="https://memex.marginalia.nu/">marginalia</a></li>
+ <li><a href="https://tilde.club/~alun/">alun</a></li>
+</ul>
+<h3>More Links</h3>
+<ul>
+ <li><a href="https://href.cool/about/">href.cool</a></li>
+ <li><a href="https://webring.xxiivv.com/">xxiivv</a></li>
+</ul>
diff --git a/monogram.html b/monogram.html
index 5bfda39..8c6de79 100644
--- a/monogram.html
+++ b/monogram.html
@@ -1,21 +1,31 @@
---
-layout: default
+layout: main
title: monogram
---
- <main style="font-family: 'Fira Code', monospace; width: 100%; min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;">
- <img src="assets/compass.jpg" style="width: 250px; height: auto; margin-bottom: 2.5em;"/>
- <nav style="margin-bottom: 10em;">
- <a href="/" style="color: black;">home</a>
- ·
- <a href="/about" style="color: black;">about</a>
- ·
- <a href="/resume" style="color: black;">resume</a>
- ·
- <a href="/posts" style="color: black;">posts</a>
- ·
- <a href="/bookshelf" style="color: black;">bookshelf</a>
- </nav>
- </main>
+<style>
+main {
+ font-family: 'Fira Code', monospace;
+ width: 100%;
+ min-height: 100vh;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ text-align: center;
+}
+</style>
+<img src="/assets/compass.jpg" style="width: 250px; height: auto; margin-bottom: 2.5em;"/>
+<nav style="margin-bottom: 10em;">
+ <a href="/" style="color: black;">home</a>
+ ·
+ <a href="/about" style="color: black;">about</a>
+ ·
+ <a href="/resume" style="color: black;">resume</a>
+ ·
+ <a href="/posts" style="color: black;">posts</a>
+ ·
+ <a href="/bookshelf" style="color: black;">bookshelf</a>
+</nav>
<!--
inspiration:
https://isaacfreund.com/