/LifeStyle-Store-Clone

Lifestyle stores is an e-commerce website where all types of clothes and styling products are available for men, women, and kids.

Primary LanguageHTML

LifeStyleStore - Clone

We have tried cloning the LifeStyleStore app as a construct week project in the tjird unit of our Masai Journey. We, a team of 4 people have completed this project in a span of 5 days using our knowledge of HTML, CSS and JavaScript.

About the website

Lifestyle stores is an e-commerce website where all types of clothes and styling products are available for men, women, and kids.

Technology

Client - HTML, CSS, JavaScript

Server - LocalStorage, Netlify

Features

  • Navbar
  • Signup and Login
  • Product Page
  • Cart Functionality Page
  • Payment Gateway Page

More info the Project (LifeStyleStore - Clone)

Lifestyle_LandingPage This is the Landing Page of our project.

It contains the Navabar which houses the Lifestyle logo a search menu bar, quick link buttons that are linked to their respective pages along with signup and login functionality. Mainly created using html, css flex, buttons has animations using the hover effect. and sticky effect given as to keep the navbar in place even on scroll.

The home page has several information about the Products along with offers.

![LifeStyle_Login_Signup](Screenshot (31) )

One Clicking on the login and signup button you will be redirected to the login and signup prompt which is same as the original website. You need to enter your mobile number then a dummy OTP (Precoded) "1234" and upon validation you will be logged in into the website.

![products_PageScreenshot (32) ]

Products page contains all the products bifercated into different genres. On selecting one you will be shown all the products of the particular type. This Page in particular Kutas page. Clicking add to cart the item will be stored in the local Storage that will used to update cart and finializing the total amount to be paid. Also will get a pop up saying so.

![cartPage]Screenshot (33)

Cart Page will show the number the products in the cart, Your Individual products as well as along with the total amount. Discounted value is also calculated if applicable and in the proced to buy button you will be taken to multiple payment options.

You can Just click on Pay now For Your Order

Screenshot (35)