content, css: series nav presentation tweaks

2 files changed, 20 insertions, 5 deletions

diff --git a/src/content/dependencies/generateAlbumSecondaryNavSeriesPart.js b/src/content/dependencies/generateAlbumSecondaryNavSeriesPart.js
index 4cba4cf3..47ba6ef6 100644
--- a/src/content/dependencies/generateAlbumSecondaryNavSeriesPart.js
+++ b/src/content/dependencies/generateAlbumSecondaryNavSeriesPart.js
@@ -63,6 +63,7 @@ export default {
   generate: (data, relations, slots, {html, language}) =>
     html.tag('span',
       {class: 'nav-link'},
+      {class: 'series-nav-link'},
 
       relations.colorStyle
         .slot('context', 'primary-only'),
diff --git a/src/content/dependencies/generateAlbumSidebar.js b/src/content/dependencies/generateAlbumSidebar.js
index ec1b670f..3dbe3867 100644
--- a/src/content/dependencies/generateAlbumSidebar.js
+++ b/src/content/dependencies/generateAlbumSidebar.js
@@ -9,6 +9,8 @@ export default {
     'generatePageSidebarConjoinedBox',
   ],
 
+  extraDependencies: ['html'],
+
   query(album) {
     const query = {};
 
@@ -50,20 +52,33 @@ export default {
     isAlbumPage: !track,
   }),
 
-  generate(data, relations) {
+  generate(data, relations, {html}) {
+    for (const box of [
+      ...relations.groupBoxes,
+      ...relations.seriesBoxes.flat(),
+    ]) {
+      box.setSlot('mode',
+        data.isAlbumPage ? 'album' : 'track');
+    }
+
     const groupAndSeriesBoxes =
       stitchArrays({
         groupBox: relations.groupBoxes,
         seriesBoxes: relations.seriesBoxes,
       }).map(({groupBox, seriesBoxes}) =>
-          [groupBox, ...seriesBoxes])
+          [groupBox].concat(
+            seriesBoxes.map(seriesBox => [
+              html.tag('div',
+                {class: 'sidebar-box-joiner'},
+                {class: 'collapsible'}),
+              seriesBox,
+            ])))
         .flat();
 
     return relations.sidebar.slots({
       boxes: [
         data.isAlbumPage &&
-          groupAndSeriesBoxes
-            .map(box => box.slot('mode', 'album')),
+          groupAndSeriesBoxes,
 
         relations.trackListBox,
 
@@ -72,7 +87,6 @@ export default {
             attributes: {class: 'conjoined-group-sidebar-box'},
             boxes:
               groupAndSeriesBoxes
-                .map(box => box.slot('mode', 'track'))
                 .map(box => box.content), /* TODO: Kludge. */
           }),
       ],