All solutions

What are you most proud of, and what would you do differently next time?

Simpler CSS Classes - im not sure if this is a specific style but i tried to keep my CSS classes in my html as simple and minimal as possible to make it more useable for repating the code.

What challenges did you encounter, and how did you overcome them?

I found this project quite simple but it was my first time using and it threw me off on google fonts but it seems really simple to use- not sure if i need to read more into it.

What specific areas of your project would you like help with?

I still want to learn more about accessibility- so any feedback on this I would appreciate this

This was the first time I attempted a more advanced JS project. It went well. However, I relied a lot on chatGPT to help me find solutions to my problems! I made sure to understand all the code I was using, though.

I'd love to hear thoughts from anyone on:

• Improving accessibility
• Animation suggestions

I struggled with the layered image element of this, I hadn't practised javascript in about two weeks, so I was a little rusty! On the desktop view, I didn't include the moving box.

I think it's likely down the line I will have another go at this project to improve again! If anyone has a solution to this challenge they are proud of, please share it with me so I can have a nose at your solution!

Tried a bigger project, I got a little confused in some sections but feel like I am slowly making progress. There are a few areas that I would massively appreciate some feedback on.

I used the figma file for font sizes however I found it hasn't helped make a replica design. I think I've had more success in guessing rems by eye.

**Things I'd love feedback on: **

• I can't stop the page from showing the overflow on the right from the offset pictures at the top- you can see there's a little margin on the right hand side where the overflow is showing. When I set overflow to hidden you lose most of the webpage so i don't think that is the correct fix.
• my btn is taking up the full width of the column and I can't workout how to fix this- it's only an issue in the desktop view
• I struggled to add margins for my hero-text element- I created a margin class to add the margin in. Is there a better solution for this?

Time taken to complete: 6/7hours

Proud of this one as it's the first time I've completed a project without getting massively stuck or confused. Huge thank you to Jonas Schmedtmann's advanced CSS course, I would strongly recommend it.

**Things I'd love feedback on: **

I always struggle with HTML markup- so deciding the correct CSS class names & using the right semantic HTML. So any feedback on this?

**What I'm going to learn next: **

Once I've mastered the CSS grid, Im going to be exploring and understanding accessibility more.

I haven't created the mobile friendly version.

First time writing my own javascript code, would also be keen to hear opinions on the structure of my CSS & class/ID names.

Thank you!

Anything people notice such as better practices I could be keep etc would be greatly appreciated. Thanks all!

So one major problem- Git is really confusing- I've uploaded it off of VS code however the stylesheet doesn't seem to be linking now I've put it in GIT- can anyone help me understand what I've done wrong?

Actual CSS roadblocks I hit:

• the p elements inside my wrapper div would create their own margin- I removed the margin using the * selector but they still created a double height margin
• the eye that appears when hovering over the main image- I couldn't work out how to make it have more opacity than the color overlay
• mobile version- it looks different in chrome and firefox I'm not sure why. Chrome it is more zoomed- i think bc of the em values i have used?

Overall i am really happy with how this went- if anyone can give me some feedback on my issues i would appreciate that so much! especially my GIT one!