wip figures and images
This commit is contained in:
parent
ea235120f8
commit
c6bac45ecf
61 changed files with 1491 additions and 1315 deletions
Binary file not shown.
BIN
_src/assets/audio/anvil_land_low.ogg
Normal file
BIN
_src/assets/audio/anvil_land_low.ogg
Normal file
Binary file not shown.
BIN
_src/assets/audio/bob.ogg
Normal file
BIN
_src/assets/audio/bob.ogg
Normal file
Binary file not shown.
BIN
_src/assets/audio/select.ogg
Normal file
BIN
_src/assets/audio/select.ogg
Normal file
Binary file not shown.
|
|
@ -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);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
|
||||
& p {
|
||||
margin: 1rem 0;
|
||||
& a {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
& s {
|
||||
text-decoration-style: line-through;
|
||||
text-decoration-thickness: 0.1em;
|
||||
}
|
||||
|
||||
& ul {
|
||||
& li {
|
||||
margin: 0;
|
||||
|
||||
& p {
|
||||
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%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
& figure {
|
||||
& time {
|
||||
display: flex;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
& section:has(a:nth-child(n + 2)) {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: var(--pad-l);
|
||||
}
|
||||
& section {
|
||||
margin: var(--pad-l) 0;
|
||||
& a {
|
||||
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;
|
||||
}
|
||||
display: flex;
|
||||
height: max-content;
|
||||
text-decoration: none;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
& time {
|
||||
display: flex;
|
||||
font-weight: bold;
|
||||
}
|
||||
& a {
|
||||
max-width: var(--post);
|
||||
width: fit-content;
|
||||
& 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;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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,12 +27,14 @@
|
|||
border-top-color: #c8f8c0;
|
||||
border-width: 3px;
|
||||
border-style: solid;
|
||||
|
||||
& img: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;
|
||||
& 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 {
|
||||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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
74
_src/assets/css/nav.css
Normal 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);
|
||||
}
|
||||
}
|
||||
}
|
||||
175
_src/assets/css/theme-dark.css
Normal file
175
_src/assets/css/theme-dark.css
Normal 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%);
|
||||
}
|
||||
}
|
||||
}
|
||||
176
_src/assets/css/theme-light.css
Normal file
176
_src/assets/css/theme-light.css
Normal 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%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -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 |
Binary file not shown.
|
Before Width: | Height: | Size: 311 B After Width: | Height: | Size: 413 B |
BIN
_src/assets/img/button/no-ones-around-to-help.gif
Normal file
BIN
_src/assets/img/button/no-ones-around-to-help.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 82 KiB |
7
_src/assets/img/flag/agender.svg
Normal file
7
_src/assets/img/flag/agender.svg
Normal 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 |
8
_src/assets/img/flag/aromantic.svg
Normal file
8
_src/assets/img/flag/aromantic.svg
Normal 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 |
7
_src/assets/img/flag/asexual.svg
Normal file
7
_src/assets/img/flag/asexual.svg
Normal 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 |
7
_src/assets/img/flag/demisexual.svg
Normal file
7
_src/assets/img/flag/demisexual.svg
Normal 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 |
7
_src/assets/img/flag/nonbinary.svg
Normal file
7
_src/assets/img/flag/nonbinary.svg
Normal 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 |
6
_src/assets/img/flag/pansexual.svg
Normal file
6
_src/assets/img/flag/pansexual.svg
Normal 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 |
9
_src/assets/img/flag/rainbow.svg
Normal file
9
_src/assets/img/flag/rainbow.svg
Normal 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 |
6
_src/assets/img/flag/trans.svg
Normal file
6
_src/assets/img/flag/trans.svg
Normal 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 |
BIN
_src/assets/img/media/games/hl1.png
Normal file
BIN
_src/assets/img/media/games/hl1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
BIN
_src/assets/img/media/games/hl2.png
Normal file
BIN
_src/assets/img/media/games/hl2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.7 KiB |
BIN
_src/assets/img/media/games/minecraft.png
Normal file
BIN
_src/assets/img/media/games/minecraft.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.7 KiB |
BIN
_src/assets/img/media/games/roblox.png
Normal file
BIN
_src/assets/img/media/games/roblox.png
Normal file
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 |
3
_src/assets/img/theme/paw.svg
Normal file
3
_src/assets/img/theme/paw.svg
Normal 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
15
_src/assets/js/bob.js
Normal 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;
|
||||
};
|
||||
|
|
@ -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 () {
|
||||
setTimeout(() => {
|
||||
audio.play();
|
||||
}, 1700);
|
||||
}, { once: true });
|
||||
audio.src = "/assets/audio/anvil_land_low.ogg";
|
||||
pipe.appendChild(audio);
|
||||
|
||||
pipe.addEventListener(
|
||||
"mouseover",
|
||||
function () {
|
||||
setTimeout(() => {
|
||||
audio.play();
|
||||
}, 1700);
|
||||
},
|
||||
{ once: true }
|
||||
);
|
||||
|
|
@ -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.appendChild(music);
|
||||
window.addEventListener("load", function () {
|
||||
music.play();
|
||||
music.muted = true;
|
||||
});
|
||||
fox.onmouseover = () => {
|
||||
music.play();
|
||||
}
|
||||
music.muted = false;
|
||||
};
|
||||
fox.onmouseout = () => {
|
||||
music.pause();
|
||||
music.currentTime = 0;
|
||||
}
|
||||
music.muted = true;
|
||||
};
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
|
|
@ -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();
|
||||
});
|
||||
});
|
||||
Loading…
Add table
Add a link
Reference in a new issue