nate/homeschool
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make list/deck group sections collapsible with prominent headers

Browse Source 
Group headers now use a solid tan background, bold uppercase text, and a
▼/▶ arrow indicator so collapsible sections are visually obvious.
Uses native <details>/<summary> elements; ungrouped items show inline
when no named groups exist.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
nmemmertandClaude Sonnet 4.6 committed 2026-07-27 12:48:51 -04:00
1 parent 9acd0a792f
commit 24e709e038
2 files changed
+23 -8
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

public/admin.js
+4 -2
View File
@@ -1324,10 +1324,12 @@ function renderGroupSections(groups, renderItem) {
const ungrouped = groups[''] || [];
let html = '';
for (const g of named) {
html += `<div class="list-group"><div class="list-group-header">${esc(g)}</div>${groups[g].map(renderItem).join('')}</div>`;
html += `<details class="list-group" open><summary class="list-group-header">${esc(g)}</summary>${groups[g].map(renderItem).join('')}</details>`;
}
if (ungrouped.length) {
html += `<div class="list-group">${named.length ? '<div class="list-group-header">Ungrouped</div>' : ''}${ungrouped.map(renderItem).join('')}</div>`;
html += named.length
? `<details class="list-group" open><summary class="list-group-header">Ungrouped</summary>${ungrouped.map(renderItem).join('')}</details>`
: ungrouped.map(renderItem).join('');
}
return html || '<p class="hint">None yet.</p>';
}