README Project Title: Nike T-Shirts Webpage This project is a simple web page showcasing a collection of Nike T-shirts. It includes a filter system to sort products by color, size, and price. The page also features a shopping cart system where users can add and remove items and view the total price.

Features Header: A fixed header with a navigation bar. Filters: Allows users to filter T-shirts based on color, size, and price range. Products Display: Shows a list of products with details like name, description, price, size, color, rating, and an image. Shopping Cart: Users can add items to the cart, view the total price, and proceed to checkout.

Technologies Used HTML: Structure of the webpage. CSS: Styling of the webpage, including Bootstrap and FontAwesome for icons. JavaScript: Used for dynamic rendering of products, filtering logic, and cart functionality.

How to Run To run this project locally using Visual Studio Code (VS Code):

Clone the Repository: Clone this repository to your local machine using:

bash Copy code git clone Navigate to the Project Directory:

bash Copy code cd Open the Project in VS Code:

bash Copy code code . Run the Project:

Open the index.html file in your browser to view the webpage. Alternatively, you can use the Live Server extension in VS Code for a live preview: Install the Live Server extension if not already installed. Right-click on the index.html file and select "Open with Live Server".

File Structure index.html: Main HTML file containing the structure of the webpage. style.css: Contains custom styles for the webpage. script.js: JavaScript file for dynamic rendering and functionality. images/: Directory containing image files used on the website.

Dependencies Bootstrap 5.2.3: For responsive design and pre-built components. FontAwesome: For icons. jQuery: For easier DOM manipulation. Custom Styles

The custom styles defined in the project are included in the style.css file. Some notable styles include:

.imi: Custom styles for product display cards. .nv: Fixed position for the navigation bar. .logo: Styling for the logo image. .carousel-item: Styles for carousel items in different screen sizes. .footer: Styles for the footer section.