diff options
author | (quasar) nebula <qznebula@protonmail.com> | 2023-10-05 23:52:35 -0300 |
---|---|---|
committer | (quasar) nebula <qznebula@protonmail.com> | 2023-10-05 23:52:35 -0300 |
commit | 48284df1091b10dfcc19eb6858e55bc254800407 (patch) | |
tree | e1a8fea0da872bd682f8dc1a990a060e41613c5b | |
parent | 62d7e0146d471e7623e4ec384a928a828b8780e9 (diff) |
content: generateArtTagSidebar: combine boxes into one
-rw-r--r-- | src/content/dependencies/generateArtTagAncestorDescendantMapList.js | 2 | ||||
-rw-r--r-- | src/content/dependencies/generateArtTagAncestorSidebarBox.js | 27 | ||||
-rw-r--r-- | src/content/dependencies/generateArtTagSidebar.js | 48 | ||||
-rw-r--r-- | src/static/site4.css | 31 |
4 files changed, 71 insertions, 37 deletions
diff --git a/src/content/dependencies/generateArtTagAncestorDescendantMapList.js b/src/content/dependencies/generateArtTagAncestorDescendantMapList.js index 6b4e52d..34a45ff 100644 --- a/src/content/dependencies/generateArtTagAncestorDescendantMapList.js +++ b/src/content/dependencies/generateArtTagAncestorDescendantMapList.js @@ -96,7 +96,7 @@ export default { generate(data, relations, {html, language}) { const recursive = (dataNode, relationsNode) => - html.tag('dl', [ + html.tag('dl', {class: dataNode === data.root && 'tree-list'}, [ dataNode.displayBriefly && html.tag('dt', language.$('artTagSidebar.otherTagsExempt', { diff --git a/src/content/dependencies/generateArtTagAncestorSidebarBox.js b/src/content/dependencies/generateArtTagAncestorSidebarBox.js deleted file mode 100644 index ea85c2b..0000000 --- a/src/content/dependencies/generateArtTagAncestorSidebarBox.js +++ /dev/null @@ -1,27 +0,0 @@ -export default { - contentDependencies: [ - 'generateArtTagAncestorDescendantMapList', - 'linkArtTagDynamically', - ], - - extraDependencies: ['html'], - - relations: (relation, ancestorArtTag, descendantArtTag) => ({ - ancestorArtTagLink: - relation('linkArtTagDynamically', ancestorArtTag), - - ancestorArtTagMapList: - relation('generateArtTagAncestorDescendantMapList', - ancestorArtTag, - descendantArtTag), - }), - - generate: (relations, {html}) => ({ - content: html.tags([ - html.tag('h2', - relations.ancestorArtTagLink), - - relations.ancestorArtTagMapList, - ]), - }), -}; diff --git a/src/content/dependencies/generateArtTagSidebar.js b/src/content/dependencies/generateArtTagSidebar.js index 51e53d2..b5b4ced 100644 --- a/src/content/dependencies/generateArtTagSidebar.js +++ b/src/content/dependencies/generateArtTagSidebar.js @@ -1,8 +1,13 @@ +import {stitchArrays} from '#sugar'; import {collectTreeLeaves} from '#wiki-data'; export default { - contentDependencies: ['generateArtTagAncestorSidebarBox'], - extraDependencies: ['wikiData'], + contentDependencies: [ + 'generateArtTagAncestorDescendantMapList', + 'linkArtTagDynamically', + ], + + extraDependencies: ['html', 'language', 'wikiData'], sprawl: ({artTagData}) => ({artTagData}), @@ -20,12 +25,43 @@ export default { }, relations: (relation, query, sprawl, artTag) => ({ - ancestorBoxes: + artTagLink: relation('linkArtTagDynamically', artTag), + + furthestAncestorArtTagMapLists: query.furthestAncestorArtTags .map(ancestorArtTag => - relation('generateArtTagAncestorSidebarBox', ancestorArtTag, artTag)), + relation('generateArtTagAncestorDescendantMapList', + ancestorArtTag, + artTag)), + }), + + data: query => ({ + furthestAncestorArtTagNames: + query.furthestAncestorArtTags + .map(ancestorArtTag => ancestorArtTag.name), }), - generate: (relations) => - ({leftSidebarMultiple: relations.ancestorBoxes}), + generate: (data, relations, {html, language}) => ({ + leftSidebarContent: [ + html.tag('h1', + relations.artTagLink), + + stitchArrays({ + name: data.furthestAncestorArtTagNames, + list: relations.furthestAncestorArtTagMapLists, + }).map(({name, list}) => + html.tag('details', + { + class: 'has-tree-list', + open: relations.furthestAncestorArtTagMapLists.length === 1, + }, + [ + html.tag('summary', + html.tag('span', {class: 'group-name'}, + language.sanitize(name))), + + list, + ])), + ], + }), }; diff --git a/src/static/site4.css b/src/static/site4.css index 6dd19d8..9c1f02c 100644 --- a/src/static/site4.css +++ b/src/static/site4.css @@ -348,12 +348,37 @@ body::before { margin-left: 0; } -.sidebar dl > dd > dl { +.sidebar > dl .side { + padding-left: 10px; +} + +.sidebar details.has-tree-list[open] summary { + font-weight: 800; +} + +.sidebar dl.tree-list { + margin-top: 0.25em; + line-height: 1.25em; padding-left: 15px; } -.sidebar > dl .side { - padding-left: 10px; +.sidebar dl.tree-list dt { + display: list-item; + list-style-type: disc; + padding-left: 0; + margin-left: 20px; +} + +.sidebar dl.tree-list dl { + padding-left: 15px; +} + +.sidebar dl.tree-list dd { + margin-left: 0; +} + +.sidebar dl.tree-list .current { + font-weight: 800; } .sidebar li.current { |