« get me outta code hell

content: generateAdditionalFilesList: use <details> elements - hsmusic-wiki - HSMusic - static wiki software cataloguing collaborative creation
about summary refs log tree commit diff
path: root/src/content
diff options
context:
space:
mode:
author(quasar) nebula <qznebula@protonmail.com>2024-04-02 15:24:59 -0300
committer(quasar) nebula <qznebula@protonmail.com>2024-04-02 15:24:59 -0300
commit5952b9409f93dcc8ab6eaf3408916174c423e689 (patch)
tree6f502b3e5d1c686831e12114771e325bcc4a4146 /src/content
parentf3c0efe101a38dee7920c5e4115a773ec98d1882 (diff)
content: generateAdditionalFilesList: use <details> elements
Diffstat (limited to 'src/content')
-rw-r--r--src/content/dependencies/generateAdditionalFilesList.js2
-rw-r--r--src/content/dependencies/generateAdditionalFilesListChunk.js21
2 files changed, 15 insertions, 8 deletions
diff --git a/src/content/dependencies/generateAdditionalFilesList.js b/src/content/dependencies/generateAdditionalFilesList.js
index 2737a410..f504cf80 100644
--- a/src/content/dependencies/generateAdditionalFilesList.js
+++ b/src/content/dependencies/generateAdditionalFilesList.js
@@ -14,7 +14,7 @@ export default {
   },
 
   generate: (slots, {html}) =>
-    html.tag('dl',
+    html.tag('ul', {class: 'additional-files-list'},
       stitchArrays({
         chunk: slots.chunks,
         items: slots.chunkItems,
diff --git a/src/content/dependencies/generateAdditionalFilesListChunk.js b/src/content/dependencies/generateAdditionalFilesListChunk.js
index bb16b778..86e40062 100644
--- a/src/content/dependencies/generateAdditionalFilesListChunk.js
+++ b/src/content/dependencies/generateAdditionalFilesListChunk.js
@@ -26,14 +26,21 @@ export default {
       titleOptions.description = slots.description;
     }
 
-    const dt =
-      html.tag('dt',
-        language.$(...titleParts, titleOptions));
+    const summary =
+      html.tag('summary',
+        html.tag('span',
+          language.$(...titleParts, titleOptions)));
 
-    const dd =
-      html.tag('dd',
-        html.tag('ul', slots.items));
+    const content =
+      html.tag('ul', slots.items);
 
-    return html.tags([dt, dd]);
+    const details =
+      html.tag('details',
+        slots.items.length <= 5 &&
+          {open: true},
+
+        [summary, content]);
+
+    return html.tag('li', details);
   },
 };