feat: link previews to page-list (closes #173)

assets/js/util.js

@@ -58,14 +58,12 @@ const highlight = (content, term) => {
   // try to find direct match first
   const directMatchIdx = content.indexOf(term)
   if (directMatchIdx !== -1) {
-    console.log(directMatchIdx)
     const h = highlightWindow
     const before = content.substring(0, directMatchIdx).split(" ").slice(-h)
     const after = content
       .substring(directMatchIdx + term.length, content.length - 2)
       .split(" ")
       .slice(0, h)
-    console.log(before, after)
     return (
       (before.length == h ? `...${before.join(" ")}` : before.join(" ")) +
       `<span class="search-highlight">${term}</span>` +

assets/styles/base.scss

@@ -592,9 +592,13 @@ header {
     font-size: 0.8rem;
   }
 
+  & > p {
+    margin: 0;
+    padding: 0.5rem 0;
+  } 
+
   & > p, & > a {
     font-size: 1rem;
-    margin: 0.7rem 0;
     font-weight: 400;
     user-select: none;
   }

layouts/partials/footer.html

@@ -3,7 +3,7 @@
 <hr/>
 
 {{if $.Site.Data.config.enableFooter}}
-<div class="page-end">
+<div class="page-end" id="footer">
     <div class="backlinks-container">
         {{partial "backlinks.html" .}}
     </div>

layouts/partials/footerIndex.html

@@ -1,6 +1,6 @@
 {{if $.Site.Data.config.enableFooter}}
   {{if $.Site.Data.graphConfig.enableGlobalGraph}}
-      <div class="page-end">
+      <div class="page-end" id="footer">
 
         <div>
             {{partial "graph.html" .}}
@@ -9,7 +9,7 @@
       </div>
   {{else}}
       <hr/>
-      <div class="page-end">
+      <div class="page-end" id="footer">
         <div class="backlinks-container">
             {{partial "backlinks.html" .}}
         </div>

layouts/partials/head.html

@@ -113,24 +113,6 @@
       addCollapsibleCallouts();
       {{ end }}
      
-      {{if $.Site.Data.config.enableFooter}}
-      const container = document.getElementById("graph-container")
-      // retry if the graph is not ready
-      if (!container) return requestAnimationFrame(render)
-      // clear the graph in case there is anything within it
-      container.textContent = ""
-
-      const drawGlobal = isHome && {{$.Site.Data.graphConfig.enableGlobalGraph}};
-      drawGraph(
-          {{strings.TrimRight "/" .Site.BaseURL}},
-          drawGlobal,
-          {{$.Site.Data.graphConfig.paths}},
-          drawGlobal ? {{$.Site.Data.graphConfig.globalGraph}} : {{$.Site.Data.graphConfig.localGraph}}
-        );
-
-      {{end}}
-
-
       {{if $.Site.Data.config.enableLinkPreview}}
       initPopover(
         {{strings.TrimRight "/" .Site.BaseURL }},
@@ -138,6 +120,26 @@
         {{$.Site.Data.config.enableLatex}}
       )
       {{end}}
+
+      {{if $.Site.Data.config.enableFooter}}
+      const footer = document.getElementById("footer")
+      if (footer) {
+        const container = document.getElementById("graph-container")
+        // retry if the graph is not ready
+        if (!container) return requestAnimationFrame(render)
+        // clear the graph in case there is anything within it
+        container.textContent = ""
+
+        const drawGlobal = isHome && {{$.Site.Data.graphConfig.enableGlobalGraph}};
+        drawGraph(
+            {{strings.TrimRight "/" .Site.BaseURL}},
+            drawGlobal,
+            {{$.Site.Data.graphConfig.paths}},
+            drawGlobal ? {{$.Site.Data.graphConfig.globalGraph}} : {{$.Site.Data.graphConfig.localGraph}}
+          );
+
+        }
+      {{end}}
     }
 
     const init = (doc = document) => {

layouts/partials/page-list.html

@@ -6,7 +6,7 @@
                 {{partial "date-fmt.html" .}}
             </p>
             <div class="desc">
-                <h3><a href="{{ .Permalink }}">{{- .Title -}}</a></h3>
+              <h3><a href="{{ .Permalink }}" class="internal-link" data-src="{{ .RelPermalink }}">{{- .Title -}}</a></h3>
             </div>
             <div class="spacer"></div>
             <ul class="tags">