hidden50 / pq

Pokemon Quest Pokedex

Pokemon Quest Pokedex (web app)

This project uses minimal build tools, to make forking it as simple as possible. For now, I have opted not to minify the code for that reason as well.

The files in dest/ are plain html, css and js, and can be edited as such.

Splitting the dest folder into a gh-pages branch

# create a local gh-pages branch containing the splitted output folder
git subtree split --prefix dest -b gh-pages

# force the push of the gh-pages branch to the remote gh-pages branch at origin
git push -f origin gh-pages:gh-pages

# delete the local copy of gh-pages
git branch -D gh-pages

Creating the Spritesheet

Unfortunately, the spritesheet (faces-min.png) requires several build tools. Node.js, gulp, and a GraphicsMagick installation to auto-resize the images.

npm install --global gulp-cli
npm install gulp
npm install gulpfile.js

To generate the spritesheet, type gulp faces.

pq's Issues

Down to Help

Hi Hidden50,

I was thinking of working on my own Pokemon Quest website as most of them are either super simple, or ugly, or don't have all the information. Yours is among the best I've seen, and I'd be down to help improve the aesthetic overall and maybe add some more features and improve UX. Let me know if you're interested in this. It wouldn't require any work from you; I'd just improve the website and then make a PR.

Thanks,

Justin

Butterfree has Venonat's image

The image here:
https://hidden50.github.io/pq/faces.min.png
Has two venonat
and on the website, searching butterfree shows:

Zoom Bug on iOS Devices With Search Input

Not sure if you have an issue process for your repo.

There's a small quality of life bug when using the search input on iOS devices, because form elements have a default font-size: 11px in Safari and Chrome, it causes the browser to zoom in when a user enters a value, meaning you have to zoom back out once you've searched for a Pokemon.

input-bug.mp4

A quick fix is to just set the search input font size to 16px to stop this behaviour, I'll create a PR for it.