All solutions

First time doing a project with JSON data attached to it. Learnt a ton of new things. Any criticism in JS is welcome.

Didn't face any serious issues here. The toggle bar was a bit tricky. Feel free to criticize.

Hardest challenge I faced so far. This really pushed me to the edge. Spent like 3days figuring out to achieve all the active states. Learnt a ton of new things like global state management, modal-overlays, effective component structuring. Would appreciate feedback on any missing JavaScript feature or site responsiveness. Feel free to criticize.

Would like some valuable feedback on the responsive-ness of the site and where I can improve.

Spent a lot of time on the javascript part and added some states for the inputs. Any inputs on how I can improve the javascript will be highly appreciated.

Also facing a lot of trouble in styling in React. Any resources for learning how to manage that?

Feel free to criticize.

Feel free to criticize if there are any issues.

Faced some major challenges while trying to build this.

• Would like some feedback on the image section of the card. I built it using background-image and linear-gradient which I feel is quite unnecessary here. Some other method to get the image using the img element?

-Also got quite huddled up in flexbox when the card gets to the breakpoint. Think it's alright now.

If there are any other issues, please feel free to criticize.

Feedback for the Media Queries part will be highly appreciated.

When font-size(rem) is not defined, it inherits from the body whereas when defined does so from the root. Instead of individually defining each element's font-size (have to do when using rem since changing the root's font-size is frowned upon), is there any other option?

Updated the background-image after restart.

Having some problems with media-queries.

When font-size(rem) is defined for an element, it inherits the font-size from the root 16px but when not defined, it inherits the font-size from the body. Whereas we can change the font-size of body, changing font-size of root element is frowned upon. How to proceed in such cases? Simply changing the font-size of each element individually in media-queries is a monumental task.

Some feedback about code workflow would be nice.

The page is not much flexible or responsive. Lots of hard-coding which I want to remove. I gave a width of 300px which is less than the 375px for Mobile device width which is why it's not responsive. Feedback on how I can improve my responsive skills will be appreciated.