diff options
| -rw-r--r-- | public/gallery.js | 23 | ||||
| -rw-r--r-- | public/style.css | 6 |
2 files changed, 17 insertions, 12 deletions
diff --git a/public/gallery.js b/public/gallery.js index 01439f7..decb197 100644 --- a/public/gallery.js +++ b/public/gallery.js @@ -472,13 +472,15 @@ let ViewBar = { m('ul', ViewModel.paths.map(path => m('li', m(ViewBarPath, {path})))), m('h2', "Tags"), - Object.entries(ViewModel.tags).map(([space, tags]) => [ - m("h3", m(m.route.Link, {href: `/tags/${space}`}, space)), - m("ul.tags", Object.entries(tags) - .sort(([t1, w1], [t2, w2]) => (w2 - w1)) - .map(([tag, score]) => - m(ScoredTag, {space, tagname: tag, score}))), - ]), + Object.entries(ViewModel.tags).map(([space, tags]) => + m('details[open]', [ + m('summary', m("h3", + m(m.route.Link, {href: `/tags/${space}`}, space))), + m("ul.tags", Object.entries(tags) + .sort(([t1, w1], [t2, w2]) => (w2 - w1)) + .map(([tag, score]) => + m(ScoredTag, {space, tagname: tag, score}))), + ])), ]) }, } @@ -609,13 +611,14 @@ let SearchRelated = { view(vnode) { return Object.entries(SearchModel.related) .sort((a, b) => a[0].localeCompare(b[0])) - .map(([space, tags]) => [ - m('h2', space), + .map(([space, tags]) => m('details[open]', [ + m('summary', m('h2', + m(m.route.Link, {href: `/tags/${space}`}, space))), m('ul.tags', tags .sort((a, b) => (b.score - a.score)) .map(({tag, score}) => m(ScoredTag, {space, tagname: tag, score}))), - ]) + ])) }, } diff --git a/public/style.css b/public/style.css index 7fd0079..9acf10b 100644 --- a/public/style.css +++ b/public/style.css @@ -24,13 +24,15 @@ a { color: inherit; } .header .activity { padding: .25rem .5rem; align-self: center; color: #fff; } .header .activity.error { color: #f00; } +summary h2, summary h3 { display: inline-block; } + .sidebar { padding: .25rem .5rem; background: var(--shade-color); border-right: 1px solid #ccc; overflow: auto; min-width: 10rem; max-width: 20rem; flex-shrink: 0; } .sidebar input { width: 100%; box-sizing: border-box; margin: .5rem 0; font-size: inherit; } .sidebar h2 { margin: 0.5em 0 0.25em 0; padding: 0; font-size: 1.2rem; } -.sidebar ul { margin: .5rem 0; padding: 0; } +.sidebar ul { margin: 0; padding: 0; } .sidebar .path { margin: .5rem -.5rem; } .sidebar .path li { margin: 0; padding: 0; } @@ -81,7 +83,7 @@ img.thumbnail, .thumbnail.missing { box-shadow: 0 0 3px rgba(0, 0, 0, 0.75); .viewbar { padding: .25rem .5rem; background: #eee; border-left: 1px solid #ccc; min-width: 20rem; overflow: auto; } .viewbar h2 { margin: 0.5em 0 0.25em 0; padding: 0; font-size: 1.2rem; } -.viewbar h3 { margin: 0.25em 0; padding: 0; font-size: 1.1rem; } +.viewbar h3 { margin: 0.5em 0 0.25em 0; padding: 0; font-size: 1.1rem; } .viewbar ul { margin: 0; padding: 0 0 0 1.25em; list-style-type: "- "; } .viewbar ul.tags { padding: 0; list-style-type: none; } .viewbar li { margin: 0; padding: 0; } |