wip figures and images

This commit is contained in:
sundae 2025-06-16 16:31:53 +03:00
parent ea235120f8
commit c6bac45ecf
No known key found for this signature in database
61 changed files with 1491 additions and 1315 deletions

View file

@ -1,52 +1,17 @@
{
"items": [
{
"alt": "Betty bee's website",
"button": "/assets/img/button/mn8831.png",
"name": "the mice nest",
"src": "https://micenest.xyz/"
"alt": "Beeps' website",
"button": "/assets/img/button/beeps.gif",
"name": "beeps",
"src": "https://beeps.website/"
},
{
"alt": "Lati's website",
"button": "/assets/img/button/creature0354.gif",
"name": "lati!!!",
"src": "https://creature0354.neocities.org/"
},
{
"alt": "Kiophen's website",
"button": "/assets/img/button/kiophen.gif",
"name": "kiophen",
"src": "https://mileshouse.neocities.org/"
},
{
"alt": "Tequt's website",
"button": "/assets/img/button/tequt.gif",
"name": "tequt",
"src": "https://tequt.click/"
},
{
"alt": "Marty's website",
"button": "/assets/img/button/marty.jpg",
"name": "marty's house",
"src": "https://martyshouse.neocities.org/"
},
{
"alt": "Drakonic's website",
"button": "/assets/img/button/drakonic.gif",
"name": "DRAKONIC.ZONE",
"src": "https://drakonic.zone/"
},
{
"alt": "Swifty's website",
"button": "/assets/img/button/swiftyshq.gif",
"name": "Swifty's HQ!",
"src": "https://swiftyshq.neocities.org/"
},
{
"alt": "Em Essex's website",
"button": "/assets/img/button/msx.gif",
"name": "MSX.HORSE",
"src": "https://heckscaper.com/"
"alt": "BraixDragon's linktree",
"button": "/assets/img/button/braixdragon-cat1.gif",
"id": "meow",
"name": ":3",
"src": "https://linktr.ee/BraixDragon"
},
{
"alt": "cabl's website",
@ -54,18 +19,54 @@
"name": "cabl",
"src": "https://cabl.rodeo/"
},
{
"alt": "Drakonic's website",
"button": "/assets/img/button/drakonic.gif",
"name": "DRAKONIC.ZONE",
"src": "https://drakonic.zone/"
},
{
"alt": "Em Essex's website",
"button": "/assets/img/button/msx.gif",
"name": "MSX.HORSE",
"src": "https://heckscaper.com/"
},
{
"alt": "Kiophen's website",
"button": "/assets/img/button/kiophen.gif",
"name": "kiophen",
"src": "https://mileshouse.neocities.org/"
},
{
"alt": "Lati's website",
"button": "/assets/img/button/creature0354.gif",
"name": "lati!!!",
"src": "https://creature0354.neocities.org/"
},
{
"alt": "Marty's website",
"button": "/assets/img/button/marty.jpg",
"name": "marty's house",
"src": "https://martyshouse.neocities.org/"
},
{
"alt": "Betty bee's website",
"button": "/assets/img/button/mn8831.png",
"name": "the mice nest",
"src": "https://micenest.xyz/"
},
{
"alt": "Pebble's website",
"button": "/assets/img/button/pebble.gif",
"name": "pebble",
"src": "https://pebble.pet/"
},
{
"alt": "pinkderg's website",
"button": "/assets/img/button/pinkderg.gif",
"name": "pinkderg.art",
"src": "https://pinkderg.art/"
},
{
"alt": "suspiciouslyBee's website",
"button": "/assets/img/button/suspiciouslybee.png",
"name": "bee on the internet",
"src": "https://bee.movie/"
},
{
"alt": "Rowan's website",
"button": "/assets/img/button/rowan.gif",
@ -78,44 +79,29 @@
"name": "Snewberry",
"src": "https://snewberry.neocities.org/"
},
{
"alt": "suspiciouslyBee's website",
"button": "/assets/img/button/suspiciouslybee.png",
"name": "bee on the internet",
"src": "https://bee.movie/"
},
{
"alt": "Swifty's website",
"button": "/assets/img/button/swiftyshq.gif",
"name": "Swifty's HQ!",
"src": "https://swiftyshq.neocities.org/"
},
{
"alt": "Tequt's website",
"button": "/assets/img/button/tequt.gif",
"name": "tequt",
"src": "https://tequt.click/"
},
{
"alt": "Virtually Isolated's website",
"button": "/assets/img/button/virtuallyisolated.png",
"name": "virtually isolated",
"src": "https://virtually-isolated.neocities.org/"
},
{
"alt": "Beeps' website",
"button": "/assets/img/button/beeps.gif",
"name": "beeps",
"src": "https://beeps.website/"
},
{
"alt": "Pebble's website",
"button": "/assets/img/button/pebble.gif",
"name": "pebble",
"src": "https://pebble.pet/"
},
{
"alt": "a sped-up gif of a fox sniffing the viewer",
"button": "/assets/img/button/fox-nose.gif",
"id": "fox",
"name": "fox",
"src": "https://soundcloud.com/yeenimal/calling-you-nightcorefuchscore-edit"
},
{
"alt": "BraixDragon's linktree",
"button": "/assets/img/button/braixdragon-cat1.gif",
"id": "meow",
"name": ":3",
"src": "https://linktr.ee/BraixDragon"
},
{
"alt": "Crouton",
"button": "/assets/img/button/crouton.png",
"name": "Crouton",
"src": "https://crouton.net"
}
]
}

View file

@ -1,112 +0,0 @@
{
"items": [
{
"alt": "Github repo for Visual Studio Codium",
"button": "/assets/img/button/vscodium.gif",
"name": "Made with VSCodium",
"src": "https://github.com/VSCodium/vscodium"
},
{
"alt": "Eleventy home page",
"button": "/assets/img/button/made_with_11ty.gif",
"name": "Made with 11ty",
"src": "https://11ty.dev"
},
{
"alt": "Mozilla Developer Network home page",
"button": "/assets/img/button/firefox.gif",
"name": "tested on Firefox",
"src": "https://developer.mozilla.org/"
},
{
"alt": "Librewolf home page",
"button": "/assets/img/button/get-librewolf.gif",
"name": "Delete Chrome! GET LIBREWOLF",
"src": "https://librewolf.net/"
},
{
"alt": "Arch Linux wiki home page",
"button": "/assets/img/button/arch-linux.png",
"name": "Arch Linux",
"src": "https://wiki.archlinux.org/title/Main_page"
},
{
"alt": "KDE home page",
"button": "/assets/img/button/kde.gif",
"name": "Konqi!",
"src": "https://kde.org"
},
{
"alt": "Xenia tribute page",
"button": "/assets/img/button/xenia.gif",
"name": "Linux now!",
"src": "https://xenia-linux-site.glitch.me/"
},
{
"alt": "Pngquant home page",
"button": "/assets/img/button/pngquant.gif",
"name": "pngquant",
"src": "https://pngquant.org/"
},
{
"alt": "World Wide Web Consortium HTML Validator page",
"button": "/assets/img/button/w3_validator.gif",
"name": "W3 Validator",
"src": "https://validator.w3.org/"
},
{
"alt": "Videolan home page",
"button": "/assets/img/button/vlc.png",
"name": "VLC media player",
"src": "https://www.videolan.org/vlc/"
},
{
"alt": "YouTube video featuring Bob from Animal Crossing",
"button": "/assets/img/button/bob.gif",
"name": "Bob.",
"src": "https://youtube.com/watch?v=yD2FSwTy2lw"
},
{
"alt": "freemediaheckyeah home page",
"button": "/assets/img/button/piracy-now.gif",
"name": "Piracy now!",
"src": "https://fmhy.net/"
},
{
"alt": "Usemumble on Neocities",
"button": "/assets/img/button/discord-no-way.gif",
"name": "Discord? No way!",
"src": "https://usemumble.neocities.org/"
},
{
"alt": "Matrix home page",
"button": "/assets/img/button/matrix.png",
"name": "matrix",
"src": "https://matrix.org/"
},
{
"alt": "Boodlebox on Neocities",
"button": "/assets/img/button/thiswebsitesucks.gif",
"name": "This Website SUCKS",
"src": "https://boodlebox.neocities.org/award2"
},
{
"alt": "Flashpoint archive home page",
"button": "/assets/img/button/flashpoint.gif",
"name": "GET FLASHPOINT; WEB GAME ARCHIVE",
"src": "https://flashpointarchive.org/"
},
{
"alt": "Lospec random palette page",
"button": "/assets/img/button/lospec.png",
"name": "Random Lospec palette",
"src": "https://lospec.com/palette-list/random"
},
{
"alt": "The mod archive home page",
"button": "/assets/img/button/modarchive.gif",
"name": "MOD ARCHIVE",
"src": "https://modarchive.org/"
}
]
}

126
_src/_data/88x31.json Normal file
View file

@ -0,0 +1,126 @@
{
"items": [
{
"alt": "Arch Linux wiki home page",
"button": "/assets/img/button/arch-linux.png",
"name": "Arch Linux",
"src": "https://wiki.archlinux.org/title/Main_page"
},
{
"alt": "Crouton",
"button": "/assets/img/button/crouton.png",
"name": "Crouton",
"src": "https://crouton.net"
},
{
"alt": "Librewolf home page",
"button": "/assets/img/button/get-librewolf.gif",
"name": "Delete Chrome! GET LIBREWOLF",
"src": "https://librewolf.net/"
},
{
"alt": "Usemumble on Neocities",
"button": "/assets/img/button/discord-no-way.gif",
"name": "Discord? No way!",
"src": "https://usemumble.neocities.org/"
},
{
"alt": "Mozilla Developer Network home page",
"button": "/assets/img/button/firefox.gif",
"name": "tested on Firefox",
"src": "https://developer.mozilla.org/"
},
{
"alt": "a sped-up gif of a fox sniffing the viewer",
"button": "/assets/img/button/fox-nose.gif",
"id": "fox",
"name": "fox",
"src": "https://soundcloud.com/yeenimal/calling-you-nightcorefuchscore-edit"
},
{
"alt": "freemediaheckyeah home page",
"button": "/assets/img/button/piracy-now.gif",
"name": "Piracy now!",
"src": "https://fmhy.net/"
},
{
"alt": "Flashpoint archive home page",
"button": "/assets/img/button/flashpoint.gif",
"name": "GET FLASHPOINT; WEB GAME ARCHIVE",
"src": "https://flashpointarchive.org/"
},
{
"alt": "Konqi on KDE.org wiki",
"button": "/assets/img/button/kde.gif",
"name": "Konqi!",
"src": "https://community.kde.org/Konqi"
},
{
"alt": "Lospec random palette page",
"button": "/assets/img/button/lospec.png",
"name": "Random Lospec palette",
"src": "https://lospec.com/palette-list/random"
},
{
"alt": "Eleventy home page",
"button": "/assets/img/button/made_with_11ty.gif",
"name": "Made with 11ty",
"src": "https://11ty.dev"
},
{
"alt": "Visual Studio Codium Github repository",
"button": "/assets/img/button/vscodium.gif",
"name": "Made with VSCodium",
"src": "https://github.com/VSCodium/vscodium"
},
{
"alt": "Matrix home page",
"button": "/assets/img/button/matrix.png",
"name": "matrix",
"src": "https://matrix.org/"
},
{
"alt": "The mod archive home page",
"button": "/assets/img/button/modarchive.gif",
"name": "MOD ARCHIVE",
"src": "https://modarchive.org/"
},
{
"alt": "YouTube video featuring Bob from Animal Crossing",
"button": "/assets/img/button/no-ones-around-to-help.gif",
"id": "bob",
"name": "No one's around to help.",
"src": "https://youtube.com/watch?v=yD2FSwTy2lw"
},
{
"alt": "Pngquant home page",
"button": "/assets/img/button/pngquant.gif",
"name": "pngquant",
"src": "https://pngquant.org/"
},
{
"alt": "Boodlebox on Neocities",
"button": "/assets/img/button/thiswebsitesucks.gif",
"name": "This Website SUCKS",
"src": "https://boodlebox.neocities.org/award2"
},
{
"alt": "Videolan home page",
"button": "/assets/img/button/vlc.png",
"name": "VLC media player",
"src": "https://www.videolan.org/vlc/"
},
{
"alt": "World Wide Web Consortium HTML Validator page",
"button": "/assets/img/button/w3_validator.gif",
"name": "W3 Validator",
"src": "https://validator.w3.org/"
},
{
"alt": "Xenia (linux mascot) tribute page",
"button": "/assets/img/button/xenia.gif",
"name": "Linux now!",
"src": "https://xenia.efi.pages.gay/"
}
]
}

View file

