Juniper's Knot Fanpage
This is fake homepage for Juniper's Knot a visual novel by Dischan. This is just me practising two things: designing a one-page landing website, and coding it by hand with nothing but the most vanilla of tools. No frameworks, not preprocessor, nothing. Only pure HTML/CSS/JS in a text editor.
This took about two days, which was a colossal waste of time. I realise now why nobody wants to code website from the grounds up by hand anymore. But, eh, at least I got some practice out of it?
This is my first real try at working with CSS Grid. CSS Grid is a trap. 9 times out of 10, you're better off using Flexbox.
JavaScript is used for a small animation and so that when you click on a screenshot thumbnail, the full-size screenshot will pop up. The website should still look fine with JS disabled.
You can see the page live here.