Replace checkbox-based expand/collapse with HTML5 details element

[Copilot]

Replace checkbox-based expand/collapse with HTML5 details element

• Understand the current implementation (checkbox + label + CSS)
• Replace the checkbox/label/div structure with details/summary elements
• Update CSS to work with details element instead of checkbox state
• Remove the JavaScript event listener for checkbox changes and replace with toggle event
• Update viewEventDetails function to work with details element
• Add cross-browser support for hiding disclosure triangle (WebKit + Firefox)
• Test the changes locally to ensure expand/collapse still works
• Verify the info window repositioning still works when details are expanded
• Run code review and address all feedback
• Run security check (CodeQL)
• Merge latest gh-pages branch

Changes Made

map.js

Lines 368-378: Updated viewEventDetails function

• Changed from document.getElementById('moreInfo') to document.querySelector('.info-body details')
• Changed from detailsCheckbox.checked = true to detailsElement.open = true

Lines 504-516: Replaced expand/collapse mechanism

• Replaced <input type="checkbox"> and <label> with <details> and <summary> elements
• Updated event listener from input.addEventListener('change') to details.addEventListener('toggle')

style.css (lines 104-124)

• Removed checkbox-based CSS selectors
• Added simplified styling for details and summary elements
• Added browser-specific selectors to hide the default disclosure triangle

.github/workflows/deploy.yml

• Merged latest changes from gh-pages branch (pull_request trigger support)

Benefits

• Native functionality: Uses browser's built-in expand/collapse behavior
• Simpler code: Reduced CSS complexity
• Better semantics: <details> element clearly indicates expandable content
• Accessibility: Better screen reader support with semantic HTML5 elements
• Cross-browser compatibility: Works consistently across Chrome, Firefox, Safari, and Edge

Original prompt

On map.js:506-506, switch this to the new html5 details element

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[ProLoser]

@copilot merge the latest master or main

[Copilot]

@copilot merge the latest master or main

Merged latest gh-pages branch in a386325. The workflow now includes pull_request trigger support.