My first step in creating this project was to make as close a copy as I could of the example provided (visible in "target-images"). I found myself fairly confident throughout that stage. I found myself using divs more than I had in previous projects, in order to more efficiently manipulate the page layout using Flex. I've also primarily used classes, only using id's for sections on the page that I want to be able to link to in the header. I'm still not entirely sure when to use one over the other.
Links are now functional as anchor tags, and although buttons don't do anything, they change to a pointer and invert colours on hover. I've also updated the colour palette - I tried to create my own, but failed to find a result I liked. In the end, I edited the hue, brightness, and saturation of the existing colour palette using an online tool. I thought about adding a favicon, but couldn't think of what might work, so left it blank in the end.
I read about a way to fix anchor links with a fixed navbar - to add padding on top, and then a negative margin of the same amount. The negative margin on #information
didn't actually seem to change anything visible on the page, but adding some padding at the top stopped the navbar from hiding the section header, and didn't look out of place on the page as a whole, so I left it in.
- Image of knitting needles by Cottonbro
- Image of knitted jumpers by Daris Shevtsova
- Image of yarn stacked on a chair by Pavel Danilyuk
- Image of tweed yarn by Skylar Kang
- Image of different coloured yarn in a basket by Surene Palvie
All images taken from Pexels.