diff --git a/Cart.css b/Cart.css index 98bc5c7..df285b1 100644 --- a/Cart.css +++ b/Cart.css @@ -387,7 +387,7 @@ header{ } .button--1:hover{ background-color: black; - color: #F4F5F7;!important; + color: #F4F5F7 !important; } diff --git a/Cart.js b/Cart.js index e486882..fa256ae 100644 --- a/Cart.js +++ b/Cart.js @@ -59,7 +59,7 @@ let AddtoCart = (ev) =>{ // console.log(cart) } let AddListeners = ()=>{ - for(let i =0;i{ AddListeners(); }); -} +}} diff --git a/README.md b/README.md index 3f636aa..6c85a72 100644 --- a/README.md +++ b/README.md @@ -1,2 +1,42 @@ -# Carto -It’s a frontend design for shopping website with basic Html,CSS and JavaScript. +# Shopping Cart Management Project + +This project is a simple shopping cart management system built with JavaScript. Users can add, remove, and delete items from their cart, and the cart state is saved in `localStorage`, ensuring that cart data persists even after page reloads. + +## Table of Contents + +- [Introduction](#introduction) +- [Features](#features) +- [Prerequisites](#prerequisites) +- [Setup](#setup) +- [Usage](#usage) + + + +## Introduction + +The Shopping Cart Management Project is a lightweight web application that allows users to manage a cart by adding, removing, and deleting items. The state of the cart is saved in `localStorage`, ensuring a persistent user experience. This project serves as a great example for understanding cart functionality in an e-commerce environment. + +## Features + +- Add items to the cart with a quantity selector. +- Remove items or decrease item quantity. +- Delete items entirely from the cart. +- Persistent cart saved to `localStorage` for future access. +- Simple and user-friendly UI for managing cart items. + +### Prerequisites + +To run this project locally, you need to have a modern browser that supports JavaScript and access to a basic web server (optional for local testing). + +### Setup + +1. Clone the repository: + ```bash + git clone https://github.com/JS-Knights/Carto.git + +### Usage + +- Add items to your cart by clicking the plus button. +- Remove items by clicking the minus button. +- Delete items by using the delete button. +- The cart will update dynamically and save the state to localStorage. diff --git a/index.css b/index.css index e313e23..409f0d1 100644 --- a/index.css +++ b/index.css @@ -242,7 +242,7 @@ header{ color: #FFF; text-decoration: none; text-transform: lowercase; - //background-image: linear-gradient(120deg, transparent 0%, transparent 50%, #FFF 50%); + background-image: linear-gradient(120deg, transparent 0%, transparent 50%, #FFF 50%); background-size: 230%; transition: all .4s; } .navigation__link:link span, .navigation__link:visited span { @@ -502,11 +502,10 @@ input{ /*---RESPONSIVE DESIGN---*/ /*---------BODY---------*/ - body @media only screen and (max-width: 56.25em) { body { font-size: 50%; - padding: 0; } } + padding: 0; } } @media only screen and (max-width: 1100px) { /*---------LOGO---------*/