Skip to content

swckd/E-commerce-product-page

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

49 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

E-commerce product page

Live web preview for the E-commerce product page coding challenge

Welcome! 👋

I have built out this e-commerce product page from a Figma file.

I have used HTML 5, SASS and Javascript, all in Bootstrap 5.

Your should be able to:

  • View the optimal layout for the site depending on their device's screen size
  • See hover states for all interactive elements on the page
  • Open a lightbox gallery by clicking on the large product image
  • Switch the large product image by clicking on the small thumbnail images
  • The lightbox gallery is disabled on mobile
  • Add items to the cart
  • View the cart and remove items from it

See some screenshots

Responsive navbar:

Mobile 1

Cart functionality:

Mobile 2