All solutions

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

Use more utility classes, and rely more on global variables. I'm proud that this one has a lot of responsiveness.

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

I had a challenge with the picture/image changing, but googled the solution using a srcset and media to match the media queries. I was also having issues of white space as it grew, but just used a break point of the media query to prevent that and max the width along with creating a mid-width to have consistency.

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

Please give it a look over. I know I need to add more for accessibility and screen reader users but that is not an area I have much knowledge in.

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

I am glad I felt more in the hang of getting back into doing things for frontend slowly after over a year break really from consistent coding.

What I am proud of: the majority of the website I feel is very well designed, I would however try to be more consistent with using re-useable class names to avoid bloat to css and better modular design. i.e; not doing specific classes for each section title, an just having a title class that handles all, primary font class, etc as opposed to adding that as a css variable for each class already having a singular class set up.

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

Figuring out how to select the list "bullets" or "numbers" (hint: its ::marker), the table section at the bottom was difficult was well but I used CDN from firefox for looking up rules for tables, as I had not used tables really before. Originally tried to tackle the problem through grid but it made my head hurt.

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

General feedback on it. I'm aware a lot is lacking in terms of accessability, and aria-labels which is something I am going to look at and read more on going forward as I continue to do frontendmentor projects/challenges.

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

I solved this challenge about 4 months ago, https://remarkable-klepon-f66984.netlify.app but re-doing things after a hiatus of not practicing coding due to a family members illness.

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

Main challenge was the sizing of the buttons/links which I just used padding for. in hindsight and after reviewing previous code would have been better to use buttons and a width perhaps with padding on top/bottom to get sizing correct. I think both solutions work though, outside of the hover not working as it should.

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

Curious to know what other people used as a solution for the hover compontents.

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

Quick, simple solution using flex-box.

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

Could not get the text to be on two lines, as opposed to three for the h1 like the design.

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

Could not get the text to be on two lines, as opposed to three for the h1 like the design. Would love to know a simple solution for this.

re-upload because I loaded to the wrong challenge.

Took awhile to figure out how to use the links at bottom went from lis>a>button to li>a before landing on li>a>button

Would love to know what else could have been done differently. I struggle with sizing, and responsitvity.

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

I'd like that this was an easy one for me to figure out after coming back from not coding for a few months it was good to get back in the saddle of coding.

Next time I'd try to get as close to pixel perfect to the design as possible as I feel its not 100% of the way there. I did this one months ago so this is a re-submital. You can view my older submission here as well.

https://65ada36a93d77db1e9eb0018--chipper-frangipane-4ace1d.netlify.app/

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

The box shadow I used chatgpt to assist, but even that did not work original output was

box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2); /* Adjusted box shadow */

I ended up changing to 15px 15px and rgba(0,0,0,1) and worked.

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

How to get it more pixel perfect of the design to match.