ricardobalk / ricardobalk.nl

My personal website, made with Nuxt 3 (Vue 3), TypeScript & TailwindCSS
https://ricardobalk.nl
ISC License
0 stars 0 forks source link

Add filtering functionality to blog and portfolio #32

Closed ricardobalk closed 4 years ago

ricardobalk commented 4 years ago
const filterPosts = ({ category }) => {
    Array.prototype.forEach.call(document.querySelectorAll('article[data-category]'), (e) => {
        e.style.display = (e.dataset.category == category ? '' : 'none');
    })
};

That will basically add style="display: none;" to each article[data-category] except the ones you'd like to see. e.g. filterPosts({ category: "front-end-development"}); will show article[data-category="front-end-development"] and hide others.

ricardobalk commented 4 years ago

This feature has been implemented in dfdb12ef6e2b7b66f0003f5ac743ac189c796538. It needs refactoring, but a separate issue has been opened for that (#75).