WhereDidIPutThat

Fixed the scaling/dimensions issue, with the help of a few tutorials and W3Schools guides. I did some of the code on my laptop, that wasn’t logging hackatime so it was definitely longer than half an hour, but I don’t know what exactly, and I don’t really mind missing an hour or so.

But to fix it. the thinga I did was: I replaced all position: absolute; and instead used flex boxs and css grids, as I had been previously using hardcoded pixel offsets and negative margins so stuff overlapped and just looked horrible once the window changed dimensions. I also built flexible containers, just again to fix the distorted shapes on larger windows, . I also then replaced hardcoded pixel heights with flex 1, because without there were empty gaps when on a larger window. Aside from that I then added aspect ratios on media (like the component card photos) so the photos maintained nice, clean porportions.

So now everything is nicely aligned, finally ! But I think I still need to do some work on making it look a little better on larger scaled, however at least everything is scaling properly.

( I’ve linked a few photos showing before and afters )

I scrapped pretty much of all the code I logged previous, Because I couldn’t really settle on a UI. But I finally decided on a colour pallete and got to work. I did a few animations, set up most of the containers, fonts, stylesheet that will be on the front page.

However I do have a few things I need to do directly next:

• [] work on compatibility screen size (somehow forgot that my window wasn’t scaled accurately and this entire version needs really specific window dimensions).

• [] set up tag stylesheet.

• [] add an interface for users to put in components/inventory. (then have that logged in the inventory log).

And much more.

Began working on basic site rules and styles