File size: 3,274 Bytes
cd2c91d 7547860 86b7bfb e748187 1ea5871 86b7bfb 4539c80 1ea5871 4539c80 4e75788 86b7bfb 4539c80 1ea5871 4539c80 1ea5871 86b7bfb 4539c80 7a88679 4539c80 7a88679 4539c80 86b7bfb 4539c80 86b7bfb 4539c80 7a88679 e8c85cc 4e75788 e8c85cc 4e75788 e8c85cc 4e75788 e8c85cc 4e75788 e8c85cc 4e75788 e8c85cc e748187 7547860 8fdce7e 4539c80 e8c85cc 4e75788 3e2a505 4e75788 3e2a505 4e75788 3e2a505 7a88679 4e75788 e8c85cc ce5c734 b9a4953 4e75788 b9a4953 4e75788 b9a4953 4e75788 b9a4953 4e75788 b9a4953 ce5c734 7547860 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Biryani Hub Menu</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f8f8;
text-align: center;
margin: 0;
padding: 20px;
}
h1 {
color: #ff5722;
margin-bottom: 30px;
}
.menu-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-top: 20px;
}
.menu-item {
background: white;
padding: 15px;
margin: 10px;
border-radius: 8px;
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
width: 300px;
text-align: left;
}
.menu-item h3 {
margin: 0;
color: #333;
}
.menu-item p {
margin: 5px 0;
color: #555;
}
.menu-item button {
background-color: #ff5722;
color: white;
border: none;
padding: 8px;
cursor: pointer;
width: 100%;
border-radius: 5px;
}
.menu-item button:hover {
background-color: #e64a19;
}
.cart-container {
position: fixed;
bottom: 20px;
right: 20px;
z-index: 999;
}
.cart-button {
background-color: #007bff;
color: white;
padding: 10px 20px;
border-radius: 50px;
font-size: 1rem;
font-weight: bold;
text-decoration: none;
display: flex;
align-items: center;
justify-content: center;
}
.cart-button:hover {
background-color: #0056b3;
text-decoration: none;
}
</style>
</head>
<body>
<h1>Restaurant Menu</h1>
<!-- Menu Display -->
<div class="menu-container">
{% for item in menu %}
<div class="menu-item">
<h3>{{ item.name }}</h3>
<img src="{{ url_for('static', filename='images/' + item.image_url) }}" alt="{{ item.name }}" style="width: 100px; height: 100px; border-radius: 8px;">
<p><strong>Category:</strong> {{ item.category }}</p>
<p><strong>Price:</strong> ${{ item.price }}</p>
<p><strong>Ingredients:</strong> {{ item.ingredients }}</p>
<button onclick="addToCart('{{ item.name }}', {{ item.price }})">Add to Cart</button>
</div>
{% endfor %}
</div>
<!-- Cart Button -->
<div class="cart-container">
<a href="/cart" class="cart-button">View Cart</a>
</div>
<script>
let cart = [];
// Add items to cart
function addToCart(name, price) {
cart.push({ name, price });
alert(name + " added to cart!");
}
// View cart function (you can further expand it based on cart items)
function viewCart() {
console.log(cart); // Display cart items in the browser console for now
}
</script>
</body>
</html>
|