Your solution looks awesome š. but I believe it has more room for improvement, and these are some suggestions you might find helpful.
-
I like the idea of having more products to display, however, this page is considered for a single product display and not to showcase all available products. therefore, it would be much better if you make a dynamic route for each product depending on its id so that each product will have its page that showcases its details.
-
for the side menu on mobile devices I see a fake backdrop overlay but why š¤ it would be better if there is a real backdrop that closes the menu when clicked because as of now I can interact with the elements in the background and ofc that's not good. for example, while I'm opening the menu I can add items to the cart!
-
I see you have a backdrop overlay when opening the lightbox, but unfortunately, it doesn't serve its normal function which is closing the modal.
-
the main image is still clickable on small devices even though the lightbox is disabled and I can't see it.
-
it would be nice if the user can click anywhere to close the cart menu (I notice that opening the side menu also closes it).
-
this is a personal preference thing, but I would rather have a message telling me that the item was added to the cart (maybe under the "add to cart" button) rather than opening the cart and then closing it after a short period of time.
-
I know that this's just a dummy app, but the discount value from the original price after calculating the discount rate doesn't make sense š