Trello: dim empty lists
Automatically fades lists with no cards so attention stays on columns that have tasks.
Code to copy
// Visually shrink lists that currently contain no cards
function shrinkEmptyLists() {
document.querySelectorAll('[data-testid="list"], .js-list-content').forEach(function (list) {
const cards = list.querySelectorAll('[data-testid="trello-card"], .list-card');
list.style.opacity = cards.length === 0 ? '0.4' : '';
list.style.filter = cards.length === 0 ? 'grayscale(0.5)' : '';
});
}
shrinkEmptyLists();
const obs = new MutationObserver(shrinkEmptyLists);
obs.observe(document.body, { childList: true, subtree: true });How to use this example
- Copy the code with the button above.
- Install JustZix (2 minutes) and open the extension on the target page.
- Add a new rule matching that page.
- Paste the code into the rule's JavaScript panel and save — it runs on every page visit.
Rate this example
No ratings yet — be the first.