The Making of kz-n.net 5x

Welcome to kz-n.net 5.2.1

After almost a year of not touching the website at all, I completely remade it in Astro in less than a week.

You may have hinted from this being version 5x that there was version 4x before this, And you would be correct. In fact I took a big portion of that version as a starting base for this, Mostly just the CSS for the blog though, everything else was remade from scratch.

As you can see, I clearly reused the design from my old website, however apart from that the rest is made from scratch.

It all started with me trying to copy the branding I’ve had for a while now, I wanted the website to literally be in the clouds, And that’s the reason behind this background

Initially though, I didn’t know how to make a seamless image and have it repeat infintely with CSS, so I had to zoom it in infinitely which looked garbage,

and zooming in also meant having a seam at some zoom point.

I later realized I could make a seamless image, and I did. Add to that a tremendously big width and height (hidden overflow of course) and a repeating flag and boom. Try zooming or resizing the page, It should remain the same.

Apart from that, I used to use a lot of mix-blend-mode in CSS, that made the effect 10x better cause the text on the page would respond to changes in the background.

Unfortunately that ruined everything that wasn’t text as it was also being mixed with the background, and I found no sane way to get it to work as expected. So for now only the top bar effectively uses it

My favourite part of development has definitely been making the index page, This is heavily inspired by my friend Flint’s website, as I first saw the music playing status on his page.

This is all, it is a pretty simple website, I hope you enjoy it though - lol.

Created Wed, 06 Sep 2023 12:25:10 GMT