All solutions

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

I would implement the dark mode feature differently with only css.

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

Adding a gradient border was a nightmare lol. Used gradient image instead as a solution.

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

Best practices and any mistakes

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

Took less time to do than I expected (2hrs)

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

n/a

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

best practices

All feedback welcome! :)

Would love a hand making the breakpoints more responsive :)

How can I improve on my grid for the image gallery?

Any other site improvement recommendations are much appreciated.

Okay this project was just to have something to do as I work on other things but i may need some clarification on how I sized my image and how I positioned my text thanks.

This is my first ever grid layout and my first grid-flexbox combination. Really excited to see it looking somewhat like the original.

Had some issues with:

1. How to change the background color for the lower blue content. I used box shadow with an inset value not sure if that is good practice or correct for the solution.

2. How to properly position elements within a grid-child. What could I do to better position within a grid-child that is also a flexbox container? Is just using margins and padding okay?

3. Semantic markup. How to include better semantic html

4. How can I make a grid like this responsive without having to use grif-template-areas?

Leave me a tip for anything else I missed :)

This is my first junior level challenge so please don't expect it to look exactly like the original😂 . I'm still really proud of the result. Really had the hardest time working on those dropdown menus. Its cause I don't really know any JavaScript lol. I had to use stackoverflow. I also had a hard time resizing items to look like the original and just resizing in general. The hero image took me two whole days just to make it look similar idk why.

Questions: How could I improve my dropdown menus in terms of size and sizing? How could I improve my JavaScript for the dropdown menus? How could I resize my hero image and body content better?

Let me know anything else I can improve☺️

Challenges: The biggest challenged I faces was styling the button and positioning elements within the website Unsure: Areas I am unsure of are the text size and size of the containers in comparison to the original

QUESTIONS:

1. How can I better position my elements inside of the flex child instead of always resorting to using margin and padding?

What I found really difficult while building the projects was:

1. How to properly name my css classes.
2. How to change the background color of the image using css. I still managed to do it but i could not get the color to match exactly.
3. Positioning with css especially positioning text within flex childs I was really wingin most of the text positioning.

Areas I am unsure of: Pretty much all areas from the parts I found difficult above lol. Though I am also unsure on how I removed the default margin and padding of my website. Instead of using the '*' (asterisk) and setting the margin and padding to 0, i used bofy, html and set that margin and padding to 0. I hope that is not bad practice.

Questions I have:

1. How can I get better at naming my css classes according to industry standard?
2. What is the best way to change the background color of an image using css?
3. What can i improve on in my attempt?