content, css, data: Track.nameDetail

1 files changed, 17 insertions, 0 deletions

diff --git a/src/content/dependencies/generateTrackListItem.js b/src/content/dependencies/generateTrackListItem.js
index 383f0025..c1f6ff93 100644
--- a/src/content/dependencies/generateTrackListItem.js
+++ b/src/content/dependencies/generateTrackListItem.js
@@ -28,6 +28,9 @@ export default {
     date:
       track.date,
 
+    detail:
+      track.nameDetail,
+
     duration:
       track.duration ?? 0,
 
@@ -43,6 +46,11 @@ export default {
       default: 'auto',
     },
 
+    showDetail: {
+      type: 'boolean',
+      default: false,
+    },
+
     // If true and the track doesn't have a duration, a missing-duration cue
     // will be displayed instead.
     showDuration: {
@@ -116,6 +124,15 @@ export default {
             relations.trackLink
               .slot('color', slots.colorMode === 'track');
 
+          if (data.detail && slots.showDetail) {
+            workingCapsule += '.withDetail';
+            workingOptions.detailAccent =
+              html.tag('span', {class: 'name-detail'},
+                language.$(itemCapsule, 'withDetail', 'accent', {
+                  detail: language.sanitize(data.detail),
+                }));
+          }
+
           const artists =
             language.encapsulate(itemCapsule, 'artists', artistsCapsule => {
               const chosenCredit =