Changed around line 1
+ document.addEventListener('DOMContentLoaded', () => {
+ // Auth state
+ let isLoggedIn = false;
+ let notifications = [];
+
+ // DOM elements
+ const loginBtn = document.getElementById('loginBtn');
+ const loginModal = document.getElementById('loginModal');
+ const loginForm = document.getElementById('loginForm');
+ const notificationBtn = document.getElementById('notificationBtn');
+ const notificationPanel = document.getElementById('notificationPanel');
+ const notificationCount = document.querySelector('.notification-count');
+ const notificationList = document.querySelector('.notification-list');
+
+ // Login modal
+ loginBtn.addEventListener('click', () => {
+ loginModal.style.display = 'block';
+ });
+
+ window.addEventListener('click', (e) => {
+ if (e.target === loginModal) {
+ loginModal.style.display = 'none';
+ }
+ });
+
+ // Login form
+ loginForm.addEventListener('submit', (e) => {
+ e.preventDefault();
+ isLoggedIn = true;
+ loginBtn.textContent = 'Logout';
+ loginModal.style.display = 'none';
+ addNotification('Welcome to QuickBite!');
+ });
+
+ // Notifications
+ function addNotification(message) {
+ notifications.push({
+ id: Date.now(),
+ message,
+ timestamp: new Date().toLocaleTimeString()
+ });
+ updateNotifications();
+ }
+
+ function updateNotifications() {
+ notificationCount.textContent = notifications.length;
+ notificationList.innerHTML = notifications
+ .map(notification => `
+
+
${notification.message}
+ ${notification.timestamp}
+
+ `)
+ .join('');
+ }
+
+ notificationBtn.addEventListener('click', () => {
+ notificationPanel.style.display =
+ notificationPanel.style.display === 'block' ? 'none' : 'block';
+ });
+
+ // Close notification panel when clicking outside
+ document.addEventListener('click', (e) => {
+ if (!notificationBtn.contains(e.target) &&
+ !notificationPanel.contains(e.target)) {
+ notificationPanel.style.display = 'none';
+ }
+ });
+
+ // Mock restaurant data
+ const restaurants = [
+ { name: 'Pizza Palace', rating: 4.5, cuisine: 'Italian' },
+ { name: 'Burger House', rating: 4.3, cuisine: 'American' },
+ { name: 'Sushi Master', rating: 4.7, cuisine: 'Japanese' }
+ ];
+
+ // Populate restaurants
+ const restaurantGrid = document.querySelector('.restaurant-grid');
+ restaurants.forEach(restaurant => {
+ const card = document.createElement('div');
+ card.className = 'restaurant-card';
+ card.innerHTML = `
+
${restaurant.name}
+
Rating: ${restaurant.rating}
+ `;
+ restaurantGrid.appendChild(card);
+ });
+ });
