diff options
| -rw-r--r-- | src/content/dependencies/linkContribution.js | 45 | ||||
| -rw-r--r-- | src/static/css/site.css | 14 | ||||
| -rw-r--r-- | src/strings-default.yaml | 4 |
3 files changed, 63 insertions, 0 deletions
diff --git a/src/content/dependencies/linkContribution.js b/src/content/dependencies/linkContribution.js index c17cc45a..aee93d60 100644 --- a/src/content/dependencies/linkContribution.js +++ b/src/content/dependencies/linkContribution.js @@ -5,6 +5,7 @@ export default { 'generateTextWithTooltip', 'generateTooltip', 'linkArtist', + 'linkAnythingMan', 'linkExternalAsIcon', ], @@ -22,6 +23,26 @@ export default { relations.tooltip = relation('generateTooltip'); + let previous = contribution; + while (previous && previous.thing === contribution.thing) { + previous = previous.previousBySameArtist; + } + + let next = contribution; + while (next && next.thing === contribution.thing) { + next = next.nextBySameArtist; + } + + if (previous) { + relations.previousLink = + relation('linkAnythingMan', previous.thing); + } + + if (next) { + relations.nextLink = + relation('linkAnythingMan', next.thing); + } + if (!empty(contribution.artist.urls)) { relations.artistIcons = contribution.artist.urls @@ -41,6 +62,7 @@ export default { slots: { showContribution: {type: 'boolean', default: false}, showIcons: {type: 'boolean', default: false}, + showChronology: {type: 'boolean', default: false}, preventWrapping: {type: 'boolean', default: true}, iconMode: { @@ -94,6 +116,29 @@ export default { })); } + if (slots.showChronology) { + tooltipContent.push( + language.encapsulate(capsule, 'chronology', capsule => [ + html.tag('span', {class: 'chronology-link'}, + {[html.onlyIfContent]: true}, + + language.$(capsule, 'previous', { + [language.onlyIfOptions]: ['thing'], + + thing: relations.previousLink, + })), + + html.tag('span', {class: 'chronology-link'}, + {[html.onlyIfContent]: true}, + + language.$(capsule, 'next', { + [language.onlyIfOptions]: ['thing'], + + thing: relations.nextLink, + })), + ])); + } + // TODO: It probably shouldn't be necessary to do an isBlank call here. options.artist = (html.isBlank(tooltipContent) diff --git a/src/static/css/site.css b/src/static/css/site.css index dc99bcc5..84ed2ea7 100644 --- a/src/static/css/site.css +++ b/src/static/css/site.css @@ -950,6 +950,20 @@ li:not(:first-child:last-child) .tooltip, grid-column-end: icon-end; } +.icons-tooltip .chronology-link { + grid-column-start: icon-start; + grid-column-end: domain-end; + padding-left: 5px; + padding-right: 3px; + font-size: 0.85em; +} + +.icons-tooltip .chronology-link:nth-child(1 of .chronology-link) { + border-top: 1px dotted var(--primary-color); + margin-top: 2px; + padding-top: 2px; +} + .icons-tooltip .icon-platform { display: none; diff --git a/src/strings-default.yaml b/src/strings-default.yaml index 8429c4cd..cb3b5e0c 100644 --- a/src/strings-default.yaml +++ b/src/strings-default.yaml @@ -486,6 +486,10 @@ misc: # isn't a specially detected web platform. noExternalLinkPlatformName: "Other" + chronology: + previous: "← {THING}" + next: "→ {THING}" + # chronology: # # "Chronology links" are a section that appear in the nav bar for |