From e38eaa94d6d0d91486bd3b778102658a36ee254f Mon Sep 17 00:00:00 2001
From: Vincent Huang <vincenthuang75025@yahoo.com>
Date: Sun, 21 Aug 2022 01:31:06 +0000
Subject: [PATCH] Popover preview should show relevant heading (#180)

---
 layouts/partials/head.html |   69 +++++++++++++++++++++-------------
 1 files changed, 42 insertions(+), 27 deletions(-)

diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index 7dfbd50..6b465da 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -23,16 +23,16 @@
   {{ end }}
 
   <!-- CSS Stylesheets and Fonts -->
-  <link
-    href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Source+Sans+Pro:wght@400;600;700&family=Fira+Code:wght@400;700&display=swap"
-    rel="stylesheet"
-  />
   {{$sass := resources.Match "styles/[!_]*.scss" }}
   {{$css := slice }}
   {{range $sass}}
   {{$scss := . | resources.ToCSS (dict "outputStyle" "compressed") }}
   {{$css = $css | append $scss}}
   {{end}}
+  {{if $.Site.Data.config.enableCallouts}}
+    {{$scss := resources.Get "styles/_callouts.scss" | resources.ToCSS (dict "outputStyle" "compressed") }}
+    {{$css = $css | append $scss}}
+  {{end}}
   {{$finalCss := $css | resources.Concat "styles.css" | resources.Fingerprint "md5" | resources.Minify  }}
   <link href="{{$finalCss.Permalink}}" rel="stylesheet" />
 
@@ -40,10 +40,16 @@
   <link href="{{$lightSyntax.Permalink}}" rel="stylesheet" id="theme-link">
 
    <!-- Base scripts -->
-  {{ $darkMode := resources.Get "js/darkmode.js" | resources.ExecuteAsTemplate "js/darkmode.js" . | resources.Fingerprint "md5" | resources.Minify }}
-  <script src="{{$darkMode.Permalink}}"></script>
+  {{$scripts := (slice "js/darkmode.js" "js/util.js")}}
+  {{range $scripts}}
+  {{$scriptname := .}}
+  {{ $s := resources.Get $scriptname | resources.ExecuteAsTemplate $scriptname . | resources.Fingerprint "md5" | resources.Minify }}
+  <script src="{{$s.Permalink}}"></script>
+  {{end}}
   {{partial "katex.html" .}}
-
+    
+  <script src="https://unpkg.com/@floating-ui/core@0.7.3"></script>
+  <script src="https://unpkg.com/@floating-ui/dom@0.5.4"></script>
   {{ $popover := resources.Get "js/popover.js" | resources.Fingerprint "md5" |
   resources.Minify }}
   <script src="{{$popover.Permalink}}"></script>
@@ -56,9 +62,12 @@
 
   {{ if $.Site.Data.config.enableCodeBlockCopy }}
   {{ $clipboard := resources.Get "js/clipboard.js" | resources.Fingerprint "md5" | resources.Minify }}
-  {{ if (findRE "<pre" .Content 1) }}
-    <script src="{{$clipboard.Permalink}}"></script>
+  <script src="{{$clipboard.Permalink}}"></script>
   {{ end }}
+
+  {{ if $.Site.Data.config.enableCallouts }}
+  {{ $callouts := resources.Get "js/callouts.js" | resources.Fingerprint "md5" | resources.Minify }}
+  <script src="{{$callouts.Permalink}}"></script>
   {{ end }}
 
   <!--  Preload page vars  -->
@@ -100,24 +109,10 @@
       addTitleToCodeBlocks();
       {{ 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.enableCallouts -}}
+      addCollapsibleCallouts();
+      {{ end }}
+     
       {{if $.Site.Data.config.enableLinkPreview}}
       initPopover(
         {{strings.TrimRight "/" .Site.BaseURL }},
@@ -125,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) => {

--
Gitblit v1.10.0