Penny's Art Marketplace

Penny's Art Marketplace

Discover Unique Art Pieces

Handcrafted with love by Penny

Featured Artwork

About Penny

Penny is a passionate artist specializing in...

Her work has been featured in...

Contact Penny

* { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Arial', sans-serif; } body { line-height: 1.6; color: #333; } header { background: #2c3e50; color: white; padding: 1rem; position: sticky; top: 0; z-index: 100; } nav ul { display: flex; list-style: none; gap: 1rem; } nav a { color: white; text-decoration: none; } .hero { background: #3498db; color: white; text-align: center; padding: 4rem 1rem; } .shop-btn { background: #e74c3c; color: white; border: none; padding: 0.5rem 1rem; cursor: pointer; } .products { padding: 2rem; } .product-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 1rem; margin-top: 1rem; } .product-card { border: 1px solid #ddd; padding: 1rem; border-radius: 5px; } .product-card img { width: 100%; height: 200px; object-fit: cover; } .about { padding: 2rem; background: #f9f9f9; } .about-content { display: flex; gap: 2rem; margin-top: 1rem; } .artist-photo { width: 200px; height: 200px; border-radius: 50%; object-fit: cover; } .contact { padding: 2rem; } .contact form { display: flex; flex-direction: column; gap: 1rem; max-width: 500px; margin-top: 1rem; } .contact input, .contact textarea { padding: 0.5rem; } footer { background: #2c3e50; color: white; text-align: center; padding: 1rem; } // Sample product data const products = [ { id: 1, name: "Sunset Painting", price: 120, description: "Beautiful acrylic sunset landscape", image: "sunset.jpg" }, { id: 2, name: "Abstract Sculpture", price: 250, description: "Handcrafted clay sculpture", image: "sculpture.jpg" }, { id: 3, name: "Portrait Sketch", price: 80, description: "Charcoal portrait on paper", image: "portrait.jpg" }, { id: 4, name: "Nature Photography", price: 65, description: "Limited edition nature print", image: "nature.jpg" } ]; // DOM elements const productGrid = document.getElementById('product-grid'); const cartCount = document.querySelector('#cart span'); // Initialize cart let cart = []; // Render products function renderProducts() { productGrid.innerHTML = ''; products.forEach(product => { const productCard = document.createElement('div'); productCard.className = 'product-card'; productCard.innerHTML = `

${product.name}

${product.description}

$${product.price}

`; productGrid.appendChild(productCard); }); } // Add to cart function function addToCart(productId) { const product = products.find(p => p.id === productId); cart.push(product); updateCartCount(); } // Update cart count function updateCartCount() { cartCount.textContent = `Cart (${cart.length})`; } // Initialize page document.addEventListener('DOMContentLoaded', () => { renderProducts(); });