/* Styles for the project cards */ .project-card { width: 300px; padding: 20px; border: 1px solid #ccc; border-radius: 5px; background-color: #fff; margin: 10px; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); } .project-card img { width: 100%; max-height: 200px; object-fit: cover; border-radius: 5px; } .project-card h2 { font-size: 18px; font-weight: bold; margin-top: 10px; } .project-card p { font-size: 14px; margin-top: 5px; } .project-card a { display: block; margin-top: 10px; } // JavaScript code for filtering projects by category const filterBtns = document.querySelectorAll('.filter-btn'); const projectCards = document.querySelectorAll('.project-card'); filterBtns.forEach(btn => { btn.addEventListener('click', (e) => { const category = e.target.getAttribute('data-category'); projectCards.forEach(card => { if (category === 'all' || card.getAttribute('data-category') === category) { card.style.display = 'block'; } else { card.style.display = 'none'; } }); }); });

Project Title

Project Image

Project Description

Live Website GitHub Repo