From 2aef32a553f51f8311dad8e5cc5aaf8057c536d4 Mon Sep 17 00:00:00 2001
From: Alexander Bilz <mail@alexbilz.com>
Date: Sat, 26 Jun 2021 12:56:01 +0000
Subject: [PATCH] feat: Added gitalk comments

---
 layouts/_default/single.html          |    7 +++++++
 assets/css/style.css                  |    2 +-
 README.md                             |   13 +++++++++++++
 layouts/partials/comments/gitalk.html |   22 ++++++++++++++++++++++
 4 files changed, 43 insertions(+), 1 deletions(-)

diff --git a/README.md b/README.md
index 93425f4..473c543 100644
--- a/README.md
+++ b/README.md
@@ -314,6 +314,19 @@
 CommentoURL = "https://commento.example.com/js/commento.js"
 ```
 
+### Comments powered by Gitalk
+
+No comment section is shown on the `single.html` unless a `repo` is specified in the `config.toml` file. If uncertain how parameter to configure, check out the official [documentation](https://github.com/gitalk/gitalk).
+
+```toml
+[params.gitalk]
+clientID = "GitHub Application Client ID"
+clientSecret = "GitHub Application Client Secret"
+repo = "Repository name to store issues"
+owner = "GitHub repo owner"
+admin = "GitHub repo owner and collaborators, only these guys can initialize gitHub issues"
+```
+
 ### Disabling Comments Per Page
 
 Comments can be disabled per page by setting `disableComments: true` on the pages [Front Matter](https://gohugo.io/content-management/front-matter/)
diff --git a/assets/css/style.css b/assets/css/style.css
index 21e9cc4..e9450c0 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -348,7 +348,7 @@
 
 .post .post-title h1 {
   text-transform: uppercase;
-  font-size: 3.0em;
+  font-size: 3em;
   letter-spacing: 1px;
   line-height: 1;
 }
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 67fb10a..cd09fdc 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -82,6 +82,13 @@
         </div>
 
       {{- end -}}
+      {{- if .Site.Params.gitalk.repo -}}
+        <div id="fb_comments_container">
+          <h2>{{ i18n "comments" }}</h2>
+          {{ partial "comments/gitalk.html" . }}
+        </div>
+
+      {{- end -}}
 
 
     {{ end }}
diff --git a/layouts/partials/comments/gitalk.html b/layouts/partials/comments/gitalk.html
new file mode 100644
index 0000000..9dcbb44
--- /dev/null
+++ b/layouts/partials/comments/gitalk.html
@@ -0,0 +1,22 @@
+<div id="gitalk-container"></div>
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.css" />
+<script src="https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.min.js"></script>
+<script>
+  const gitalk = new Gitalk({
+    clientID: '{{ .Site.Params.Gitalk.clientID }}',
+    clientSecret: '{{ .Site.Params.Gitalk.clientSecret }}',
+    repo: '{{ .Site.Params.Gitalk.repo }}',
+    owner: '{{ .Site.Params.Gitalk.owner }}',
+    admin: ['{{ .Site.Params.Gitalk.admin }}'],
+    id: location.pathname, // Ensure uniqueness and length less than 50
+    distractionFreeMode: false, // Facebook-like distraction free mode
+  });
+  (function () {
+    if (['localhost', '127.0.0.1'].indexOf(window.location.hostname) != -1) {
+      document.getElementById('gitalk-container').innerHTML =
+        'Gitalk comments not available by default when the website is previewed locally.';
+      return;
+    }
+    gitalk.render('gitalk-container');
+  })();
+</script>

--
Gitblit v1.10.0