@ -12,9 +12,8 @@
},
{
"cover": "/assets/img/media/games/cs.png",
"title": "Cave Story+",
"src": "https://cavestory.org/game-info/game-releases.php",
"text": "i like it a lot"
"title": "Cave Story",
"src": "https://cavestory.org/game-info/game-releases.php"
},
{
"cover": "/assets/img/media/games/gta_sa.png",
@ -26,6 +25,16 @@
"title": "Grand Theft Auto: Vice City",
"src": "https://youtube.com/watch?v=XXHhh4JIby0"
},
{
"cover": "/assets/img/media/games/hl1.png",
"title": "Half-Life",
"src": "https://bullsquid.com/"
},
{
"cover": "/assets/img/media/games/hl2.png",
"title": "Half-Life 2",
"src": "https://www.youtube.com/watch?v=nq5EnEa7Mg8"
},
{
"cover": "/assets/img/media/games/halo_mcc.png",
"title": "Halo: The Master Chief Collection",
@ -51,6 +60,11 @@
"title": "LittleBigPlanet",
"src": "https://youtube.com/watch?v=LattfGKNr-E"
},
{
"cover": "/assets/img/media/games/minecraft.png",
"title": "Minecraft",
"src": "https://prismlauncher.org/"
},
{
"cover": "/assets/img/media/games/me.png",
"title": "Mirror's Edge",
@ -86,6 +100,11 @@
"title": "Re-Volt",
"src": "https://rvgl.org/"
},
{
"cover": "/assets/img/media/games/roblox.png",
"title": "Roblox",
"src": "https://www.youtube.com/watch?v=L5RPv1PWbvA"
},
{
"cover": "/assets/img/media/games/smt_iv.png",
"title": "Shin Megami Tensei IV",

View file

@ -16,7 +16,7 @@ paw: "m 15.700739,16.184194 c 0,4.483 -2.555,2.038 -5.7060001,2.038 -3.151,0 -5.
<meta charset="utf-8">
<link rel="stylesheet" href="/assets/css/reset.css">
<link rel="stylesheet" href="/assets/css/default.css">
<link rel="stylesheet" href="/assets/css/me.css"> {% set availableStyles = ['home', 'blog', 'gallery'] %}
{% set availableStyles = ['home', 'blog', 'gallery'] %}
{% if page.url %}
{% if availableStyles.indexOf(page.url|firstSegment) !== -1 %}
<link rel="stylesheet" href="/assets/css/{{ page.url|firstSegment }}.css">

View file

@ -4,9 +4,6 @@ icon: "M 6 3 L 19 3 L 26 10 L 26 30 L 6 30 Z M 17 12 L 24 12 L 17 5 Z"
---
<article>
<h2>{{page.fileSlug}}
<time datetime="{{date|ISO}}">{{date|readable}}</time>
</h2>
{{content|safe}}
<div aria-label="Postscript">
{{blurb|safe}} <img src="{{avatar}}">

View file

@ -2,17 +2,18 @@
layout: base
icon: "M 30 26 L 27 26 L 21 14 L 16 23 L 11 17 L 5 26 L 2 26 L 2 2 Q 2 2 10 6 A 1 1 0 0 0 10 13 A 1 1 0 0 0 10 6 L 2 2 L 30 2 L 30 26 L 30 30 L 2 30 L 2 26"
---
<article>
<article id="art">
<h3>{{ page.fileSlug }}</h3>
<section>
{% for image in images %}
<a href="{{ image.src }}" {% if image.width %} style="max-width:{{ image.width }}" {% endif %}>
<figure>
<a href="{{ image.src }}">
<img src="{{ image.src }}" alt="{{ image.alt }}" {%if image.width %}width="{{image.width}}px" style="image-rendering: pixelated"{% endif %}>
</a>
<time datetime="{{ image.date|ISO }}">{{ image.date|readable }}</time><figcaption>{{ image.alt }}</figcaption>
<img src="{{ image.src }}" alt="{{ image.alt }}" {% if image.width %}style="image-rendering: pixelated"{% endif %}>
<figcaption><time datetime="{{ image.date|ISO }}">{{ image.date|readable }}</time>{{ image.alt }}</figcaption>
</figure>
</a>
{% endfor %}
</section>
{{ content|safe }}
</article>
</article>

Binary file not shown.

BIN
_src/assets/audio/bob.ogg Normal file

Binary file not shown.

Binary file not shown.

View file

@ -2,97 +2,28 @@
--avatar: 3rem;
}
@media (prefers-color-scheme: light) {
article {
& p[aria-label="Post warning"] {
border-color: currentColor;
background-color: var(--primary-dark-200);
color: var(--primary);
}
& [aria-label="Addendum"] {
box-shadow: inset 0 0 0 2px var(--primary);
border-image-source: linear-gradient(
45deg,
var(--primary),
var(--primary-600),
var(--primary)
);
background-color: var(--primary-400);
}
}
#posts {
& a {
border-color: var(--primary-600);
background-color: var(--primary-300);
color: var(--primary-dark-400);
&:is(:hover, :focus) {
background-color: var(--primary-500);
}
}
& p:not(:last-child) {
color: var(--primary-dark-700);
}
}
}
@media (prefers-color-scheme: dark) {
article {
& p[aria-label="Post warning"] {
border-color: currentColor;
background-color: var(--secondary-100);
color: var(--secondary);
}
& [aria-label="Addendum"] {
box-shadow: inset 0 0 0 2px var(--secondary);
border-image-source: linear-gradient(
45deg,
var(--secondary),
var(--secondary-600),
var(--secondary)
);
background-color: var(--secondary-400);
}
}
#posts {
& a {
border-color: var(--secondary-600);
background-color: var(--secondary-300);
color: var(--secondary-light-400);
&:is(:hover, :focus) {
background-color: var(--secondary-500);
}
}
& p:not(:last-child) {
color: var(--secondary-light-700);
}
}
}
article {
margin: 0 auto;
background-image: var(--paw);
background-position-x: center;
background-position-y: bottom;
background-size: 64px;
background-repeat: no-repeat;
background-origin: content-box;
font-family: "Rubik", sans-serif;
& time {
font-size: initial;
max-width: var(--post);
& section:not(section:has(p)) {
display: flex;
gap: var(--pad-l);
& figure {
height: max-content;
padding: 0;
}
}
& aside {
float: right;
border-radius: var(--round);
width: 66%;
}
& p[aria-label="Post warning"] {
border-style: solid;
border-width: 2px;
border-radius: 0.4rem;
padding: 0.4rem 0;
border-radius: var(--pad-sm);
padding: var(--pad-sm) 0;
font-size: 1.4rem;
font-weight: bold;
text-align: center;
@ -105,12 +36,11 @@ article {
& aside,
[aria-label="Addendum"] {
margin: 1rem 0;
margin: var(--pad-l) 0;
border-image-slice: 1;
border-image-width: 2px;
border-image-outset: 4px;
padding: 1rem;
background-image: var(--noise);
padding: var(--pad-l);
}
}
@ -126,7 +56,17 @@ article > [aria-label="Addendum"] {
article > [aria-label="Postscript"] {
margin: 0 0 auto auto;
padding: 2rem 0 4rem 0;
&::after {
content: "";
position: absolute;
width: 64px;
height: 64px;
mask-image: var(--paw);
mask-position-x: center;
mask-size: 100%;
mask-repeat: no-repeat;
transform: rotate(15deg);
}
& p {
display: flex;
flex-direction: column;
@ -137,7 +77,7 @@ article > [aria-label="Postscript"] {
border-radius: var(--round);
border-bottom-right-radius: 0;
width: fit-content;
padding: 0.8rem;
padding: var(--pad-m);
background-color: #0060df;
color: #fff;
font-family: "Rubik", sans-serif;
@ -149,7 +89,7 @@ article > [aria-label="Postscript"] {
}
&:not(:last-of-type) {
margin-bottom: 1rem;
margin-bottom: var(--pad-l);
}
}
@ -157,14 +97,14 @@ article > [aria-label="Postscript"] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(100%, 40%), 1fr));
align-items: center;
gap: 0.8rem;
gap: var(--pad-m);
}
& p > img {
transition: height var(--trans), border-radius var(--trans),
background-color var(--trans);
border-radius: var(--round);
min-height: fit-content;
max-height: 300px;
max-height: var(--image);
}
& img:not(p > img) {
display: flex;
@ -182,7 +122,7 @@ article > [aria-label="Postscript"] {
& ul {
display: flex;
flex-direction: column;
gap: 1rem;
gap: var(--pad-l);
margin: 0;
padding: 0;
list-style-type: none;
@ -200,7 +140,7 @@ article > [aria-label="Postscript"] {
border-style: solid;
border-width: 2px;
border-radius: var(--round);
padding: 0.8rem;
padding: var(--pad-m);
font-size: 1.125rem;
font-weight: bold;
text-decoration: none;
@ -219,6 +159,13 @@ article > [aria-label="Postscript"] {
}
}
@media screen and (max-width: 920px) {
article aside {
float: none !important;
width: fit-content !important;
}
article section {
flex-direction: column;
}
#posts {
max-width: unset;
width: auto;
@ -227,8 +174,9 @@ article > [aria-label="Postscript"] {
& p {
margin-right: unset;
& > img {
height: auto ;
height: auto;
max-height: var(--view);
}
}
}
}

View file

@ -1,37 +1,119 @@
@import url("/assets/css/variables.css");
@import url("/assets/css/nav.css");
@import url("/assets/css/theme-light.css");
@import url("/assets/css/theme-dark.css");
:root {
--view: 18rem;
}
body {
font-family: sans-serif;
font-family: "Rubik", sans-serif;
font-size: 100%;
margin: 0;
padding: 0;
}
main {
padding: 2rem 2rem 4rem calc(var(--view) + 2rem);
padding: var(--pad-xl) var(--pad-xl) 4rem calc(var(--view) + var(--pad-xl));
overflow: hidden;
}
article {
border-style: solid;
border-width: 2px;
border-radius: var(--round);
height: max-content;
padding: 2rem;
padding: var(--pad-xl);
& a {
font-weight: 500;
}
& s {
text-decoration-style: line-through;
text-decoration-thickness: 0.1em;
}
& ul {
& li {
margin: 0;
& p {
margin: 1rem 0;
&:last-child {
margin-bottom: 0;
margin: 0;
}
}
}
}
/* Header */
header {
margin: 0 var(--view);
& u {
text-decoration-style: double;
text-decoration-thickness: 2px;
}
& em {
font-weight: 200;
}
& p {
word-wrap: break-word;
padding: var(--pad-sm)
}
& code:not(pre *) {
padding: 0 var(--pad-sm);
}
& pre {
display: flex;
width: auto;
overflow: scroll;
padding: var(--pad-m);
white-space: pre-wrap;
word-break: break-word;
}
& pre,
code:not(pre *) {
transition: background-color var(--trans), border-color var(--trans);
border-style: solid;
border-width: 2px;
border-radius: var(--round);
font-weight: bold;
}
& h3 {
font-size: 1.6rem;
margin: 0;
& a {
display: inline-block;
transition: color var(--trans), background-color var(--trans);
border-radius: inherit;
height: max-content;
padding: 0 0.4rem;
}
}
& figure {
margin: 0;
border-style: solid;
border-width: 2px;
padding: var(--pad-m);
border-radius: var(--round);
display: flex;
flex-direction: column;
}
& section {
& a {
text-decoration: none;
}
& figure img {
border-radius: var(--round);
}
& figcaption {
font-weight: normal;
font-style: italic;
padding: var(--pad-l);
}
}
}
/* Navigation */
@ -52,7 +134,10 @@ body > nav ul {
}
nav > details {
font-size: 1.5rem;
font-size: 1.4rem;
}
nav > details > summary::marker {
content: none;
}
body > nav ul li {
@ -64,8 +149,8 @@ body > nav a {
display: flex;
font-size: 1.125rem;
font-weight: bold;
height: 2rem;
line-height: 2rem;
height: var(--pad-xl);
line-height: var(--pad-xl);
}
details {
@ -106,24 +191,77 @@ body > nav > ul > svg {
text-anchor: start;
}
/* Images */
img[src*="/assets/img/pkmn/"] {
height: fit-content;
image-rendering: pixelated;
}
img[src*="/assets/img/flag/"] {
height: 32px;
}
ul:has(img, svg):not(article ul) {
list-style-type: none;
}
:is(main article, main section):not(:last-child) {
margin-bottom: var(--pad-xl);
}
img[src*="/assets/img/flag/"] {
height: 32px;
border-radius: 0.2rem;
border-style: solid;
border-width: 2px;
border-color: #fff;
}
/* Mobile view */
@media screen and (max-width: 920px) {
body > nav {
position: initial;
width: 100%;
}
article {
max-width: 75ch;
main {
padding: var(--pad-l);
}
main > section {
flex-direction: column;
}
main > section {
width: initial;
}
article {
max-width: initial;
width: auto;
}
body > nav::before {
content: none;
}
body > nav {
flex-direction: row;
top: 0;
border-right: 0;
width: 100%;
& details {
height: fit-content;
}
& details {
width: 100%;
}
}
body::after {
content: "";
}
}
iframe {
border: 0;
@media screen and (max-width: 400px) {
article {
padding: var(--pad-l) !important;
}
body > nav {
flex-direction: column;
justify-content: start;
& details[open] {
width: 100%;
}
}
}

View file

@ -1,71 +1,21 @@
@media (prefers-color-scheme: light) {
#artworks {
& a {
transition: color var(--trans), background-color var(--trans),
border-color var(--trans);
& figure {
color: var(--primary-dark-400);
border-color: var(--primary-600);
background-color: var(--primary-300);
& time {
color: var(--primary-dark-500);
}
& figcaption {
color: var(--primary-dark-500);
}
&:is(:hover, :focus) {
border-color: currentColor;
background-color: var(--primary-500);
}
}
}
}
:root {
--thumb: 16rem;
}
@media (prefers-color-scheme: dark) {
#artworks {
& a {
transition: color var(--trans), background-color var(--trans),
border-color var(--trans);
& figure {
color: var(--secondary-light-400);
border-color: var(--secondary-600);
background-color: var(--secondary-300);
& time {
color: var(--secondary-light-500);
}
& figcaption {
color: var(--secondary-light-500);
}
&:is(:hover, :focus) {
border-color: currentColor;
background-color: var(--secondary-500);
}
}
}
}
}
#artworks {
& ul {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(min(210px, 100%), 1fr));
grid-template-columns: repeat(
auto-fill,
minmax(min(var(--thumb), 100%), 1fr)
);
padding: 0;
margin: 0;
gap: 1rem;
gap: var(--pad-l);
}
& h2 {
margin: 2rem 0;
font-size: 2rem;
margin: var(--pad-xl) 0;
font-size: var(--pad-xl);
&:first-of-type {
margin-top: 0;
@ -77,15 +27,14 @@
text-decoration: unset;
& figure {
margin: 0;
padding: 0.4rem;
padding: var(--pad-sm);
border-width: 2px;
border-style: solid;
border-radius: var(--round);
& img {
display: flex;
height: 12rem;
width: 100%;
height: var(--thumb);
border-bottom: unset;
object-fit: contain;
border-radius: inherit;
@ -93,34 +42,49 @@
& figcaption {
font-family: Urbanist, sans-serif;
font-size: 1.2rem;
font-size: var(--pad-lm);
}
}
}
}
#gallery article {
& h3 {
margin-bottom: 1rem;
#art {
display: flex;
flex-direction: column;
h3 {
font-family: "Urbanist", sans-serif;
}
& section:has(a:nth-child(n + 2)) {
display: flex;
flex-direction: row;
gap: var(--pad-l);
}
& section {
margin: var(--pad-l) 0;
& a {
display: flex;
height: max-content;
text-decoration: none;
flex-direction: column;
}
}
& figure {
& time {
display: flex;
font-weight: bold;
}
& a {
max-width: var(--post);
width: fit-content;
align-self: center;
& img {
min-height: fit-content;
max-height: 18rem;
object-fit: contain;
border-radius: inherit;
border-style: inherit;
border-width: inherit;
border-color: inherit;
}
& figure {
max-width: inherit;
}
}
}
@media screen and (max-width: 920px) {
#art section {
align-self: center;
}
#art section:has(a:nth-child(n + 2)) {
flex-direction: column;
}
}

View file

@ -15,37 +15,6 @@
color: transparent;
}
}
@media (prefers-color-scheme: light) {
#badges a:is(:hover, :focus) img {
filter: drop-shadow(4px 6px 0 var(--primary-500));
}
#collection {
& a:is(:hover, :focus) {
box-shadow: 0 0 0 1px currentColor;
background-color: var(--primary-500);
}
& img {
box-shadow: 0 0 0 1px
color-mix(in lch, transparent, var(--primary-dark-500) 30%);
}
}
}
@media (prefers-color-scheme: dark) {
#badges a:is(:hover, :focus) img {
filter: drop-shadow(4px 6px 0 var(--secondary-500));
}
#collection {
& a:is(:hover, :focus) {
box-shadow: 0 0 0 1px currentColor;
background-color: var(--secondary-500);
}
& img {
box-shadow: 0 0 0 1px
color-mix(in lch, transparent, var(--secondary-500) 70%);
}
}
}
#pkmn {
display: flex;
flex-wrap: wrap;
@ -58,13 +27,15 @@
border-top-color: #c8f8c0;
border-width: 3px;
border-style: solid;
& img:hover {
& img {
image-rendering: pixelated;
&:hover {
filter: drop-shadow(0 -2px 0 #fff) drop-shadow(0 2px 0 #fff)
drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff)
drop-shadow(0 2px 3px #0006);
animation: jump 200ms infinite alternate;
}
}
}
body [id]:not(:nth-child(1)) ul {
display: flex;
@ -94,7 +65,8 @@ body [id]:not(:nth-child(1)) ul {
background-image: linear-gradient(#f09 33.33%, #ffd700 0 66.66%, #00bfff 0);
}
#intro {
& p, ul {
& p,
ul {
font-family: "Urbanist", sans-serif;
font-size: 1.3rem;
}
@ -105,14 +77,13 @@ body [id]:not(:nth-child(1)) ul {
background-clip: text;
background-repeat: repeat;
&:hover {
background-clip: initial;
transition: var(--trans);
animation: fadeIn var(--trans) linear forwards;
filter: drop-shadow(2px 2px 1px #0006);
}
}
}
#collection {
display: inherit;
gap: 1rem;
& ul {
margin: 0;
padding: 0;

View file

@ -1,445 +0,0 @@
@media (prefers-color-scheme: light) {
article {
border-color: var(--primary-300);
background-color: var(--primary-200);
color: var(--primary-dark-300);
& aside {
box-shadow: inset 0 0 0 2px var(--primary-500);
background-color: var(--primary-300);
}
& figure {
color: var(--primary-dark-400);
border-color: var(--primary-600);
background-color: var(--primary-300);
}
& s,
u {
text-decoration-color: color-mix(in lch, red, var(--primary-500) 20%);
}
& h3 a {
color: var(--primary-dark-300);
&:hover {
background-color: var(--primary-dark-300);
color: var(--primary);
}
}
& code:not(pre *) {
background-color: var(--primary-400);
}
& pre {
transition: background-color var(--trans), border-color var(--trans);
background-color: var(--primary-100);
&:hover {
border-color: var(--primary);
background-color: var(--primary-400);
}
}
& pre,
code {
border-color: var(--primary-400);
}
}
body {
background-color: var(--primary-100);
color: var(--primary-dark-300);
& > nav {
border-right: 1px solid var(--primary);
&::before {
background-color: var(--primary);
}
&::after {
background-color: var(--primary);
}
& a {
background-color: var(--primary);
}
}
&::after {
background-color: var(--primary);
}
& details {
box-shadow: inset 0 0 0 2px var(--primary);
background-color: white;
color: var(--primary);
}
& details[open] {
box-shadow: inset 0 0 0 2px var(--primary);
background-color: var(--primary-300);
color: var(--primary-dark-400);
& summary {
border-color: var(--primary);
background-color: var(--primary-600);
}
& a {
color: var(--primary-100);
&[aria-current] {
box-shadow: 0 0 0 2px var(--primary-600);
background-color: var(--primary-100);
color: var(--primary-dark-500);
}
}
}
}
}
@media (prefers-color-scheme: dark) {
article {
border-color: var(--secondary-300);
background-color: var(--secondary-200);
color: var(--secondary-light-300);
& aside {
box-shadow: inset 0 0 0 2px var(--secondary-500);
background-color: var(--secondary-300);
}
& figure {
color: var(--secondary-light-400);
border-color: var(--secondary-600);
background-color: var(--secondary-300);
}
& s,
u {
text-decoration-color: color-mix(in lch, red, var(--secondary-500) 20%);
}
& h3 a {
color: var(--secondary-light-300);
&:hover {
background-color: var(--secondary-light-300);
color: var(--secondary);
}
}
& code:not(pre *) {
background-color: var(--secondary-400);
}
& pre {
transition: background-color var(--trans), border-color var(--trans);
background-color: var(--secondary-100);
&:hover {
border-color: var(--secondary);
background-color: var(--secondary-400);
}
}
& pre,
code {
border-color: var(--secondary-400);
}
}
body {
background-color: var(--secondary-100);
color: var(--secondary-light-200);
& > nav {
border-right: 1px solid var(--secondary);
&::before {
background-color: var(--secondary);
}
&::after {
background-color: var(--secondary);
}
& a {
background-color: var(--secondary);
}
}
&::after {
background-color: var(--secondary);
}
& details {
box-shadow: inset 0 0 0 2px var(--secondary);
background-color: var(--secondary-100);
color: var(--secondary);
}
& details[open] {
box-shadow: inset 0 0 0 2px var(--secondary);
background-color: var(--secondary-300);
color: var(--secondary-light-200);
& summary {
border-color: var(--secondary);
background-color: var(--secondary-600);
}
& a {
color: var(--secondary-200);
&[aria-current] {
box-shadow: 0 0 0 2px var(--secondary);
background-color: var(--secondary-200);
color: var(--secondary-light-500);
}
}
}
}
}
body {
font-family: "Rubik", sans-serif;
& article {
border-style: solid;
border-width: 2px;
border-radius: var(--round);
& hr {
margin: 2rem 0;
}
& a {
font-weight: 500;
}
& s {
text-decoration-style: line-through;
text-decoration-thickness: 0.1em;
}
& ul {
& li {
margin: 0;
& p {
margin: 0;
}
}
}
& u {
text-decoration-style: double;
text-decoration-thickness: 2px;
}
& em {
font-weight: 200;
}
& p {
word-wrap: break-word;
}
& code:not(pre *) {
padding: 0 0.2rem;
}
& pre {
display: flex;
width: auto;
overflow: scroll;
padding: 0.5rem;
white-space: pre-wrap;
word-break: break-word;
}
& pre,
code:not(pre *) {
transition: background-color var(--trans), border-color var(--trans);
border-style: solid;
border-width: 2px;
border-radius: var(--round);
font-weight: bold;
}
& h3 {
font-size: 1.6rem;
margin: 0;
& a {
display: inline-block;
transition: color var(--trans), background-color var(--trans);
border-radius: inherit;
height: max-content;
padding: 0 0.4rem;
}
}
& aside {
float: right;
border-radius: var(--round);
width: 66%;
}
& figure {
transition: var(--trans);
margin: 0;
border-style: solid;
border-width: 2px;
padding: 0.8rem;
border-radius: var(--round);
display: flex;
flex-direction: column;
}
}
& nav {
gap: 0.8rem;
& details {
gap: 0.8rem;
border-radius: var(--round);
font-weight: bold;
}
& details > summary {
display: flex;
align-items: center;
justify-content: center;
padding: 0 1.4rem 0 0;
height: 2rem;
& > svg {
transform: rotate(0deg);
transition: transform var(--trans);
}
}
& details[open] > summary {
margin-bottom: 0.4rem;
border-style: solid;
border-width: 2px;
border-radius: var(--round);
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
& svg {
transform: rotate(45deg);
}
}
& a {
margin: 0 1rem;
margin-bottom: 0.4rem;
border-radius: var(--round);
}
}
}
body > nav::before,
body::after {
z-index: -1;
content: "";
position: absolute;
mask-image: url("/assets/img/theme/sundae_sit-lines.png");
mask-repeat: no-repeat;
margin: 0;
width: inherit;
height: inherit;
pointer-events: none;
}
body > nav::before {
bottom: 0;
left: 0;
mask-size: 150%;
mask-position-x: -10px;
mask-position-y: 90%;
}
body::after {
content: none;
mask-size: 100%;
width: 100%;
height: 100vw;
mask-position-x: 0;
mask-position-y: bottom;
}
main {
display: flex;
flex-direction: column;
gap: 1rem;
width: auto;
}
summary::marker {
content: none;
}
/* Mobile view */
@media screen and (max-width: 920px) {
body > nav {
position: initial;
width: 100%;
}
main {
padding: 1rem;
}
main > section {
flex-direction: column;
}
main > section {
width: initial;
}
article {
max-width: initial;
width: auto;
}
body > nav::before {
content: none;
}
body > nav {
flex-direction: row;
top: 0;
border-right: 0;
width: 100%;
& details {
height: fit-content;
}
& details {
width: 100%;
}
}
body::after {
content: "";
}
}
@media screen and (max-width: 400px) {
article {
padding: 1rem !important;
}
body > nav {
flex-direction: column;
justify-content: start;
& details[open] {
width: 100%;
}
}
}

74
_src/assets/css/nav.css Normal file
View file

@ -0,0 +1,74 @@
body > nav::before,
body::after {
z-index: -1;
content: "";
position: absolute;
mask-image: url("/assets/img/theme/sundae_sit-lines.png");
mask-repeat: no-repeat;
margin: 0;
width: inherit;
height: inherit;
pointer-events: none;
}
body > nav::before {
bottom: 0;
left: 0;
mask-size: 150%;
-webkit-mask-position-x: -10px;
-webkit-mask-position-y: 90%;
}
body::after {
content: none;
mask-size: 100%;
width: 100%;
height: 100vw;
-webkit-mask-position-x: 0;
-webkit-mask-position-y: bottom;
}
body {
font-family: "Rubik", sans-serif;
&>nav {
gap: 0.8rem;
& details {
gap: 0.8rem;
border-radius: var(--round);
font-weight: bold;
}
& details > summary {
display: flex;
align-items: center;
justify-content: center;
padding: 0 1.4rem 0 0;
height: var(--pad);
& > svg {
transform: rotate(0deg);
transition: transform var(--trans);
}
}
& details[open] > summary {
margin-bottom: 0.4rem;
border-style: solid;
border-width: 2px;
border-radius: var(--round);
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
& svg {
transform: rotate(45deg);
}
}
& a {
border-style: solid;
border-width: 2px;
margin: 0 var(--pad-l);
margin-bottom: var(--pad-sm);
border-radius: var(--round);
}
}
}

View file

@ -0,0 +1,175 @@
@media (prefers-color-scheme: dark) {
article {
border-color: var(--secondary-300);
background-color: var(--secondary-200);
color: var(--secondary-light-300);
& aside {
box-shadow: inset 0 0 0 2px var(--secondary-500);
background-color: var(--secondary-300);
}
& figure {
color: var(--secondary-light-400);
border-color: var(--secondary-600);
background-color: var(--secondary-300);
}
& s,
u {
text-decoration-color: color-mix(in lch, red, var(--secondary-500) 20%);
}
& h3 a {
color: var(--secondary-light-300);
&:hover {
background-color: var(--secondary-light-300);
color: var(--secondary);
}
}
& code:not(pre *) {
background-color: var(--secondary-400);
}
& pre {
transition: background-color var(--trans), border-color var(--trans);
background-color: var(--secondary-100);
&:hover {
border-color: var(--secondary);
background-color: var(--secondary-400);
}
}
& pre,
code {
border-color: var(--secondary-400);
}
}
body {
background-color: var(--secondary-100);
color: var(--secondary-light-200);
& > nav {
border-right: 1px solid var(--secondary);
&::before,::after {
background-color: var(--secondary);
}
& a {
background-color: var(--secondary);
}
}
&::after {
background-color: var(--secondary);
}
& details {
box-shadow: inset 0 0 0 2px var(--secondary);
background-color: var(--secondary-100);
color: var(--secondary);
}
& details[open] {
box-shadow: inset 0 0 0 2px var(--secondary);
background-color: var(--secondary-300);
color: var(--secondary-light-200);
& summary {
border-color: var(--secondary);
background-color: var(--secondary-600);
}
& a {
color: var(--secondary-200);
border-color: var(--secondary);
&[aria-current] {
border-color: var(--secondary-600);
background-color: var(--secondary-200);
color: var(--secondary-light-500);
}
}
}
}
/* blog.css */
article {
& [aria-label="Postscript"]::after {
background-color: var(--secondary);
}
& p[aria-label="Post warning"] {
border-color: currentColor;
background-color: var(--secondary-100);
color: var(--secondary);
}
& [aria-label="Addendum"] {
box-shadow: inset 0 0 0 2px var(--secondary);
border-image-source: linear-gradient(
45deg,
var(--secondary),
var(--secondary-600),
var(--secondary)
);
background-color: var(--secondary-400);
}
}
#posts {
& a {
border-color: var(--secondary-600);
background-color: var(--secondary-300);
color: var(--secondary-light-400);
&:is(:hover, :focus) {
background-color: var(--secondary-500);
}
}
& p:not(:last-child) {
color: var(--secondary-light-700);
}
}
/* gallery.css */
#artworks {
& a {
transition: color var(--trans), background-color var(--trans),
border-color var(--trans);
& figure {
color: var(--secondary-light-400);
border-color: var(--secondary-600);
background-color: var(--secondary-300);
& time {
color: var(--secondary-light-500);
}
& figcaption {
color: var(--secondary-light-500);
}
&:is(:hover, :focus) {
border-color: currentColor;
background-color: var(--secondary-500);
}
}
}
}
/* home.css */
#badges a:is(:hover, :focus) img {
filter: drop-shadow(4px 6px 0 var(--secondary-500));
}
#collection {
& a:is(:hover, :focus) {
box-shadow: 0 0 0 1px currentColor;
background-color: var(--secondary-500);
}
& img {
box-shadow: 0 0 0 1px
color-mix(in lch, transparent, var(--secondary-500) 70%);
}
}
}

View file

@ -0,0 +1,176 @@
@media (prefers-color-scheme: light) {
article {
border-color: var(--primary-300);
background-color: var(--primary-200);
color: var(--primary-dark-300);
& aside {
box-shadow: inset 0 0 0 2px var(--primary-500);
background-color: var(--primary-300);
}
& figure {
color: var(--primary-dark-400);
border-color: var(--primary-600);
background-color: var(--primary-300);
}
& s,
u {
text-decoration-color: color-mix(in lch, red, var(--primary-500) 20%);
}
& h3 a {
color: var(--primary-dark-300);
&:hover {
background-color: var(--primary-dark-300);
color: var(--primary);
}
}
& code:not(pre *) {
background-color: var(--primary-400);
}
& pre {
transition: background-color var(--trans), border-color var(--trans);
background-color: var(--primary-100);
&:hover {
border-color: var(--primary);
background-color: var(--primary-400);
}
}
& pre,
code {
border-color: var(--primary-400);
}
}
body {
background-color: var(--primary-100);
color: var(--primary-dark-300);
& > nav {
border-right: 1px solid var(--primary);
&::before,::after {
background-color: var(--primary);
}
& a {
background-color: var(--primary);
}
}
&::after {
background-color: var(--primary);
}
& details {
box-shadow: inset 0 0 0 2px var(--primary);
background-color: white;
color: var(--primary);
}
& details[open] {
box-shadow: inset 0 0 0 2px var(--primary);
background-color: var(--primary-300);
color: var(--primary-dark-400);
& summary {
border-color: var(--primary);
background-color: var(--primary-600);
}
& a {
color: var(--primary-100);
border-color: var(--primary);
&[aria-current] {
border-color: var(--primary-600);
background-color: var(--primary-100);
color: var(--primary-dark-500);
}
}
}
}
/* blog.css */
article {
& [aria-label="Postscript"]::after {
background-color: var(--primary);
}
& p[aria-label="Post warning"] {
border-color: currentColor;
background-color: var(--primary-dark-200);
color: var(--primary);
}
& [aria-label="Addendum"] {
box-shadow: inset 0 0 0 2px var(--primary);
border-image-source: linear-gradient(
45deg,
var(--primary),
var(--primary-600),
var(--primary)
);
background-color: var(--primary-400);
}
}
#posts {
& a {
border-color: var(--primary-600);
background-color: var(--primary-300);
color: var(--primary-dark-400);
&:is(:hover, :focus) {
background-color: var(--primary-500);
}
}
& p:not(:last-child) {
color: var(--primary-dark-700);
}
}
/* gallery.css */
#artworks {
& a {
transition: color var(--trans), background-color var(--trans),
border-color var(--trans);
& figure {
color: var(--primary-dark-400);
border-color: var(--primary-600);
background-color: var(--primary-300);
& time {
color: var(--primary-dark-500);
}
& figcaption {
color: var(--primary-dark-500);
}
&:is(:hover, :focus) {
border-color: currentColor;
background-color: var(--primary-500);
}
}
}
}
/* home.css */
#badges a:is(:hover, :focus) img {
filter: drop-shadow(4px 6px 0 var(--primary-500));
}
#collection {
& a:is(:hover, :focus) {
box-shadow: 0 0 0 1px currentColor;
background-color: var(--primary-500);
}
& img {
box-shadow: 0 0 0 1px
color-mix(in lch, transparent, var(--primary-dark-500) 30%);
}
}
}

