Submitted 10 months ago

Built with NextJS, TailwindCSS and Framer-Motion

accessibility, lighthouse, next, tailwind-css, framer-motion

solvman•1,650

@solvman

A solution to the Product list with cart challenge

Preview Code

Solution retrospective

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

The most challenging problem was figuring out how to deal with the small layout shift caused by disabling scroll whenever a modal would come out. I asked questions about the Discord channel and got a suggestion to use the usePreventScroll() custom hook from the react-aria package. It took me a bit to figure out how to incorporate it into my solution, but now the modal is animated smoothly without any background layout shifts.

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

I'd love to receive some feedback on the quality of my code. Thank you!

Code

Please log in to post a comment

Community feedback

No feedback yet. Be the first to give feedback on solvman's solution.

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord