content, css: generateAdditionalFilesListChunk: description in li

3 files changed, 28 insertions, 19 deletions

diff --git a/src/content/dependencies/generateAdditionalFilesListChunk.js b/src/content/dependencies/generateAdditionalFilesListChunk.js
index d0a603a..5804115 100644
--- a/src/content/dependencies/generateAdditionalFilesListChunk.js
+++ b/src/content/dependencies/generateAdditionalFilesListChunk.js
@@ -18,29 +18,28 @@ export default {
   },
 
   generate(slots, {html, language}) {
-    const titleParts = ['releaseInfo.additionalFiles.entry'];
-    const titleOptions = {
-      title:
-        html.tag('span', {class: 'group-name'},
-          slots.title),
-    };
-
-    if (!html.isBlank(slots.description)) {
-      titleParts.push('withDescription');
-      titleOptions.description = slots.description;
-    }
-
     const summary =
       html.tag('summary',
         html.tag('span',
-          language.$(...titleParts, titleOptions)));
+          language.$('releaseInfo.additionalFiles.entry', {
+            title:
+              html.tag('span', {class: 'group-name'},
+                slots.title),
+          })));
+
+    const description =
+      html.tag('li', {class: 'entry-description'},
+        {[html.onlyIfContent]: true},
+        slots.description);
+
+    const items =
+      (html.isBlank(slots.items)
+        ? html.tag('li',
+            language.$('releaseInfo.additionalFiles.entry.noFilesAvailable'))
+        : slots.items);
 
     const content =
-      html.tag('ul',
-        (html.isBlank(slots.items)
-          ? html.tag('li',
-              language.$('releaseInfo.additionalFiles.entry.noFilesAvailable'))
-          : slots.items));
+      html.tag('ul', [description, items]);
 
     const details =
       html.tag('details',
diff --git a/src/static/site6.css b/src/static/site6.css
index ed2bb98..c1c4b9d 100644
--- a/src/static/site6.css
+++ b/src/static/site6.css
@@ -1095,6 +1095,16 @@ li > ul {
   margin-bottom: 10px;
 }
 
+.additional-files-list .entry-description {
+  list-style-type: none;
+  max-width: 540px;
+
+  /* This should be margin-bottom, but cascading rules
+   * cause some awkwardness - `#content li` takes precedence.
+   */
+  padding-bottom: 3px;
+}
+
 .group-contributions-table {
   display: inline-block;
 }
diff --git a/src/strings-default.yaml b/src/strings-default.yaml
index 004f867..4d31f3b 100644
--- a/src/strings-default.yaml
+++ b/src/strings-default.yaml
@@ -325,7 +325,7 @@ releaseInfo:
 
     entry:
       _: "{TITLE}"
-      withDescription: "{TITLE}: {DESCRIPTION}"
+
       noFilesAvailable: >-
         There are no files available or listed for this entry.