BLUEMERCURY CLONE

Deployed Link-1. https://suryathink.github.io/bluemercuryClone/

This is an attempt to clone the Bluemercury.com website using just HTML,CSS & JavaScript Only.

We have successfully maintained the UserFlow on our cloned website.

We are the team of 4 people.

1)Amit Sisodiya

2)Shubham Kailas Tribhuvan

3)Surya Prakash Singh

4)Arun Tiwari

We have been given the task to clone the bluemarcury website in 1 week at the end of unit-4 at Masai School with the concepts we have learned(like HTML,CSS,JavaScript,DOM-Manipulation etc) in unit-4.

Amit Sisodiya has created the Navbar, footer and the home page of bluemercury Website.

When you hover over the SHOP,NEW etc tags you will see different options like this

On the Home page you will see the Bestselling Items

And some more options like these

And Here comes the Footer Section In the Footer Section we have provided all the social media links of the company

We have also provided all the additional information in the footer section.

Now Comes the Create Account/Login/Forget Password Page,Surya Prakash Singh has created these pages.

Before Ordering Product you have to Create Account and login First.

For that click on the SignIn/Up section of the navbar.

Here is how SignUp page looks

This is how Login Page looks like

After Successful Login, It will show like these

It will show you as Logged in as "your Email "

And also It will show your name at the place of SignIn/up page.

Also we have made Forget Password page.

When you will fill your email id whose password you have forgotten it will give You an alert

Now Comes the Product Page, Shubham Kailas Tribhuvan has created the product page.

Here on the Product Page you can select an item and add to Bag. To make your purchase easy We have also added Filter button.

You can filter products on the basis of Newly Arrived Products, Low to High Price & High to Low Price.

Now comes the Cart Page, It looks like these after adding products You can also Remove item from the cart on clicking that remove that cart button.

We have also added a Coupon Code option. When you provide a code "masai30" You will get an alert saying, You Received a discount of 30%.

And after you click ok on the alert button, You will be able to see the Discounted Price.

Now when you click on "buy the product" you will be directed to the product page.

Here how it looks like.

After Successfully filling all the details you will be redirected towards the OTP Page.

After Validating the OTP your order will be placed and you will receive an alert of Order Placed Successfully And you will be Redirected to the Product Page.