Jsnsjsjsnnssjk/bazaar-bonanza-bodega

1// Sample product data (100 items)2const products = Array.from({ length: 100 }, (_, i) => ({3    id: i + 1,4    name: `Product ${i + 1}`,5    price: (Math.random() * 100 + 5).toFixed(2),6    category: ['Electronics', 'Clothing', 'Home', 'Food', 'Toys'][Math.floor(Math.random() * 5)],7    image: `http://static.photos/${['red', 'blue', 'green', 'yellow', 'black'][Math.floor(Math.random() * 5)]}/320x240/${i + 1}`,8    description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.'9}));10 11// Render products12document.addEventListener('DOMContentLoaded', () => {13    const container = document.querySelector('.grid');14    15    products.forEach(product => {16        const card = document.createElement('div');17        card.className = 'product-card bg-white';18        card.innerHTML = `19            <img src="${product.image}" alt="${product.name}" class="w-full h-48 object-cover">20            <div class="p-4">21                <span class="text-xs font-semibold px-2 py-1 rounded bg-gray-100">${product.category}</span>22                <h3 class="text-lg font-bold mt-2">${product.name}</h3>23                <p class="text-sm text-gray-600 mt-1">${product.description}</p>24                <div class="flex justify-between items-center mt-4">25                    <span class="font-bold">$${product.price}</span>26                    <button class="px-3 py-1 bg-blue-500 text-white rounded hover:bg-blue-600 transition">27                        <i data-feather="shopping-cart"></i>28                    </button>29                </div>30            </div>31        `;32        container.appendChild(card);33    });34    35    // Refresh feather icons after dynamic content is added36    feather.replace();37});