View file

@ -38,8 +38,15 @@
--secondary-800: color-mix(in lch, var(--secondary), black 20%);
--secondary-900: color-mix(in lch, var(--secondary), black 10%);
--trans: 300ms;
--image: 24rem;
--post: 75ch;
--round: 16px;
--paw: url("/assets/img/theme/cherry/pawprint.svg");
--pad-xl: 2rem;
--pad-lm: 1.4rem;
--pad-l: 1rem;
--pad-m: 0.8rem;
--pad-sm: 0.4rem;
--paw: url("/assets/img/theme/paw.svg");
}
@font-face {
font-family: Rubik;

Binary file not shown.

Before

Width:  |  Height:  |  Size: 71 KiB

After

Width:  |  Height:  |  Size: 345 KiB

Before After
Before After

Binary file not shown.

Before

Width:  |  Height:  |  Size: 311 B

After

Width:  |  Height:  |  Size: 413 B

Before After
Before After

Binary file not shown.

After

Width:  |  Height:  |  Size: 82 KiB

View file

@ -0,0 +1,7 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 588 420">
<path fill="#2C2C2C" d="M0 0h588v420H0z"/>
<path fill="#BABABA" d="M0 60h588v300H0z"/>
<path fill="#FCFCFC" d="M0 120h588v180H0z"/>
<path fill="#B9F483" d="M0 180h588v60H0z"/>
</svg>

After

Width:  |  Height:  |  Size: 298 B

View file

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 750 500">
<path fill="#3AA740" d="M0 0h750v100H0z"/>
<path fill="#A8D47A" d="M0 100h750v100H0z"/>
<path fill="#FCFCFC" d="M0 200h750v100H0z"/>
<path fill="#ABABAB" d="M0 300h750v100H0z"/>
<path fill="#2C2C2C" d="M0 400h750v100H0z"/>
</svg>

After

Width:  |  Height:  |  Size: 348 B

View file

@ -0,0 +1,7 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 750 500">
<path fill="#2C2C2C" d="M0 0h750v125H0z"/>
<path fill="#A3A3A3" d="M0 125h750v125H0z"/>
<path fill="#FCFCFC" d="M0 250h750v125H0z"/>
<path fill="#810081" d="M0 375h750v125H0z"/>
</svg>

After

Width:  |  Height:  |  Size: 295 B

View file

@ -0,0 +1,7 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 672 480" style="cursor: default;">
<path fill="#D2D2D2" d="M0 0h672v480H0"/>
<path fill="#6E0070" d="M0 0h672v280H0"/>
<path fill="#FCFCFC" d="M0 0h672v200H0"/>
<path fill="#2C2C2C" d="M0 0l257 240L0 480"/>
</svg>

After

Width:  |  Height:  |  Size: 313 B

View file

@ -0,0 +1,7 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 750 500">
<path fill="#FCF431" d="M0 0h750v125H0z"/>
<path fill="#FCFCFC" d="M0 125h750v125H0z"/>
<path fill="#9D59D2" d="M0 250h750v125H0z"/>
<path fill="#2C2C2C" d="M0 375h750v125H0z"/>
</svg>

After

Width:  |  Height:  |  Size: 294 B

View file

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 840 600">
<path fill="#FF1B8D" d="M0 0h840v200H0z"/>
<path fill="#FFD900" d="M0 200h840v200H0z"/>
<path fill="#1BB3FF" d="M0 400h840v200H0z"/>
</svg>

After

Width:  |  Height:  |  Size: 252 B

View file

@ -0,0 +1,9 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 840 600">
<path fill="#E50000" d="M0 0h840v100H0z"/>
<path fill="#FF8D00" d="M0 100h840v100H0z"/>
<path fill="#FFEE00" d="M0 200h840v100H0z"/>
<path fill="#008121" d="M0 300h840v100H0z"/>
<path fill="#004CFF" d="M0 400h840v100H0z"/>
<path fill="#760188" d="M0 500h840v100H0z"/>
</svg>

After

Width:  |  Height:  |  Size: 396 B

View file

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 672 480">
<path fill="#5BCEFA" d="M0 0h672v480H0z"/>
<path fill="#F5A9B8" d="M0 96h672v288H0z"/>
<path fill="#FCFCFC" d="M0 192h672v96H0z"/>
</svg>

After

Width:  |  Height:  |  Size: 250 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 470 B

After

Width:  |  Height:  |  Size: 402 B

Before After
Before After

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 335 KiB

After

Width:  |  Height:  |  Size: 105 KiB

Before After
Before After

View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0.156293 0.219421 3.695 3.56">
<path d="m3.1401 3.2368c0 .8966-.511.4076-1.1412.4076-.6302 0-1.1412.489-1.1412-.4076 0-.585.511-1.2226 1.1412-1.2226.6302 0 1.1412.6376 1.1412 1.2226zM.8137 1.6214c.0788.2672.0014.5252-.1724.5764-.174.0512-.3786-.1238-.4572-.3908-.0786-.2672-.0014-.5252.1724-.5764.174-.0512.3786.1238.4572.3908zm3 .189c-.0814.2664-.2884.4392-.4624.386-.1738-.0532-.2488-.3122-.1674-.5784.0814-.2664.2884-.4392.4624-.386.1738.053.2488.312.1674.5784zM1.7917.8386c.073.3794-.0436.7212-.2604.7628-.217.0418-.4522-.232-.5252-.6118-.073-.3796.0436-.7212.2604-.763.217-.0416.4522.2324.5252.612zm1.1992.1556c-.0776.3786-.3156.65-.532.6058-.2164-.0444-.3294-.3874-.252-.766.0776-.3788.3156-.65.532-.6058.2164.0444.3294.3874.252.766z"/>
</svg>

After

Width:  |  Height:  |  Size: 811 B

15
_src/assets/js/bob.js Normal file
View file

@ -0,0 +1,15 @@
let bob = document.getElementById("bob");
let help = document.createElement("audio");
help.src = "/assets/audio/bob.ogg";
help.loop = true;
bob.appendChild(help);
window.addEventListener("load", function () {
help.play();
help.muted = true;
});
bob.onmouseover = () => {
help.muted = false;
};
bob.onmouseout = () => {
help.muted = true;
};

View file

@ -1,13 +1,23 @@
let pipe = document.getElementById("meow");
let preload = new Image();
preload.src = "/assets/img/button/braixdragon-cat2.gif";
pipe.addEventListener("mouseover", func, true);
function func() {
pipe.src = "/assets/img/button/braixdragon-cat2.gif";
pipe.src = preload.src;
}
let audio = document.createElement("audio");
audio.src = "/assets/Destruction_Metal_Pole_L_Wave_2_0_0.wav";
document.body.appendChild(audio);
pipe.addEventListener("mouseover", function () {
audio.src = "/assets/audio/anvil_land_low.ogg";
pipe.appendChild(audio);
pipe.addEventListener(
"mouseover",
function () {
setTimeout(() => {
audio.play();
}, 1700);
}, { once: true });
},
{ once: true }
);

View file

@ -1,12 +1,15 @@
let fox = document.getElementById("fox");
let music = document.createElement("audio");
music.src = "/assets/fox.ogg";
music.src = "/assets/audio/fox.ogg";
music.loop = true;
document.body.appendChild(music);
fox.onmouseover = () => {
fox.appendChild(music);
window.addEventListener("load", function () {
music.play();
}
music.muted = true;
});
fox.onmouseover = () => {
music.muted = false;
};
fox.onmouseout = () => {
music.pause();
music.currentTime = 0;
}
music.muted = true;
};

