Skip to content

Fix achievement badges visibility on desktop in game-stats.njk#523

Draft
Copilot wants to merge 2 commits into
mainfrom
copilot/fix-achievement-badge-logic
Draft

Fix achievement badges visibility on desktop in game-stats.njk#523
Copilot wants to merge 2 commits into
mainfrom
copilot/fix-achievement-badge-logic

Conversation

Copilot AI commented Jun 11, 2026

Copy link
Copy Markdown
Contributor

#achievement-badges started with hidden sm:flex as static classes. Since sm:flex has higher specificity than hidden, toggling hidden via JS was a no-op on sm+ screens — the container was always visible on desktop regardless of whether any badges were earned.

Changes

  • HTML: Remove sm:flex from the static class list so the element starts fully hidden everywhere
  • JS:
    • Add badgeContainer.innerHTML = "" to clear stale content on re-render
    • Track badgeCount as badges are appended
    • Replace missing visibility call with classList.toggle("sm:flex", badgeCount > 0) — dynamically applies responsive visibility only when badges exist
var badgeCount = 0;
Object.keys(icons).forEach(function (id) {
  if (earned[id]) {
    // ... append badge ...
    badgeCount += 1;
  }
});
badgeContainer.classList.toggle("sm:flex", badgeCount > 0);

Result: container is hidden everywhere when no badges are earned; hidden on mobile and visible as flex on sm+ when badges exist.

Copilot AI changed the title [WIP] Fix inconsistent indentation and visibility bug for game stats Fix achievement badges visibility on desktop in game-stats.njk Jun 11, 2026
Copilot AI requested a review from jbampton June 11, 2026 23:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: No status

Development

Successfully merging this pull request may close these issues.

AI feedback regarding src/_includes/game-stats.njk

2 participants