HTML_Project

its an demo project to html for an Restaurant

<title>FoodComa</title>

<header id="s1">
    <h1>FoodComa</h1>
    <h2 id="h2">Welcome to our Restaurant!!!</h2>
    <div class="cart">
        <span id="cart">0</span> Items in cart
           </div>
</header>
<p id="y1">Break Fast</p>
<section class="food-list">
    <div class="cake">
        <img src="t6.jpg" alt="Dosa" class="food-img">
        <h2>Dosa</h2>
        <p>Price: $80</p>
        <button onclick="addToCart(80)">Add to Cart</button>
    </div>
    <div class="cake">
        <img src="t7.jpg" alt="Idli" class="food-img">
        <h2>Idli</h2>
        <p>Price: $75</p>
        <button onclick="addToCart(75)">Add to Cart</button>
    </div>
    <div class="cake">
        <img src="t8.jpg" alt="Chapati" class="food-img">
        <h2>Chapati</h2>
        <p>Price: $85</p>
        <button onclick="addToCart(85)">Add to Cart</button>
    </div>
    <div class="cake">
        <img src="t9.jpg" alt="Puri" class="food-img">
        <h2>Puri</h2>
        <p>Price: $100</p>
        <button onclick="addToCart(100)">Add to Cart</button>
    </div>

Yum Yum

Biriyani

Price: $80

Add to Cart

Chicken Rice

Price: $75

Add to Cart

Fish

Price: $85

Add to Cart

Pizza

Price: $100

Add to Cart

Dessert

Bun Falooda

Price: $65

Add to Cart

Brownie

Price: $70

Add to Cart

ICE Cream

Price: $60

Add to Cart

Brownie

Price: $80

Add to Cart

<script> let cartcount=0; let total=0; function addToCart(Price){ cartcount++; total+=Price; document.getElementById("cart").innerText =cartcount; alert(`Food added to cart! Total Cost: $${total}`); }

document.getElementById('checkout-btn').addEventListener('click', function() { if (cartcount === 0) { alert('Your cart is empty!'); } else { alert(Proceeding to checkout.Total cost: ${total});     } }); </script>