View file

@ -1,10 +1,25 @@
const detailsElements = document.getElementsByTagName('details');
const save = () => {
Array.from(detailsElements).forEach((details, i) => {
localStorage.setItem(`details${i}`, details.hasAttribute('open'));
});
};
Array.from(detailsElements).forEach((details, i) => {
details.toggleAttribute('open', JSON.parse(localStorage.getItem(`details${i}`)) || false);
const isOpen = JSON.parse(localStorage.getItem(`details${i}`)) || false;
details.toggleAttribute('open', isOpen);
details.addEventListener('toggle', save);
const svg = details.querySelector('summary svg');
if (svg) {
svg.style.transition = isOpen ? 'none' : '';
}
});
setTimeout(() => {
Array.from(detailsElements).forEach(details => {
const svg = details.querySelector('summary svg');
if (svg) svg.style.transition = '';
});
}, 100);

View file

@ -1,352 +1,375 @@
var pkmn = [
'src="/assets/img/pkmn/1.png" title="Bulbasaur"',
'src="/assets/img/pkmn/2.png" title="Ivysaur"',
'src="/assets/img/pkmn/3.png" title="Venusaur"',
'src="/assets/img/pkmn/4.png" title="Charmander"',
'src="/assets/img/pkmn/5.png" title="Charmeleon"',
'src="/assets/img/pkmn/6.png" title="Charizard"',
'src="/assets/img/pkmn/7.png" title="Squirtle"',
'src="/assets/img/pkmn/8.png" title="Wartortle"',
'src="/assets/img/pkmn/9.png" title="Blastoise"',
'src="/assets/img/pkmn/15.png" title="Beedrill"',
'src="/assets/img/pkmn/25.png" title="Pikachu"',
'src="/assets/img/pkmn/26.png" title="Raichu"',
'src="/assets/img/pkmn/28.png" title="Sandslash"',
'src="/assets/img/pkmn/29.png" title="Nidoran (Female)"',
'src="/assets/img/pkmn/30.png" title="Nidorina"',
'src="/assets/img/pkmn/31.png" title="Nidoqueen"',
'src="/assets/img/pkmn/32.png" title="Nidoran (Male)"',
'src="/assets/img/pkmn/33.png" title="Nidorino"',
'src="/assets/img/pkmn/34.png" title="Nidoking"',
'src="/assets/img/pkmn/37.png" title="Vulpix"',
'src="/assets/img/pkmn/38.png" title="Ninetales"',
'src="/assets/img/pkmn/52.png" title="Meowth"',
'src="/assets/img/pkmn/58.png" title="Growlithe"',
'src="/assets/img/pkmn/59.png" title="Arcanine"',
'src="/assets/img/pkmn/79.png" title="Slowpoke"',
'src="/assets/img/pkmn/81.png" title="Magnemite"',
'src="/assets/img/pkmn/82.png" title="Magneton"',
'src="/assets/img/pkmn/87.png" title="Dewgong"',
'src="/assets/img/pkmn/90.png" title="Shellder"',
'src="/assets/img/pkmn/92.png" title="Gastly"',
'src="/assets/img/pkmn/93.png" title="Haunter"',
'src="/assets/img/pkmn/94.png" title="Gengar"',
'src="/assets/img/pkmn/96.png" title="Drowzee"',
'src="/assets/img/pkmn/104.png" title="Cubone"',
'src="/assets/img/pkmn/112.png" title="Rhydon"',
'src="/assets/img/pkmn/115.png" title="Kangaskhan"',
'src="/assets/img/pkmn/131.png" title="Lapras"',
'src="/assets/img/pkmn/133.png" title="Eevee"',
'src="/assets/img/pkmn/134.png" title="Vaporeon"',
'src="/assets/img/pkmn/135.png" title="Jolteon"',
'src="/assets/img/pkmn/136.png" title="Flareon"',
'src="/assets/img/pkmn/137.png" title="Porygon"',
'src="/assets/img/pkmn/138.png" title="Omanyte"',
'src="/assets/img/pkmn/147.png" title="Dratini"',
'src="/assets/img/pkmn/148.png" title="Dragonair"',
'src="/assets/img/pkmn/149.png" title="Dragonite"',
'src="/assets/img/pkmn/150.png" title="Mewtwo"',
'src="/assets/img/pkmn/151.png" title="Mew"',
'src="/assets/img/pkmn/155.png" title="Cyndaquil"',
'src="/assets/img/pkmn/156.png" title="Quilava"',
'src="/assets/img/pkmn/157.png" title="Typhlosion"',
'src="/assets/img/pkmn/158.png" title="Totodile"',
'src="/assets/img/pkmn/159.png" title="Croconaw"',
'src="/assets/img/pkmn/160.png" title="Feraligatr"',
'src="/assets/img/pkmn/162.png" title="Furret"',
'src="/assets/img/pkmn/166.png" title="Ledian"',
'src="/assets/img/pkmn/167.png" title="Spinarak"',
'src="/assets/img/pkmn/172.png" title="Pichu"',
'src="/assets/img/pkmn/175.png" title="Togepi"',
'src="/assets/img/pkmn/176.png" title="Togetic"',
'src="/assets/img/pkmn/177.png" title="Natu"',
'src="/assets/img/pkmn/178.png" title="Xatu"',
'src="/assets/img/pkmn/179.png" title="Mareep"',
'src="/assets/img/pkmn/180.png" title="Flaaffy"',
'src="/assets/img/pkmn/181.png" title="Ampharos"',
'src="/assets/img/pkmn/182.png" title="Bellossom"',
'src="/assets/img/pkmn/183.png" title="Marill"',
'src="/assets/img/pkmn/184.png" title="Azumarill"',
'src="/assets/img/pkmn/187.png" title="Hoppip"',
'src="/assets/img/pkmn/190.png" title="Aipom"',
'src="/assets/img/pkmn/194.png" title="Wooper"',
'src="/assets/img/pkmn/195.png" title="Quagsire"',
'src="/assets/img/pkmn/196.png" title="Espeon"',
'src="/assets/img/pkmn/197.png" title="Umbreon"',
'src="/assets/img/pkmn/198.png" title="Murkrow"',
'src="/assets/img/pkmn/200.png" title="Misdreavus"',
'src="/assets/img/pkmn/202.png" title="Girafarig"',
'src="/assets/img/pkmn/203.png" title="Wobbuffet"',
'src="/assets/img/pkmn/206.png" title="Dunsparce"',
'src="/assets/img/pkmn/212.png" title="Scizor"',
'src="/assets/img/pkmn/213.png" title="Shuckle"',
'src="/assets/img/pkmn/215.png" title="Sneasel"',
'src="/assets/img/pkmn/216.png" title="Teddiursa"',
'src="/assets/img/pkmn/218.png" title="Slugma"',
'src="/assets/img/pkmn/222.png" title="Corsola"',
'src="/assets/img/pkmn/225.png" title="Delibird"',
'src="/assets/img/pkmn/227.png" title="Skarmory"',
'src="/assets/img/pkmn/228.png" title="Houndour"',
'src="/assets/img/pkmn/229.png" title="Houndoom"',
'src="/assets/img/pkmn/231.png" title="Phanpy"',
'src="/assets/img/pkmn/233.png" title="Porygon2"',
'src="/assets/img/pkmn/235.png" title="Smeargle"',
'src="/assets/img/pkmn/241.png" title="Miltank"',
'src="/assets/img/pkmn/245.png" title="Suicune"',
'src="/assets/img/pkmn/248.png" title="Tyranitar"',
'src="/assets/img/pkmn/249.png" title="Lugia"',
'src="/assets/img/pkmn/250.png" title="Ho-oh"',
'src="/assets/img/pkmn/251.png" title="Celebi"',
'src="/assets/img/pkmn/252.png" title="Treecko"',
'src="/assets/img/pkmn/253.png" title="Grovyle"',
'src="/assets/img/pkmn/254.png" title="Sceptile"',
'src="/assets/img/pkmn/255.png" title="Torchic"',
'src="/assets/img/pkmn/257.png" title="Blaziken"',
'src="/assets/img/pkmn/258.png" title="Mudkip"',
'src="/assets/img/pkmn/260.png" title="Swampert"',
'src="/assets/img/pkmn/261.png" title="Poochyena"',
'src="/assets/img/pkmn/262.png" title="Mightyena"',
'src="/assets/img/pkmn/263.png" title="Zigzagoon"',
'src="/assets/img/pkmn/265.png" title="Wurmple"',
'src="/assets/img/pkmn/274.png" title="Nuzleaf"',
'src="/assets/img/pkmn/280.png" title="Ralts"',
'src="/assets/img/pkmn/281.png" title="Kirlia"',
'src="/assets/img/pkmn/282.png" title="Gardevoir"',
'src="/assets/img/pkmn/286.png" title="Breloom"',
'src="/assets/img/pkmn/287.png" title="Slakoth"',
'src="/assets/img/pkmn/298.png" title="Azurill"',
'src="/assets/img/pkmn/300.png" title="Skitty"',
'src="/assets/img/pkmn/301.png" title="Delcatty"',
'src="/assets/img/pkmn/302.png" title="Sableye"',
'src="/assets/img/pkmn/303.png" title="Mawile"',
'src="/assets/img/pkmn/304.png" title="Aron"',
'src="/assets/img/pkmn/306.png" title="Aggron"',
'src="/assets/img/pkmn/311.png" title="Plusle"',
'src="/assets/img/pkmn/312.png" title="Minun"',
'src="/assets/img/pkmn/315.png" title="Roselia"',
'src="/assets/img/pkmn/322.png" title="Numel"',
'src="/assets/img/pkmn/327.png" title="Spinda"',
'src="/assets/img/pkmn/328.png" title="Trapinch"',
'src="/assets/img/pkmn/329.png" title="Vibrava"',
'src="/assets/img/pkmn/330.png" title="Flygon"',
'src="/assets/img/pkmn/334.png" title="Altaria"',
'src="/assets/img/pkmn/335.png" title="Zangoose"',
'src="/assets/img/pkmn/336.png" title="Seviper"',
'src="/assets/img/pkmn/337.png" title="Lunatone"',
'src="/assets/img/pkmn/338.png" title="Solrock"',
'src="/assets/img/pkmn/350.png" title="Milotic"',
'src="/assets/img/pkmn/352.png" title="Kecleon"',
'src="/assets/img/pkmn/354.png" title="Banette"',
'src="/assets/img/pkmn/359.png" title="Absol"',
'src="/assets/img/pkmn/360.png" title="Wynaut"',
'src="/assets/img/pkmn/363.png" title="Spheal"',
'src="/assets/img/pkmn/373.png" title="Salamence"',
'src="/assets/img/pkmn/380.png" title="Latias"',
'src="/assets/img/pkmn/381.png" title="Latios"',
'src="/assets/img/pkmn/384.png" title="Rayquaza"',
'src="/assets/img/pkmn/385.png" title="Jirachi"',
'src="/assets/img/pkmn/387.png" title="Turtwig"',
'src="/assets/img/pkmn/389.png" title="Torterra"',
'src="/assets/img/pkmn/393.png" title="Piplup"',
'src="/assets/img/pkmn/403.png" title="Shinx"',
'src="/assets/img/pkmn/404.png" title="Luxio"',
'src="/assets/img/pkmn/405.png" title="Luxray"',
'src="/assets/img/pkmn/407.png" title="Roserade"',
'src="/assets/img/pkmn/418.png" title="Buizel"',
'src="/assets/img/pkmn/419.png" title="Floatzel"',
'src="/assets/img/pkmn/423.png" title="Gastrodon"',
'src="/assets/img/pkmn/424.png" title="Ambipom"',
'src="/assets/img/pkmn/427.png" title="Buneary"',
'src="/assets/img/pkmn/428.png" title="Lopunny"',
'src="/assets/img/pkmn/429.png" title="Mismagius"',
'src="/assets/img/pkmn/430.png" title="Honchkrow"',
'src="/assets/img/pkmn/431.png" title="Glameow"',
'src="/assets/img/pkmn/432.png" title="Purugly"',
'src="/assets/img/pkmn/445.png" title="Garchomp"',
'src="/assets/img/pkmn/447.png" title="Riolu"',
'src="/assets/img/pkmn/448.png" title="Lucario"',
'src="/assets/img/pkmn/453.png" title="Croagunk"',
'src="/assets/img/pkmn/461.png" title="Weavile"',
'src="/assets/img/pkmn/468.png" title="Togekiss"',
'src="/assets/img/pkmn/470.png" title="Leafeon"',
'src="/assets/img/pkmn/471.png" title="Glaceon"',
'src="/assets/img/pkmn/474.png" title="Porygon-Z"',
'src="/assets/img/pkmn/475.png" title="Gallade"',
'src="/assets/img/pkmn/478.png" title="Froslass"',
'src="/assets/img/pkmn/480.png" title="Uxie"',
'src="/assets/img/pkmn/481.png" title="Mesprit"',
'src="/assets/img/pkmn/482.png" title="Azelf"',
'src="/assets/img/pkmn/487.png" title="Giratina"',
'src="/assets/img/pkmn/488.png" title="Cresselia"',
'src="/assets/img/pkmn/490.png" title="Manaphy"',
'src="/assets/img/pkmn/492.png" title="Shaymin"',
'src="/assets/img/pkmn/493.png" title="Arceus"',
'src="/assets/img/pkmn/494.png" title="Victini"',
'src="/assets/img/pkmn/495.png" title="Snivy"',
'src="/assets/img/pkmn/496.png" title="Servine"',
'src="/assets/img/pkmn/497.png" title="Serperior"',
'src="/assets/img/pkmn/498.png" title="Tepig"',
'src="/assets/img/pkmn/501.png" title="Oshawott"',
'src="/assets/img/pkmn/502.png" title="Dewott"',
'src="/assets/img/pkmn/503.png" title="Samurott"',
'src="/assets/img/pkmn/509.png" title="Purrloin"',
'src="/assets/img/pkmn/510.png" title="Liepard"',
'src="/assets/img/pkmn/515.png" title="Panpour"',
'src="/assets/img/pkmn/516.png" title="Simipour"',
'src="/assets/img/pkmn/529.png" title="Drilbur"',
'src="/assets/img/pkmn/530.png" title="Excadrill"',
'src="/assets/img/pkmn/531.png" title="Audino"',
'src="/assets/img/pkmn/540.png" title="Sewaddle"',
'src="/assets/img/pkmn/541.png" title="Swadloon"',
'src="/assets/img/pkmn/542.png" title="Leavanny"',
'src="/assets/img/pkmn/545.png" title="Scolipede"',
'src="/assets/img/pkmn/546.png" title="Cottonee"',
'src="/assets/img/pkmn/547.png" title="Whimsicott"',
'src="/assets/img/pkmn/548.png" title="Petilil"',
'src="/assets/img/pkmn/549.png" title="Lilligant"',
'src="/assets/img/pkmn/556.png" title="Maractus"',
'src="/assets/img/pkmn/559.png" title="Scraggy"',
'src="/assets/img/pkmn/560.png" title="Scrafty"',
'src="/assets/img/pkmn/566.png" title="Archen"',
'src="/assets/img/pkmn/567.png" title="Archeops"',
'src="/assets/img/pkmn/570.png" title="Zorua"',
'src="/assets/img/pkmn/571.png" title="Zoroark"',
'src="/assets/img/pkmn/572.png" title="Minccino"',
'src="/assets/img/pkmn/573.png" title="Cinccino"',
'src="/assets/img/pkmn/577.png" title="Solosis"',
'src="/assets/img/pkmn/578.png" title="Duosion"',
'src="/assets/img/pkmn/579.png" title="Reuniclus"',
'src="/assets/img/pkmn/580.png" title="Ducklett"',
'src="/assets/img/pkmn/585.png" title="Deerling"',
'src="/assets/img/pkmn/587.png" title="Emolga"',
'src="/assets/img/pkmn/595.png" title="Joltik"',
'src="/assets/img/pkmn/612.png" title="Haxorus"',
'src="/assets/img/pkmn/616.png" title="Shelmet"',
'src="/assets/img/pkmn/619.png" title="Mienfoo"',
'src="/assets/img/pkmn/620.png" title="Mienshao"',
'src="/assets/img/pkmn/633.png" title="Deino"',
'src="/assets/img/pkmn/634.png" title="Zweilous"',
'src="/assets/img/pkmn/637.png" title="Volcarona"',
'src="/assets/img/pkmn/638.png" title="Cobalion"',
'src="/assets/img/pkmn/640.png" title="Virizion"',
'src="/assets/img/pkmn/643.png" title="Reshiram"',
'src="/assets/img/pkmn/644.png" title="Zekrom"',
'src="/assets/img/pkmn/647.png" title="Keldeo"',
'src="/assets/img/pkmn/648.png" title="Meloetta"',
'src="/assets/img/pkmn/3-mega.png" title="Mega Venusaur"',
'src="/assets/img/pkmn/6-mega-x.png" title="Mega Charizard X"',
'src="/assets/img/pkmn/6-mega-y.png" title="Mega Charizard Y"',
'src="/assets/img/pkmn/9-mega.png" title="Mega Blastoise"',
'src="/assets/img/pkmn/15-mega.png" title="Mega Beedrill"',
'src="/assets/img/pkmn/115-mega.png" title="Mega Kangaskhan"',
'src="/assets/img/pkmn/150-mega-x.png" title="Mega Mewtwo X"',
'src="/assets/img/pkmn/150-mega-y.png" title="Mega Mewtwo Y"',
'src="/assets/img/pkmn/181-mega.png" title="Mega Ampharos"',
'src="/assets/img/pkmn/212-mega.png" title="Mega Scizor"',
'src="/assets/img/pkmn/229-mega.png" title="Mega Houndoom"',
'src="/assets/img/pkmn/248-mega.png" title="Mega Tyranitar"',
'src="/assets/img/pkmn/254-mega.png" title="Mega Sceptile"',
'src="/assets/img/pkmn/257-mega.png" title="Mega Blaziken"',
'src="/assets/img/pkmn/260-mega.png" title="Mega Swampert"',
'src="/assets/img/pkmn/282-mega.png" title="Mega Gardevoir"',
'src="/assets/img/pkmn/302-mega.png" title="Mega Sableye"',
'src="/assets/img/pkmn/306-mega.png" title="Mega Aggron"',
'src="/assets/img/pkmn/334-mega.png" title="Mega Altaria"',
'src="/assets/img/pkmn/354-mega.png" title="Mega Banette"',
'src="/assets/img/pkmn/359-mega.png" title="Mega Absol"',
'src="/assets/img/pkmn/373-mega.png" title="Mega Salamence"',
'src="/assets/img/pkmn/428-mega.png" title="Mega Lopunny"',
'src="/assets/img/pkmn/445-mega.png" title="Mega Garchomp"',
'src="/assets/img/pkmn/448-mega.png" title="Mega Lucario"',
'src="/assets/img/pkmn/475-mega.png" title="Mega Gallade"',
'src="/assets/img/pkmn/531-mega.png" title="Mega Audino"',
'src="/assets/img/pkmn/650.png" title="Chespin"',
'src="/assets/img/pkmn/651.png" title="Quilladin"',
'src="/assets/img/pkmn/652.png" title="Chesnaught"',
'src="/assets/img/pkmn/653.png" title="Fennekin"',
'src="/assets/img/pkmn/654.png" title="Braixen"',
'src="/assets/img/pkmn/655.png" title="Delphox"',
'src="/assets/img/pkmn/656.png" title="Froakie"',
'src="/assets/img/pkmn/657.png" title="Frogadier"',
'src="/assets/img/pkmn/658.png" title="Greninja"',
'src="/assets/img/pkmn/674.png" title="Pancham"',
'src="/assets/img/pkmn/676.png" title="Furfrou"',
'src="/assets/img/pkmn/677.png" title="Espurr"',
'src="/assets/img/pkmn/678-male.png" title="Meowstic (Male)"',
'src="/assets/img/pkmn/678-female.png" title="Meowstic (Female)"',
'src="/assets/img/pkmn/694.png" title="Helioptile"',
'src="/assets/img/pkmn/695.png" title="Heliolisk"',
'src="/assets/img/pkmn/699.png" title="Aurorus"',
'src="/assets/img/pkmn/700.png" title="Sylveon"',
'src="/assets/img/pkmn/701.png" title="Hawlucha"',
'src="/assets/img/pkmn/704.png" title="Goomy"',
'src="/assets/img/pkmn/705.png" title="Sliggoo"',
'src="/assets/img/pkmn/706.png" title="Goodra"',
'src="/assets/img/pkmn/708.png" title="Phantump"',
'src="/assets/img/pkmn/714.png" title="Noibat"',
'src="/assets/img/pkmn/715.png" title="Noivern"',
'src="/assets/img/pkmn/716.png" title="Xerneas"',
'src="/assets/img/pkmn/717.png" title="Yveltal"',
'src="/assets/img/pkmn/722.png" title="Rowlet"',
'src="/assets/img/pkmn/723.png" title="Dartrix"',
'src="/assets/img/pkmn/724.png" title="Decidueye"',
'src="/assets/img/pkmn/725.png" title="Litten"',
'src="/assets/img/pkmn/726.png" title="Torracat"',
'src="/assets/img/pkmn/728.png" title="Popplio"',
'src="/assets/img/pkmn/729.png" title="Brionne"',
'src="/assets/img/pkmn/730.png" title="Primarina"',
'src="/assets/img/pkmn/731.png" title="Pikipek"',
'src="/assets/img/pkmn/743.png" title="Ribombee"',
'src="/assets/img/pkmn/744.png" title="Rockruff"',
'src="/assets/img/pkmn/745.png" title="Lycanroc"',
'src="/assets/img/pkmn/745-dusk.png" title="Lycanroc (Dusk Form)"',
'src="/assets/img/pkmn/745-midnight.png" title="Lycanroc (Midnight Form)"',
'src="/assets/img/pkmn/747.png" title="Mareanie"',
'src="/assets/img/pkmn/748.png" title="Toxapex"',
'src="/assets/img/pkmn/753.png" title="Fomantis"',
'src="/assets/img/pkmn/754.png" title="Lurantis"',
'src="/assets/img/pkmn/757.png" title="Salandit"',
'src="/assets/img/pkmn/758.png" title="Salazzle"',
'src="/assets/img/pkmn/759.png" title="Stufful"',
'src="/assets/img/pkmn/760.png" title="Bewear"',
'src="/assets/img/pkmn/762.png" title="Steenee"',
'src="/assets/img/pkmn/763.png" title="Tsareena"',
'src="/assets/img/pkmn/771.png" title="Pyukumuku"',
'src="/assets/img/pkmn/775.png" title="Komala"',
'src="/assets/img/pkmn/778.png" title="Mimikyu"',
'src="/assets/img/pkmn/782.png" title="Jangmo-o"',
'src="/assets/img/pkmn/784.png" title="Kommo-o"',
'src="/assets/img/pkmn/786.png" title="Tapu Lele"',
'src="/assets/img/pkmn/789.png" title="Cosmog"',
'src="/assets/img/pkmn/791.png" title="Solgaleo"',
'src="/assets/img/pkmn/792.png" title="Lunala"',
'src="/assets/img/pkmn/797.png" title="Celesteela"',
'src="/assets/img/pkmn/802.png" title="Marshadow"',
'src="/assets/img/pkmn/803.png" title="Poipole"',
'src="/assets/img/pkmn/807.png" title="Zeraora"',
'src="/assets/img/pkmn/810.png" title="Grookey"',
'src="/assets/img/pkmn/813.png" title="Scorbunny"',
'src="/assets/img/pkmn/814.png" title="Raboot"',
'src="/assets/img/pkmn/815.png" title="Cinderace"',
'src="/assets/img/pkmn/816.png" title="Sobble"',
'src="/assets/img/pkmn/817.png" title="Drizzile"',
'src="/assets/img/pkmn/818.png" title="Inteleon"',
'src="/assets/img/pkmn/823.png" title="Corviknight"',
'src="/assets/img/pkmn/827.png" title="Nickit"',
'src="/assets/img/pkmn/828.png" title="Thievul"',
'src="/assets/img/pkmn/831.png" title="Wooloo"',
'src="/assets/img/pkmn/835.png" title="Yamper"',
'src="/assets/img/pkmn/858.png" title="Hatterene"',
'src="/assets/img/pkmn/859.png" title="Impidimp"',
'src="/assets/img/pkmn/862.png" title="Obstagoon"',
'src="/assets/img/pkmn/869.png" title="Alcremie"',
'src="/assets/img/pkmn/870.png" title="Falinks"',
'src="/assets/img/pkmn/872.png" title="Snom"',
'src="/assets/img/pkmn/876-male.png" title="Indeedee (Male)"',
'src="/assets/img/pkmn/876-female.png" title="Indeedee (Female)"',
'src="/assets/img/pkmn/887.png" title="Dragapult"',
var favorites = [
{ img: 'src="/assets/img/pkmn/1.png" title="Bulbasaur"'},
{ img: 'src="/assets/img/pkmn/2.png" title="Ivysaur"'},
{ img: 'src="/assets/img/pkmn/3.png" title="Venusaur"'},
{ img: 'src="/assets/img/pkmn/4.png" title="Charmander"'},
{ img: 'src="/assets/img/pkmn/5.png" title="Charmeleon"'},
{ img: 'src="/assets/img/pkmn/6.png" title="Charizard"'},
{ img: 'src="/assets/img/pkmn/7.png" title="Squirtle"'},
{ img: 'src="/assets/img/pkmn/8.png" title="Wartortle"'},
{ img: 'src="/assets/img/pkmn/9.png" title="Blastoise"'},
{ img: 'src="/assets/img/pkmn/15.png" title="Beedrill"'},
{ img: 'src="/assets/img/pkmn/25.png" title="Pikachu"'},
{ img: 'src="/assets/img/pkmn/26.png" title="Raichu"'},
{ img: 'src="/assets/img/pkmn/28.png" title="Sandslash"'},
{ img: 'src="/assets/img/pkmn/29.png" title="Nidoran (Female)"'},
{ img: 'src="/assets/img/pkmn/30.png" title="Nidorina"'},
{ img: 'src="/assets/img/pkmn/31.png" title="Nidoqueen"'},
{ img: 'src="/assets/img/pkmn/32.png" title="Nidoran (Male)"'},
{ img: 'src="/assets/img/pkmn/33.png" title="Nidorino"'},
{ img: 'src="/assets/img/pkmn/34.png" title="Nidoking"'},
{ img: 'src="/assets/img/pkmn/37.png" title="Vulpix"'},
{ img: 'src="/assets/img/pkmn/38.png" title="Ninetales"'},
{ img: 'src="/assets/img/pkmn/52.png" title="Meowth"'},
{ img: 'src="/assets/img/pkmn/58.png" title="Growlithe"'},
{ img: 'src="/assets/img/pkmn/59.png" title="Arcanine"'},
{ img: 'src="/assets/img/pkmn/79.png" title="Slowpoke"'},
{ img: 'src="/assets/img/pkmn/81.png" title="Magnemite"'},
{ img: 'src="/assets/img/pkmn/82.png" title="Magneton"'},
{ img: 'src="/assets/img/pkmn/87.png" title="Dewgong"'},
{ img: 'src="/assets/img/pkmn/90.png" title="Shellder"'},
{ img: 'src="/assets/img/pkmn/92.png" title="Gastly"'},
{ img: 'src="/assets/img/pkmn/93.png" title="Haunter"'},
{ img: 'src="/assets/img/pkmn/94.png" title="Gengar"'},
{ img: 'src="/assets/img/pkmn/96.png" title="Drowzee"'},
{ img: 'src="/assets/img/pkmn/104.png" title="Cubone"'},
{ img: 'src="/assets/img/pkmn/112.png" title="Rhydon"'},
{ img: 'src="/assets/img/pkmn/115.png" title="Kangaskhan"'},
{ img: 'src="/assets/img/pkmn/131.png" title="Lapras"'},
{ img: 'src="/assets/img/pkmn/133.png" title="Eevee"'},
{ img: 'src="/assets/img/pkmn/134.png" title="Vaporeon"'},
{ img: 'src="/assets/img/pkmn/135.png" title="Jolteon"'},
{ img: 'src="/assets/img/pkmn/136.png" title="Flareon"'},
{ img: 'src="/assets/img/pkmn/137.png" title="Porygon"'},
{ img: 'src="/assets/img/pkmn/138.png" title="Omanyte"'},
{ img: 'src="/assets/img/pkmn/147.png" title="Dratini"'},
{ img: 'src="/assets/img/pkmn/148.png" title="Dragonair"'},
{ img: 'src="/assets/img/pkmn/149.png" title="Dragonite"'},
{ img: 'src="/assets/img/pkmn/150.png" title="Mewtwo"'},
{ img: 'src="/assets/img/pkmn/151.png" title="Mew"'},
{ img: 'src="/assets/img/pkmn/155.png" title="Cyndaquil"'},
{ img: 'src="/assets/img/pkmn/156.png" title="Quilava"'},
{ img: 'src="/assets/img/pkmn/157.png" title="Typhlosion"'},
{ img: 'src="/assets/img/pkmn/158.png" title="Totodile"'},
{ img: 'src="/assets/img/pkmn/159.png" title="Croconaw"'},
{ img: 'src="/assets/img/pkmn/160.png" title="Feraligatr"'},
{ img: 'src="/assets/img/pkmn/162.png" title="Furret"'},
{ img: 'src="/assets/img/pkmn/166.png" title="Ledian"'},
{ img: 'src="/assets/img/pkmn/167.png" title="Spinarak"'},
{ img: 'src="/assets/img/pkmn/172.png" title="Pichu"'},
{ img: 'src="/assets/img/pkmn/175.png" title="Togepi"'},
{ img: 'src="/assets/img/pkmn/176.png" title="Togetic"'},
{ img: 'src="/assets/img/pkmn/177.png" title="Natu"'},
{ img: 'src="/assets/img/pkmn/178.png" title="Xatu"'},
{ img: 'src="/assets/img/pkmn/179.png" title="Mareep"'},
{ img: 'src="/assets/img/pkmn/180.png" title="Flaaffy"'},
{ img: 'src="/assets/img/pkmn/181.png" title="Ampharos"'},
{ img: 'src="/assets/img/pkmn/182.png" title="Bellossom"'},
{ img: 'src="/assets/img/pkmn/183.png" title="Marill"'},
{ img: 'src="/assets/img/pkmn/184.png" title="Azumarill"'},
{ img: 'src="/assets/img/pkmn/187.png" title="Hoppip"'},
{ img: 'src="/assets/img/pkmn/190.png" title="Aipom"'},
{ img: 'src="/assets/img/pkmn/194.png" title="Wooper"'},
{ img: 'src="/assets/img/pkmn/195.png" title="Quagsire"'},
{ img: 'src="/assets/img/pkmn/196.png" title="Espeon"'},
{ img: 'src="/assets/img/pkmn/197.png" title="Umbreon"'},
{ img: 'src="/assets/img/pkmn/198.png" title="Murkrow"'},
{ img: 'src="/assets/img/pkmn/200.png" title="Misdreavus"'},
{ img: 'src="/assets/img/pkmn/202.png" title="Girafarig"'},
{ img: 'src="/assets/img/pkmn/203.png" title="Wobbuffet"'},
{ img: 'src="/assets/img/pkmn/206.png" title="Dunsparce"'},
{ img: 'src="/assets/img/pkmn/212.png" title="Scizor"'},
{ img: 'src="/assets/img/pkmn/213.png" title="Shuckle"'},
{ img: 'src="/assets/img/pkmn/215.png" title="Sneasel"'},
{ img: 'src="/assets/img/pkmn/216.png" title="Teddiursa"'},
{ img: 'src="/assets/img/pkmn/218.png" title="Slugma"'},
{ img: 'src="/assets/img/pkmn/222.png" title="Corsola"'},
{ img: 'src="/assets/img/pkmn/225.png" title="Delibird"'},
{ img: 'src="/assets/img/pkmn/227.png" title="Skarmory"'},
{ img: 'src="/assets/img/pkmn/228.png" title="Houndour"'},
{ img: 'src="/assets/img/pkmn/229.png" title="Houndoom"'},
{ img: 'src="/assets/img/pkmn/231.png" title="Phanpy"'},
{ img: 'src="/assets/img/pkmn/233.png" title="Porygon2"'},
{ img: 'src="/assets/img/pkmn/235.png" title="Smeargle"'},
{ img: 'src="/assets/img/pkmn/241.png" title="Miltank"'},
{ img: 'src="/assets/img/pkmn/245.png" title="Suicune"'},
{ img: 'src="/assets/img/pkmn/248.png" title="Tyranitar"'},
{ img: 'src="/assets/img/pkmn/249.png" title="Lugia"'},
{ img: 'src="/assets/img/pkmn/250.png" title="Ho-oh"'},
{ img: 'src="/assets/img/pkmn/251.png" title="Celebi"'},
{ img: 'src="/assets/img/pkmn/252.png" title="Treecko"'},
{ img: 'src="/assets/img/pkmn/253.png" title="Grovyle"'},
{ img: 'src="/assets/img/pkmn/254.png" title="Sceptile"'},
{ img: 'src="/assets/img/pkmn/255.png" title="Torchic"'},
{ img: 'src="/assets/img/pkmn/257.png" title="Blaziken"'},
{ img: 'src="/assets/img/pkmn/258.png" title="Mudkip"'},
{ img: 'src="/assets/img/pkmn/260.png" title="Swampert"'},
{ img: 'src="/assets/img/pkmn/261.png" title="Poochyena"'},
{ img: 'src="/assets/img/pkmn/262.png" title="Mightyena"'},
{ img: 'src="/assets/img/pkmn/263.png" title="Zigzagoon"'},
{ img: 'src="/assets/img/pkmn/265.png" title="Wurmple"'},
{ img: 'src="/assets/img/pkmn/274.png" title="Nuzleaf"'},
{ img: 'src="/assets/img/pkmn/280.png" title="Ralts"'},
{ img: 'src="/assets/img/pkmn/281.png" title="Kirlia"'},
{ img: 'src="/assets/img/pkmn/282.png" title="Gardevoir"'},
{ img: 'src="/assets/img/pkmn/286.png" title="Breloom"'},
{ img: 'src="/assets/img/pkmn/287.png" title="Slakoth"'},
{ img: 'src="/assets/img/pkmn/298.png" title="Azurill"'},
{ img: 'src="/assets/img/pkmn/300.png" title="Skitty"'},
{ img: 'src="/assets/img/pkmn/301.png" title="Delcatty"'},
{ img: 'src="/assets/img/pkmn/302.png" title="Sableye"'},
{ img: 'src="/assets/img/pkmn/303.png" title="Mawile"'},
{ img: 'src="/assets/img/pkmn/304.png" title="Aron"'},
{ img: 'src="/assets/img/pkmn/306.png" title="Aggron"'},
{ img: 'src="/assets/img/pkmn/311.png" title="Plusle"'},
{ img: 'src="/assets/img/pkmn/312.png" title="Minun"'},
{ img: 'src="/assets/img/pkmn/315.png" title="Roselia"'},
{ img: 'src="/assets/img/pkmn/322.png" title="Numel"'},
{ img: 'src="/assets/img/pkmn/327.png" title="Spinda"'},
{ img: 'src="/assets/img/pkmn/328.png" title="Trapinch"'},
{ img: 'src="/assets/img/pkmn/329.png" title="Vibrava"'},
{ img: 'src="/assets/img/pkmn/330.png" title="Flygon"'},
{ img: 'src="/assets/img/pkmn/334.png" title="Altaria"'},
{ img: 'src="/assets/img/pkmn/335.png" title="Zangoose"'},
{ img: 'src="/assets/img/pkmn/336.png" title="Seviper"'},
{ img: 'src="/assets/img/pkmn/337.png" title="Lunatone"'},
{ img: 'src="/assets/img/pkmn/338.png" title="Solrock"'},
{ img: 'src="/assets/img/pkmn/350.png" title="Milotic"'},
{ img: 'src="/assets/img/pkmn/352.png" title="Kecleon"'},
{ img: 'src="/assets/img/pkmn/354.png" title="Banette"'},
{ img: 'src="/assets/img/pkmn/359.png" title="Absol"'},
{ img: 'src="/assets/img/pkmn/360.png" title="Wynaut"'},
{ img: 'src="/assets/img/pkmn/363.png" title="Spheal"'},
{ img: 'src="/assets/img/pkmn/373.png" title="Salamence"'},
{ img: 'src="/assets/img/pkmn/380.png" title="Latias"'},
{ img: 'src="/assets/img/pkmn/381.png" title="Latios"'},
{ img: 'src="/assets/img/pkmn/384.png" title="Rayquaza"'},
{ img: 'src="/assets/img/pkmn/385.png" title="Jirachi"'},
{ img: 'src="/assets/img/pkmn/387.png" title="Turtwig"'},
{ img: 'src="/assets/img/pkmn/389.png" title="Torterra"'},
{ img: 'src="/assets/img/pkmn/393.png" title="Piplup"'},
{ img: 'src="/assets/img/pkmn/403.png" title="Shinx"'},
{ img: 'src="/assets/img/pkmn/404.png" title="Luxio"'},
{ img: 'src="/assets/img/pkmn/405.png" title="Luxray"'},
{ img: 'src="/assets/img/pkmn/407.png" title="Roserade"'},
{ img: 'src="/assets/img/pkmn/418.png" title="Buizel"'},
{ img: 'src="/assets/img/pkmn/419.png" title="Floatzel"'},
{ img: 'src="/assets/img/pkmn/423.png" title="Gastrodon"'},
{ img: 'src="/assets/img/pkmn/424.png" title="Ambipom"'},
{ img: 'src="/assets/img/pkmn/427.png" title="Buneary"'},
{ img: 'src="/assets/img/pkmn/428.png" title="Lopunny"'},
{ img: 'src="/assets/img/pkmn/429.png" title="Mismagius"'},
{ img: 'src="/assets/img/pkmn/430.png" title="Honchkrow"'},
{ img: 'src="/assets/img/pkmn/431.png" title="Glameow"'},
{ img: 'src="/assets/img/pkmn/432.png" title="Purugly"'},
{ img: 'src="/assets/img/pkmn/445.png" title="Garchomp"'},
{ img: 'src="/assets/img/pkmn/447.png" title="Riolu"'},
{ img: 'src="/assets/img/pkmn/448.png" title="Lucario"'},
{ img: 'src="/assets/img/pkmn/453.png" title="Croagunk"'},
{ img: 'src="/assets/img/pkmn/461.png" title="Weavile"'},
{ img: 'src="/assets/img/pkmn/468.png" title="Togekiss"'},
{ img: 'src="/assets/img/pkmn/470.png" title="Leafeon"'},
{ img: 'src="/assets/img/pkmn/471.png" title="Glaceon"'},
{ img: 'src="/assets/img/pkmn/474.png" title="Porygon-Z"'},
{ img: 'src="/assets/img/pkmn/475.png" title="Gallade"'},
{ img: 'src="/assets/img/pkmn/478.png" title="Froslass"'},
{ img: 'src="/assets/img/pkmn/480.png" title="Uxie"'},
{ img: 'src="/assets/img/pkmn/481.png" title="Mesprit"'},
{ img: 'src="/assets/img/pkmn/482.png" title="Azelf"'},
{ img: 'src="/assets/img/pkmn/487.png" title="Giratina"'},
{ img: 'src="/assets/img/pkmn/488.png" title="Cresselia"'},
{ img: 'src="/assets/img/pkmn/490.png" title="Manaphy"'},
{ img: 'src="/assets/img/pkmn/492.png" title="Shaymin"'},
{ img: 'src="/assets/img/pkmn/493.png" title="Arceus"'},
{ img: 'src="/assets/img/pkmn/494.png" title="Victini"'},
{ img: 'src="/assets/img/pkmn/495.png" title="Snivy"'},
{ img: 'src="/assets/img/pkmn/496.png" title="Servine"'},
{ img: 'src="/assets/img/pkmn/497.png" title="Serperior"'},
{ img: 'src="/assets/img/pkmn/498.png" title="Tepig"'},
{ img: 'src="/assets/img/pkmn/501.png" title="Oshawott"'},
{ img: 'src="/assets/img/pkmn/502.png" title="Dewott"'},
{ img: 'src="/assets/img/pkmn/503.png" title="Samurott"'},
{ img: 'src="/assets/img/pkmn/509.png" title="Purrloin"'},
{ img: 'src="/assets/img/pkmn/510.png" title="Liepard"'},
{ img: 'src="/assets/img/pkmn/515.png" title="Panpour"'},
{ img: 'src="/assets/img/pkmn/516.png" title="Simipour"'},
{ img: 'src="/assets/img/pkmn/529.png" title="Drilbur"'},
{ img: 'src="/assets/img/pkmn/530.png" title="Excadrill"'},
{ img: 'src="/assets/img/pkmn/531.png" title="Audino"'},
{ img: 'src="/assets/img/pkmn/540.png" title="Sewaddle"'},
{ img: 'src="/assets/img/pkmn/541.png" title="Swadloon"'},
{ img: 'src="/assets/img/pkmn/542.png" title="Leavanny"'},
{ img: 'src="/assets/img/pkmn/545.png" title="Scolipede"'},
{ img: 'src="/assets/img/pkmn/546.png" title="Cottonee"'},
{ img: 'src="/assets/img/pkmn/547.png" title="Whimsicott"'},
{ img: 'src="/assets/img/pkmn/548.png" title="Petilil"'},
{ img: 'src="/assets/img/pkmn/549.png" title="Lilligant"'},
{ img: 'src="/assets/img/pkmn/556.png" title="Maractus"'},
{ img: 'src="/assets/img/pkmn/559.png" title="Scraggy"'},
{ img: 'src="/assets/img/pkmn/560.png" title="Scrafty"'},
{ img: 'src="/assets/img/pkmn/566.png" title="Archen"'},
{ img: 'src="/assets/img/pkmn/567.png" title="Archeops"'},
{ img: 'src="/assets/img/pkmn/570.png" title="Zorua"'},
{ img: 'src="/assets/img/pkmn/571.png" title="Zoroark"'},
{ img: 'src="/assets/img/pkmn/572.png" title="Minccino"'},
{ img: 'src="/assets/img/pkmn/573.png" title="Cinccino"'},
{ img: 'src="/assets/img/pkmn/577.png" title="Solosis"'},
{ img: 'src="/assets/img/pkmn/578.png" title="Duosion"'},
{ img: 'src="/assets/img/pkmn/579.png" title="Reuniclus"'},
{ img: 'src="/assets/img/pkmn/580.png" title="Ducklett"'},
{ img: 'src="/assets/img/pkmn/585.png" title="Deerling"'},
{ img: 'src="/assets/img/pkmn/587.png" title="Emolga"'},
{ img: 'src="/assets/img/pkmn/595.png" title="Joltik"'},
{ img: 'src="/assets/img/pkmn/612.png" title="Haxorus"'},
{ img: 'src="/assets/img/pkmn/616.png" title="Shelmet"'},
{ img: 'src="/assets/img/pkmn/619.png" title="Mienfoo"'},
{ img: 'src="/assets/img/pkmn/620.png" title="Mienshao"'},
{ img: 'src="/assets/img/pkmn/633.png" title="Deino"'},
{ img: 'src="/assets/img/pkmn/634.png" title="Zweilous"'},
{ img: 'src="/assets/img/pkmn/637.png" title="Volcarona"'},
{ img: 'src="/assets/img/pkmn/638.png" title="Cobalion"'},
{ img: 'src="/assets/img/pkmn/640.png" title="Virizion"'},
{ img: 'src="/assets/img/pkmn/643.png" title="Reshiram"'},
{ img: 'src="/assets/img/pkmn/644.png" title="Zekrom"'},
{ img: 'src="/assets/img/pkmn/647.png" title="Keldeo"'},
{ img: 'src="/assets/img/pkmn/648.png" title="Meloetta"'},
{ img: 'src="/assets/img/pkmn/3-mega.png" title="Mega Venusaur"'},
{ img: 'src="/assets/img/pkmn/6-mega-x.png" title="Mega Charizard X"'},
{ img: 'src="/assets/img/pkmn/6-mega-y.png" title="Mega Charizard Y"'},
{ img: 'src="/assets/img/pkmn/9-mega.png" title="Mega Blastoise"'},
{ img: 'src="/assets/img/pkmn/15-mega.png" title="Mega Beedrill"'},
{ img: 'src="/assets/img/pkmn/115-mega.png" title="Mega Kangaskhan"'},
{ img: 'src="/assets/img/pkmn/150-mega-x.png" title="Mega Mewtwo X"'},
{ img: 'src="/assets/img/pkmn/150-mega-y.png" title="Mega Mewtwo Y"'},
{ img: 'src="/assets/img/pkmn/181-mega.png" title="Mega Ampharos"'},
{ img: 'src="/assets/img/pkmn/212-mega.png" title="Mega Scizor"'},
{ img: 'src="/assets/img/pkmn/229-mega.png" title="Mega Houndoom"'},
{ img: 'src="/assets/img/pkmn/248-mega.png" title="Mega Tyranitar"'},
{ img: 'src="/assets/img/pkmn/254-mega.png" title="Mega Sceptile"'},
{ img: 'src="/assets/img/pkmn/257-mega.png" title="Mega Blaziken"'},
{ img: 'src="/assets/img/pkmn/260-mega.png" title="Mega Swampert"'},
{ img: 'src="/assets/img/pkmn/282-mega.png" title="Mega Gardevoir"'},
{ img: 'src="/assets/img/pkmn/302-mega.png" title="Mega Sableye"'},
{ img: 'src="/assets/img/pkmn/306-mega.png" title="Mega Aggron"'},
{ img: 'src="/assets/img/pkmn/334-mega.png" title="Mega Altaria"'},
{ img: 'src="/assets/img/pkmn/354-mega.png" title="Mega Banette"'},
{ img: 'src="/assets/img/pkmn/359-mega.png" title="Mega Absol"'},
{ img: 'src="/assets/img/pkmn/373-mega.png" title="Mega Salamence"'},
{ img: 'src="/assets/img/pkmn/428-mega.png" title="Mega Lopunny"'},
{ img: 'src="/assets/img/pkmn/445-mega.png" title="Mega Garchomp"'},
{ img: 'src="/assets/img/pkmn/448-mega.png" title="Mega Lucario"'},
{ img: 'src="/assets/img/pkmn/475-mega.png" title="Mega Gallade"'},
{ img: 'src="/assets/img/pkmn/531-mega.png" title="Mega Audino"'},
{ img: 'src="/assets/img/pkmn/650.png" title="Chespin"'},
{ img: 'src="/assets/img/pkmn/651.png" title="Quilladin"'},
{ img: 'src="/assets/img/pkmn/652.png" title="Chesnaught"'},
{ img: 'src="/assets/img/pkmn/653.png" title="Fennekin"'},
{ img: 'src="/assets/img/pkmn/654.png" title="Braixen"'},
{ img: 'src="/assets/img/pkmn/655.png" title="Delphox"'},
{ img: 'src="/assets/img/pkmn/656.png" title="Froakie"'},
{ img: 'src="/assets/img/pkmn/657.png" title="Frogadier"'},
{ img: 'src="/assets/img/pkmn/658.png" title="Greninja"'},
{ img: 'src="/assets/img/pkmn/674.png" title="Pancham"'},
{ img: 'src="/assets/img/pkmn/676.png" title="Furfrou"'},
{ img: 'src="/assets/img/pkmn/677.png" title="Espurr"'},
{ img: 'src="/assets/img/pkmn/678-male.png" title="Meowstic (Male)"'},
{ img: 'src="/assets/img/pkmn/678-female.png" title="Meowstic (Female)"'},
{ img: 'src="/assets/img/pkmn/694.png" title="Helioptile"'},
{ img: 'src="/assets/img/pkmn/695.png" title="Heliolisk"'},
{ img: 'src="/assets/img/pkmn/699.png" title="Aurorus"'},
{ img: 'src="/assets/img/pkmn/700.png" title="Sylveon"'},
{ img: 'src="/assets/img/pkmn/701.png" title="Hawlucha"'},
{ img: 'src="/assets/img/pkmn/704.png" title="Goomy"'},
{ img: 'src="/assets/img/pkmn/705.png" title="Sliggoo"'},
{ img: 'src="/assets/img/pkmn/706.png" title="Goodra"'},
{ img: 'src="/assets/img/pkmn/708.png" title="Phantump"'},
{ img: 'src="/assets/img/pkmn/714.png" title="Noibat"'},
{ img: 'src="/assets/img/pkmn/715.png" title="Noivern"'},
{ img: 'src="/assets/img/pkmn/716.png" title="Xerneas"'},
{ img: 'src="/assets/img/pkmn/717.png" title="Yveltal"'},
{ img: 'src="/assets/img/pkmn/722.png" title="Rowlet"'},
{ img: 'src="/assets/img/pkmn/723.png" title="Dartrix"'},
{ img: 'src="/assets/img/pkmn/724.png" title="Decidueye"'},
{ img: 'src="/assets/img/pkmn/725.png" title="Litten"'},
{ img: 'src="/assets/img/pkmn/726.png" title="Torracat"'},
{ img: 'src="/assets/img/pkmn/728.png" title="Popplio"'},
{ img: 'src="/assets/img/pkmn/729.png" title="Brionne"'},
{ img: 'src="/assets/img/pkmn/730.png" title="Primarina"'},
{ img: 'src="/assets/img/pkmn/731.png" title="Pikipek"'},
{ img: 'src="/assets/img/pkmn/743.png" title="Ribombee"'},
{ img: 'src="/assets/img/pkmn/744.png" title="Rockruff"'},
{ img: 'src="/assets/img/pkmn/745.png" title="Lycanroc"'},
{ img: 'src="/assets/img/pkmn/745-dusk.png" title="Lycanroc (Dusk Form)"'},
{ img: 'src="/assets/img/pkmn/745-midnight.png" title="Lycanroc (Midnight Form)"'},
{ img: 'src="/assets/img/pkmn/747.png" title="Mareanie"'},
{ img: 'src="/assets/img/pkmn/748.png" title="Toxapex"'},
{ img: 'src="/assets/img/pkmn/753.png" title="Fomantis"'},
{ img: 'src="/assets/img/pkmn/754.png" title="Lurantis"'},
{ img: 'src="/assets/img/pkmn/757.png" title="Salandit"'},
{ img: 'src="/assets/img/pkmn/758.png" title="Salazzle"'},
{ img: 'src="/assets/img/pkmn/759.png" title="Stufful"'},
{ img: 'src="/assets/img/pkmn/760.png" title="Bewear"'},
{ img: 'src="/assets/img/pkmn/762.png" title="Steenee"'},
{ img: 'src="/assets/img/pkmn/763.png" title="Tsareena"'},
{ img: 'src="/assets/img/pkmn/771.png" title="Pyukumuku"'},
{ img: 'src="/assets/img/pkmn/775.png" title="Komala"'},
{ img: 'src="/assets/img/pkmn/778.png" title="Mimikyu"'},
{ img: 'src="/assets/img/pkmn/782.png" title="Jangmo-o"'},
{ img: 'src="/assets/img/pkmn/784.png" title="Kommo-o"'},
{ img: 'src="/assets/img/pkmn/786.png" title="Tapu Lele"'},
{ img: 'src="/assets/img/pkmn/789.png" title="Cosmog"'},
{ img: 'src="/assets/img/pkmn/791.png" title="Solgaleo"'},
{ img: 'src="/assets/img/pkmn/792.png" title="Lunala"'},
{ img: 'src="/assets/img/pkmn/797.png" title="Celesteela"'},
{ img: 'src="/assets/img/pkmn/802.png" title="Marshadow"'},
{ img: 'src="/assets/img/pkmn/803.png" title="Poipole"'},
{ img: 'src="/assets/img/pkmn/807.png" title="Zeraora"'},
{ img: 'src="/assets/img/pkmn/810.png" title="Grookey"'},
{ img: 'src="/assets/img/pkmn/813.png" title="Scorbunny"'},
{ img: 'src="/assets/img/pkmn/814.png" title="Raboot"'},
{ img: 'src="/assets/img/pkmn/815.png" title="Cinderace"'},
{ img: 'src="/assets/img/pkmn/816.png" title="Sobble"'},
{ img: 'src="/assets/img/pkmn/817.png" title="Drizzile"'},
{ img: 'src="/assets/img/pkmn/818.png" title="Inteleon"'},
{ img: 'src="/assets/img/pkmn/823.png" title="Corviknight"'},
{ img: 'src="/assets/img/pkmn/827.png" title="Nickit"'},
{ img: 'src="/assets/img/pkmn/828.png" title="Thievul"'},
{ img: 'src="/assets/img/pkmn/831.png" title="Wooloo"'},
{ img: 'src="/assets/img/pkmn/835.png" title="Yamper"'},
{ img: 'src="/assets/img/pkmn/858.png" title="Hatterene"'},
{ img: 'src="/assets/img/pkmn/859.png" title="Impidimp"'},
{ img: 'src="/assets/img/pkmn/862.png" title="Obstagoon"'},
{ img: 'src="/assets/img/pkmn/869.png" title="Alcremie"'},
{ img: 'src="/assets/img/pkmn/870.png" title="Falinks"'},
{ img: 'src="/assets/img/pkmn/872.png" title="Snom"'},
{ img: 'src="/assets/img/pkmn/876-male.png" title="Indeedee (Male)"'},
{ img: 'src="/assets/img/pkmn/876-female.png" title="Indeedee (Female)"'},
{ img: 'src="/assets/img/pkmn/887.png" title="Dragapult"'}
];
var unique = [...new Set(pkmn)];
for (var i = 0; i < 6; i++) {
document.write("<img "+ unique[Math.floor(pkmn.length*Math.random())]+">");
function getRandomUniquePkmn(pkmnArray, count) {
const uniquePkmn = new Set();
const totalPkmn = pkmnArray.length;
while (uniquePkmn.size < count && uniquePkmn.size < totalPkmn) {
const randomIndex = Math.floor(Math.random() * totalPkmn);
uniquePkmn.add(pkmnArray[randomIndex]);
}
return Array.from(uniquePkmn).slice(0, count);
}
const party = getRandomUniquePkmn(favorites, 6);
party.forEach(pkmnData => {
const imgElement = document.createElement("img");
const imgAttributes = pkmnData.img.match(/src="([^"]+)"/);
imgElement.src = imgAttributes[1];
imgElement.title = pkmnData.img.match(/title="([^"]+)"/)[1];
document.getElementById("pkmn").appendChild(imgElement);
imgElement.addEventListener("mouseover", () => {
let select = document.createElement("audio");
select.src = ("/assets/audio/select.ogg");
select.play();
});
});

