Merge 8bf32c2283 into 7f630a4e31

README.md

@@ -83,7 +83,7 @@ Example:
 {{ image(src="/img/hello.png", alt="Hello Friend",
          position="left", style="border-radius: 8px;") }}
 ```
-  
+
 ### `figure`
 
 Same as `image`, but with a few extra optional arguments:
@@ -103,7 +103,9 @@ Example:
           caption_style="font-style: italic;") }}
 ```
 
-## OpenGraph
+## Features
+
+### OpenGraph
 
 To add an image to a post, set the `og_image` extra option to the desired image
 in the same directory of the markdown file:
@@ -121,6 +123,25 @@ Additionally, for the section pages and for posts to have a fallback image, add
 default_og_image = "static/ocean.jpg"
 ```
 
+### Comments
+
+[utterances] leverages Github issues to provide lightweight and maintenance free
+support for comments. To enable utterances, add the following to your `config.toml`:
+
+```toml
+[extra.utterances]
+enabled = true
+repo = "{github_username}/{github_repo}"
+post_map = "pathname"
+label = "utterances"
+theme = "github-dark-orange"
+```
+
+See the [utterances] documentation regarding these options:
+- [`post_map`](https://utteranc.es/#heading-issue-label)
+- [`label`](https://utteranc.es/#heading-mapping)
+- [`theme`](https://utteranc.es/#heading-theme)
+
 ## Configuration
 
 ### Only show the post's description
@@ -189,7 +210,7 @@ You can set the footer's copyright author name like this:
 # copyright text. Apart from author, it will
 # contain current year and a link to the theme.
 author = "My Name"
-``` 
+```
 
 If you don't like the default copyright text,
 you can set it to completely custom HTML:
@@ -218,13 +239,13 @@ menu_items = [
     # each of these is optional, name and url are required
     # $BASE_URL is going to be substituted by base_url from configuration
     {name = "blog", url = "$BASE_URL"},
-    
+
     # tags should only be enabled if you have "tags" taxonomy
     # see documentation below for more details
     {name = "tags", url = "$BASE_URL/tags"},
     {name = "archive", url = "$BASE_URL/archive"},
     {name = "about me", url = "$BASE_URL/about"},
-    
+
     # set newtab to true to make the link open in new tab
     {name = "github", url = "url-to-your-github", newtab = true},
 ]
@@ -241,7 +262,7 @@ taxonomies = [
 ]
 ```
 
-Enabling tags will create a new `/tags` page, and 
+Enabling tags will create a new `/tags` page, and
 cause them to show up in `archive` section. Note
 that you still need to create a menu link to the tags
 page manually.
@@ -428,3 +449,5 @@ for more information.
 
 The license for Hack fonts used is included in
 [LICENSE-Hack.md](../master/LICENSE-Hack.md).
+
+[utterances]: https://utteranc.es/

sass/buttons.scss

@@ -81,7 +81,7 @@ a.read-more:active {
     padding: 3px 8px;
     margin-bottom: 5px;
     text-align: center;
-    font-size: 13px;
+    font-size: 0.8125rem;
     font-weight: 500;
     border-radius: 8px;
     border: 1px solid transparent;

sass/font-hack-subset.scss

@@ -1,3 +1,8 @@
+html {
+  /* Base font size */
+  font-size: 16px;
+}
+
 /*!
  *  Hack typeface https://github.com/source-foundry/Hack
  *  License: https://github.com/source-foundry/Hack/blob/master/LICENSE.md

sass/font-hack.scss

@@ -1,3 +1,8 @@
+html {
+  /* Base font size */
+  font-size: 16px;
+}
+
 /*!
  *  Hack typeface https://github.com/source-foundry/Hack
  *  License: https://github.com/source-foundry/Hack/blob/master/LICENSE.md

sass/main.scss

@@ -29,8 +29,6 @@ body {
 }
 
 h1, h2, h3, h4, h5, h6 {
-  display: flex;
-  align-items: center;
   font-weight: bold;
   line-height: 1.3;
 }
@@ -97,7 +95,7 @@ figure {
   }
 
   figcaption {
-    font-size: 14px;
+    font-size: 0.875rem;
     padding: 5px 10px;
     margin-top: 5px;
     background: var(--accent);
@@ -118,7 +116,6 @@ figure {
 }
 
 code {
-  font-family: Hack, DejaVu Sans Mono, Monaco, Consolas, Ubuntu Mono, monospace;
   font-feature-settings: normal;
   background: var(--accent-alpha-20);
   padding: 1px 6px;
@@ -127,7 +124,6 @@ code {
 }
 
 pre {
-  font-family: Hack, DejaVu Sans Mono, Monaco, Consolas, Ubuntu Mono, monospace;
   padding: 20px;
   font-size: .95rem;
   overflow: auto;

sass/pagination.scss

@@ -1,13 +1,13 @@
 @import 'variables';
 
 .pagination {
-  margin-top: 50px;
+  margin-top: 25px;
 
   &__title {
     display: flex;
     text-align: center;
     position: relative;
-    margin: 100px 0 20px;
+    margin: 25px 0 20px;
 
     &-h {
       text-align: center;

templates/macros/post.html

@@ -108,3 +108,18 @@
         </span>
     {% endif -%}
 {% endmacro tags %}
+
+{% macro comments(page) %}
+    {%- if config.extra.utterances.enabled and page.relative_path is not starting_with("pages/") %}
+        <div class="comments">
+            <div class="comments__title">
+                <span class="comments__title-h">comments</span>
+                <hr />
+            </div>
+
+            <script src="https://utteranc.es/client.js" repo="{{ config.extra.utterances.repo }}"
+                issue-term="{{ config.extra.utterances.post_map }}" label="{{ config.extra.utterances.label }}"
+                theme="{{ config.extra.utterances.theme }}" crossorigin="anonymous" async></script>
+        </div>
+    {% endif -%}
+{% endmacro comments %}

templates/page.html

@@ -8,6 +8,7 @@
     <div class="post">
         {{ post_macros::header(page=page) }}
         {{ post_macros::content(page=page, summary=false, show_only_description=false) }}
+        {{ post_macros::comments(page=page) }}
         {{ post_macros::earlier_later(page=page) }}
     </div>
 {% endblock content %}