WallyHackenslacker/Lutris-Playtime-Report-Generator
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add category badges to game tables in all templates

Browse Source 
Display game categories as colored badges after service badges in both
top games and others sections. Categories filtered to exclude .hidden,
favorite, and Horny.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
Miguel Astor
2026-02-26 17:07:28 -04:00
parent f850e4d69c
commit 3a700c4f48
4 changed files with 119 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
templates/brutalism.html
View File

@@ -448,6 +448,18 @@
font-weight: 700;
letter-spacing: 0.5px;
}
.category-badge {
display: inline-block;
font-size: 10px;
padding: 2px 6px;
background: var(--accent-secondary);
border: 1px solid var(--border-color);
color: var(--bg-primary);
margin-left: 4px;
text-transform: uppercase;
font-weight: 700;
letter-spacing: 0.5px;
}
.no-data {
text-align: center;
@@ -844,7 +856,8 @@
const topGames = filtered.slice(0, topN).map(g => ({
name: g.name,
playtime: g.playtime,
service: g.service
service: g.service,
categories: g.categories || []
}));
let othersGames = [];
@@ -853,7 +866,8 @@
othersGames = filtered.slice(topN).map(g => ({
name: g.name,
playtime: g.playtime,
service: g.service
service: g.service,
categories: g.categories || []
}));
const othersPlaytime = othersGames.reduce((sum, g) => sum + g.playtime, 0);
const othersCount = othersGames.length;
@@ -1069,6 +1083,12 @@
const serviceBadge = !isOthers
? `<span class="service-badge">${game.service}</span>`
: '';
const categoriesBadges = !isOthers && game.categories && game.categories.length > 0
? game.categories
.filter(cat => cat !== '.hidden' && cat !== 'favorite' && cat !== 'Horny')
.map(cat => `<span class="category-badge">${cat}</span>`)
.join('')
: '';
const row = document.createElement('tr');
if (isOthers) {
row.className = 'others-row';
@@ -1077,7 +1097,7 @@
<td>${index + 1}</td>
<td>
<span class="color-box" style="background: ${colors[index]}"></span>
${game.name}${serviceBadge}
${game.name}${serviceBadge}${categoriesBadges}
</td>
<td class="time">${formatTime(game.playtime)}</td>
<td class="percent">${percent}%</td>
@@ -1088,13 +1108,19 @@
const detailRows = [];
othersGames.forEach((otherGame, otherIndex) => {
const otherPercent = ((otherGame.playtime / totalPlaytime) * 100).toFixed(1);
const otherCategoriesBadges = otherGame.categories && otherGame.categories.length > 0
? otherGame.categories
.filter(cat => cat !== '.hidden' && cat !== 'favorite' && cat !== 'Horny')
.map(cat => `<span class="category-badge">${cat}</span>`)
.join('')
: '';
const detailRow = document.createElement('tr');
detailRow.className = 'others-detail';
detailRow.innerHTML = `
<td>${index + 1}.${otherIndex + 1}</td>
<td>
${otherGame.name}
<span class="service-badge">${otherGame.service}</span>
<span class="service-badge">${otherGame.service}</span>${otherCategoriesBadges}
</td>
<td class="time">${formatTime(otherGame.playtime)}</td>
<td class="percent">${otherPercent}%</td>