View file

@ -1,10 +1,12 @@
---
images:
- src: /assets/img/art/petscii_sundae1.png
alt: Front-facing bust portrait of Sundae drawn in PETSCII (bitmap/text mode artwork). His hair looks a bit ruffled up.
alt: Front-facing bust portrait of Sundae. His hair looks a bit ruffled up.
width: 240
date: 2023-02-26
- src: /assets/img/art/petscii_sundae-redo1.png
alt: Revisioned front-facing bust portrait of Sundae. He looks closer in style to his reference/model sheet.
alt: Revisioned front-facing bust portrait of Sundae, with shinier hair.
width: 240
date: 2023-04-14
---

View file

@ -1,19 +1,24 @@
---
images:
- src: /assets/img/art/acnl_sundae.png
alt: Bust portrait of Sundae smiling at the viewer with his eyes closed, silhouette outlined with the colors of the rainbow and then a white outline around.
alt: Bust portrait of Sundae smiling at the viewer with his eyes closed, outlined in rainbow colors and a secondary white outline around that.
date: 2021-09-09
width: 320
- src: /assets/img/art/acnl_sundae-redo1.png
alt: Revisioned bust portrait of Sundae, smiling at the viewer with his eyes closed, superimposed on a rainbow flag background.
alt: Revisioned bust portrait of Sundae, smiling at the viewer with his eyes closed, superimposed on the rainbow pride flag.
date: 2022-01-01
width: 320
- src: /assets/img/art/acnl_sundae-redo2.png
alt: hi
alt: Latest revision with the view from the front, superimposed on the Agender pride flag.
date: 2024-10-28
width: 320
---
Originally a town flag design for my Animal Crossing New Leaf town.
![Rainbow pride flag](/assets/img/flag/rainbow.svg)
![Agender pride flag](/assets/img/flag/agender.svg)
<figure><img src="/assets/img/blog/acnl_town.png"><figcaption>In-game screenshot of my town hall's flag.</figcaption></figure>
Originally made to be used as a town flag design for my Animal Crossing New Leaf town.
I used these as avatars for a while.
<section><a href="/assets/img/blog/acnl_town.png"><figure><img src="/assets/img/blog/acnl_town.png"><figcaption>In-game screenshot of my town hall's flag.</figcaption></figure></a></section>

