astro-accelerator 0.0.102 → 0.0.103

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.0.102",
+  "version": "0.0.103",
   "author": "Steve Fenton",
   "name": "astro-accelerator",
   "description": "A super-lightweight, accessible, SEO-friendly starter project for Astro",

package/public/css/main.css

@@ -14,11 +14,11 @@ html {
     outline: 0;
     padding: 0;
     vertical-align: baseline;
- }
+}
 
- html {
+html {
     scroll-padding-top: 5em;
- }
+}
 
 body {
     background-color: var(--aft);
@@ -642,6 +642,28 @@ form.site-search button {
     font-family: var(--code-font);
 }
 
+.result-headings li {
+    display: none;
+}
+
+.result-headings li:nth-child(-n+3) {
+    display: block;
+}
+
+.result-headings:has(li:nth-child(n+4))::after {
+    content: 'See more >';
+    color: var(--fore-link);
+    text-decoration: underline;
+  }
+
+.result-headings:focus-within li {
+    display: block;
+}
+
+.result-headings:focus-within::after {
+    display: none;
+}
+
 .show-more {
     padding: 0.5em 1em;
     background-color: var(--fore-link);

package/public/js/search.js

@@ -188,25 +188,30 @@ function search(s, r) {
         markers.className = 'result-text';
         markers.innerHTML = highlight(needle.description, queryTerms);
 
-        const headings = document.createElement('ul');
-        markers.className = 'result-headings';
-
-        needle.matchedHeadings
-            .forEach(h => {
-                const item = document.createElement('li');
-                const link = document.createElement('a');
-                link.href = url + '#' + h.slug;
-                link.innerHTML = highlight(h.text, queryTerms);
-                item.appendChild(link);
-                headings.append(item);
-            });
-
         const li = document.createElement('li');
+        li.dataset.score = (Math.round((needle.score/ total) * 100)).toString();
         li.appendChild(a);
         li.appendChild(path);
         li.appendChild(markers);
-        li.append(headings);
-        li.dataset.score = (Math.round((needle.score/ total) * 100)).toString();
+
+        if (needle.matchedHeadings.length > 0) {
+            const headings = document.createElement('ul');
+            headings.className = 'result-headings';
+
+            headings.tabIndex = 0;
+
+            needle.matchedHeadings
+                .forEach(h => {
+                    const item = document.createElement('li');
+                    const link = document.createElement('a');
+                    link.href = url + '#' + h.slug;
+                    link.innerHTML = highlight(h.text, queryTerms);
+                    item.appendChild(link);
+                    headings.append(item);
+                });
+
+            li.appendChild(headings);
+        }
 
         ol.appendChild(li);
     }