View file

@ -5,6 +5,4 @@ images:
date: 2021-12-24
---
This was supposed to be a full-length portrait of sundae's dragon form, but I had difficulty figuring out perspective, drawing dragon wings and ultimately got frustrated.
I did draw his entire body, but it had some issues, coupled with the ones above.
This was supposed to be a full-length portrait of Sundae's dragon form, but I had difficulty figuring out perspective, drawing dragon wings and ultimately got frustrated.

View file

@ -1,7 +1,7 @@
---
images:
- src: /assets/img/art/sundae_lick.gif
alt: Pixel art animation of Sundae licking the screen
alt: Pixel art animation of Sundae licking the screen.
date: 2025-03-18
width: 480
---

View file

@ -8,7 +8,8 @@ images:
date: 2022-11-20
---
![Pansexual pride flag](/assets/img/flag/pansexual.svg)
First done in {%ai"https://www.clipstudio.net/en/"%}Clip Studio Paint{%endai%}, but I eventually settled on {%ai"https://krita.org/en/"%}Krita{%endai%} and re-drew him there.
The scope of this was originally much large. It would've been a huge undertaking to re-do the background for it, which is why I re-purposed it for pride month.
![Pansexual pride flag](/assets/img/flag/pansexual.svg)

View file

@ -5,7 +5,8 @@ images:
date: 2020-05-06
---
The first doodle of the boy, done in MS Paint.
The first doodle of the boy, done in Microsoft Paint.
**(?)** I'm not sure when I actually made this, again due to lack of chat logs and file dates.
The earliest I could point to is during 2020, when I made a secondary youtube channel to upload [Cave Story's soundtracks](https://youtube.com/@fosstracks/videos), since at the time, there weren't any great uploads.
I'm not sure when I actually made this, due to lack of chat logs and file dates being wiped.
The earliest I could point to is during 2020, when I made a secondary youtube channel to upload {%ai"https://youtube.com/@fosstracks/videos"%}Cave Story's soundtracks{%endai%}, since at the time, there weren't any great uploads.

View file

@ -1,6 +1,8 @@
---
images:
- src: /assets/img/art/sundae_headpat.png
alt: Half-length portrait of Sundae done in MS Paint. He's getting a head pat from a disembodied white hand.
alt: Half-length portrait of Sundae. He's getting a head pat from a disembodied white hand.
date: 2021-11-18
---
Done in Microsoft Paint.

View file

@ -5,6 +5,8 @@ images:
date: 2023-09-01
---
![Transgender pride flag](/assets/img/flag/trans.svg)
Made using {%ai"https://lvllvl.com/"%}lvllvl{%endai%}'s vector mode, with the "modular shapes" vector set.
A character that I first made in ROBLOX.
@ -13,6 +15,5 @@ They're unnamed, because I haven't done much with them outside of this artwork.
Although, I was surprised how cute I could make an avatar that's not restricted to the default square body that I've been accustomed to for a decade.
Color palette used: {%ai"https://lospec.com/palette-list/cs112-v2"%}CS112-V2{%endai%}
![Transgender pride flag](/assets/img/flag/trans.svg)
<figure><img src="/assets/img/blog/bun.png"><figcaption>Reference screenshot the bunny</figcaption></figure>
<section><a href="/assets/img/blog/bun.png"><figure><img src="/assets/img/blog/bun.png"><figcaption>Reference screenshot of the avatar</figcaption></figure></a></section>

View file

@ -1,7 +1,7 @@
---
images:
- src: /assets/img/art/petscii_kass.png
alt: Side portrait PETSCII artwork of Kass from The Legend of Zelda Breath of the Wild.
alt: Side portrait of Kass from The Legend of Zelda Breath of the Wild.
date: 2023-02-23
---
@ -9,4 +9,4 @@ A PETSCII rendition of a screenshot that I took in The Legend of Zelda: Breath o
Color palette used: {%ai"https://lospec.com/palette-list/new-worlds-46"%}New Worlds 46{%endai%}
<figure><img src="/assets/img/blog/kass.jpg"><figcaption>Reference screenshot of Kass that I took in Breath of the Wild</figcaption></figure>
<section><a href="/assets/img/blog/kass.jpg"><figure><img src="/assets/img/blog/kass.jpg"><figcaption>In-game screenshot of Kass that I took as reference.</figcaption></figure></a></section>

View file

@ -1,7 +1,7 @@
---
images:
- src: /assets/img/art/petscii_sue.png
alt: PETSCII artwork of Sue Sakamoto from Cave Story. The view is from behind them, sitting, looking out from the Outer Wall.
alt: Sue Sakamoto from Cave Story sitting and looking out from the Outer Wall.
date: 2023-01-16
---

View file

@ -1,6 +1,8 @@
---
images:
- src: /assets/img/art/klonoa_sitting.png
alt: Klonoa done in MS Paint, drawn from the side. He's sitting on a ledge, with a hand on his knee and a leg dangling from the viewer's side.
alt: Klonoa sitting on a ledge, with a hand on his knee and right leg dangling from the viewer's side.
date: 2021-11-18
---
Done in Microsoft Paint.

View file

@ -5,6 +5,10 @@ modified: 2025-05-23
blurb: <p>Invalid DateTime. ha, got you.</p>
avatar: /assets/img/art/sundae_glistening.png
---
### {{page.fileSlug}}
<time datetime="{{date|ISO}}">{{date|readable}}</time>
<p aria-label="Post warning">WARNING: BORING NERD TOPIC AHOY</p>
I had mentioned on my Neocities profile that I would look into re-writing my website fairly soon right after pushing an update out. Took a bit longer than I would've liked honestly, but it's here!

View file

@ -5,6 +5,8 @@ modified: 2025-05-23
blurb: <p>i hate luxon</p><p><img src="/assets/img/blog/luxon.png"></p>
avatar: /assets/img/art/sundae_glistening.png
---
### {{page.fileSlug}}
<time datetime="{{date|ISO}}">{{date|readable}}</time>
Hi... I spent a good 8+ months not working on much of anything, really.
@ -37,4 +39,7 @@ eleventyConfig.addFilter("readable", (dateObj) => {
I decided to change the presentation of my [interests](/home#interests), previously a shelf with game cases and CD jewel cases, to instead be desktop shortcut entries.
<section><figure><img src="/assets/img/blog/shelf.png"><figcaption>How the shelving featuring my personal favorite games and music looked before.</figcaption></figure><figure><img src="/assets/img/blog/media.png"><figcaption>How it looks now.</figcaption></figure></section>
If you'd like to implement this yourself, you can find the source files in the [old branch](https://bunsin.space/forgejo/sundae/website/src/branch/old)
<section><a href="/assets/img/blog/shelf.png"><figure><img src="/assets/img/blog/shelf.png"><figcaption>How the shelving featuring my personal favorite games and music looked before.</figcaption></figure></a>
<a href="/assets/img/blog/media.png"><figure><img src="/assets/img/blog/media.png"><figcaption>How it looks now.<br>Note: the cut-off in the middle is meant to showcase the light and dark theme.</figcaption></figure></a></section>

View file

@ -5,11 +5,14 @@ modified: 2025-05-19
blurb: <p><img src="/assets/img/blog/works-on-my-machine.png"></p><p>whatever i'm using might not necessarily work for you</p>
avatar: /assets/img/art/sundae_glistening.png
---
### {{page.fileSlug}}
<time datetime="{{date|ISO}}">{{date|readable}}</time>
<section aria-label="Addendum"><p>EDIT:<time datetime="{{modified | ISO}}">{{modified | readable}}</time></p>
With Microsoft announcing that {%ai"https://support.microsoft.com/en-us/windows/windows-10-support-ends-on-october-14-2025-2ca8b313-1946-43d3-b55c-2b95b107f281"%}Windows 10 will stop being supported after October 14, 2025{%endai%}, I highly recommend looking into Linux if your device is on Windows 10 and you don't want to buy a whole new device that meets the system requirements of 11.
Here's {%ai"https://endof10.org/"%}a resource for that{%endai%} if you aren't sure how to proceed.
Here's {%ai"https://kde.org/for/w10-exiles/"%}a handy resource{%endai%} if you aren't sure how to proceed.
I'm not paid or anything to mention this, I just think **we shouldn't have to put up with capitalist bullshit to continue using a device.**
</section>
@ -25,7 +28,7 @@ My main "worries" and/or misconceptions before getting into it were:
<section>
<p style="background-image: linear-gradient(to right, currentColor, transparent 40ch);background-clip: text;-webkit-background-clip: text;text-fill-color: transparent;-webkit-text-fill-color: transparent; width: max-content;">I had grown tired of Windows and Microsoft as a whole yada yada—</p>
<div style="background: linear-gradient(to right, #d005, #fc2);background-clip: border-box;margin: -3ch auto 0 15ch;background-clip: text;color: transparent;width: max-content;" aria-hidden="true"><sub style="font-size: 1rem;transform: rotate(-2deg);display: inline-flex;">blah blah blah</sub>Microsoft<sup style="font-size: 1rem;transform: rotate(2deg);display: inline-flex;">yada yada</sup><b style="color: darkorange;margin: -0.6rem 0;font-size: 1.5rem;text-shadow: 5px 5px 0 #ff8c004f, 10px 10px 0 #ff8c004f;">SNORE</b></div>
<div style="background: linear-gradient(to right,transparent, orange 8ch);margin: -3ch auto 0 15ch;background-clip: text;color: transparent;width: max-content;" aria-hidden="true"><sub style="font-size: 1rem;transform: rotate(-2deg);display: inline-flex;">blah blah blah</sub>Microsoft<sup style="font-size: 1rem;transform: rotate(2deg);display: inline-flex;">yada yada</sup><b style="color: orange;margin: -0.6rem 0;font-size: 1.5rem;text-shadow: 5px 5px 0 color-mix(in lch,currentColor, transparent 60%), 10px 10px 0 color-mix(in lch,currentColor, transparent 70%)">SNORE</b></div>
</section>
**You've most likely heard this sentiment before, and no, I'm not any more special with my reasoning.**

View file

@ -1,5 +1,5 @@
![](/assets/img/changelog/ver1.png)
* Changed backgrounds
* New vector icon of Sundae as the inner background
* New vector icon of Sunny as the inner background
* Orange-yellow radial gradient for the outer background

View file

@ -13,7 +13,7 @@ Read the [accompanying blog post](/blog/rewrite-2.0)
* Headers are now consistent with blog post headers
* Fixed the Pokemon box cutting off at lower resolutions
* Changed sidebar
* Sunny is sitting there, now
* Sunny is there again, sitting this time.
* Changed [Blog](/blog)
* Fixed header links not working in blog posts
* Added functionality for blog-specific avatars and image attachments to the postscript blurb

View file

@ -15,7 +15,7 @@ icon: "M12 20 L12 30 4 30 4 12 16 2 28 12 28 30 20 30 20 20 Z"
{% for item in games.items %}
<li>
<a href="{{item.src}}">
<div><img src="{{item.cover}}" alt="Box art cover for {{item.title}}"></div>
<div><img src="{{item.cover}}" alt="Game icon for {{item.title}}"></div>
<span>{{item.title}}</span>
</a>
</li>
@ -48,15 +48,6 @@ icon: "M12 20 L12 30 4 30 4 12 16 2 28 12 28 30 20 30 20 20 Z"
</li>
{% endfor %}
</ul>
<h3>Others</h3>
<ul>
{% for item in 88x31-others.items %}
<li>
<a href="{{item.src}}" title="{{item.name}}"><img {%if item.id%}id="{{item.id}}" {%endif%}
src="{{item.button}}" alt="{{item.alt}}"></a>
</li>
{% endfor %}
</ul>
<h3>Critters!</h3>
<ul>
{% for item in 88x31-critters.items %}
@ -65,8 +56,18 @@ icon: "M12 20 L12 30 4 30 4 12 16 2 28 12 28 30 20 30 20 20 Z"
src="{{item.button}}" alt="{{item.alt}}"></a>
</li>
{% endfor %}
</ul>
<h3>Fun!</h3>
<ul>
{% for item in 88x31.items %}
<li>
<a href="{{item.src}}" title="{{item.name}}"><img {%if item.id%}id="{{item.id}}" {%endif%}
src="{{item.button}}" alt="{{item.alt}}"></a>
</li>
{% endfor %}
<script src="/assets/js/cat.js"></script>
<script src="/assets/js/fox.js"></script>
<script src="/assets/js/bob.js"></script>
</ul>
</nav>
<div id="pkmn" aria-label="Randomized list of my favorite Pokémon"><script src="/assets/js/poke.js"></script></div>