From 437b05b64bf65254f3abccf313d41585685641c1 Mon Sep 17 00:00:00 2001
From: zzossig <zzossig@gmail.com>
Date: Sat, 29 Feb 2020 14:42:56 +0900
Subject: [PATCH] [new option] linenos=false [new icon] twich

#210 #211 #212

```makefile {linenos=false}
CC=gcc
```
---
 assets/sass/components/_pagination.scss       |  4 ++--
 assets/sass/pages/_single.scss                | 22 +++++++++++++++++++
 .../content/en/posts/syntax-highlight.md      | 21 ++++++++++++++++++
 layouts/partials/script/single-script.html    | 12 +++++-----
 layouts/partials/svgs/social/twitch.svg       |  1 +
 5 files changed, 52 insertions(+), 8 deletions(-)
 create mode 100644 layouts/partials/svgs/social/twitch.svg

diff --git a/assets/sass/components/_pagination.scss b/assets/sass/components/_pagination.scss
index 2aa9938..34161f6 100644
--- a/assets/sass/components/_pagination.scss
+++ b/assets/sass/components/_pagination.scss
@@ -54,7 +54,7 @@
 .pagination-single {
   @include flexbox();
   @include align-items(center);
-  @include justify-content(center);
+  @include justify-content(flex-end);
   @include flex-wrap(wrap);
   width: 100%;
   margin: 1rem 0;
@@ -94,7 +94,7 @@
   &__right {
     @include on-event {
       @include translateX(0.25rem);
-    }    
+    }
   }
 
   &__icon {
diff --git a/assets/sass/pages/_single.scss b/assets/sass/pages/_single.scss
index 834bedc..88b97c0 100644
--- a/assets/sass/pages/_single.scss
+++ b/assets/sass/pages/_single.scss
@@ -261,6 +261,17 @@
     .language-code .copy-to-clipboard:hover {
       @include translateY(-0.1rem);
     }
+    .highlight > .copy-to-clipboard {
+      position: absolute;
+      right: 4px;
+      top: 5px;      
+      border-radius: 2px;
+      z-index: z('clipboard');
+      @include transition(all, 0.2s, ease);
+    }
+    .highlight > .copy-to-clipboard:hover {
+      @include translateY(-0.1rem);
+    }
 
     blockquote {
       font-size: 1.05rem;
@@ -507,6 +518,16 @@ pre:not(.chroma) {
   }
 }
 
+.highlight {
+  position: relative;
+
+  @include on-event {
+    .copy-to-clipboard {
+      opacity: 1;
+    }
+  }
+}
+
 .highlight > .chroma {
   margin: 1em 0;
   border-radius: 5px;
@@ -514,6 +535,7 @@ pre:not(.chroma) {
   z-index: z('content');
   overflow-x: auto;
   direction: ltr;
+  position: relative;
 
   @include themify($codeblock) {
     color: themed('content-pre-color');
diff --git a/exampleSite/content/en/posts/syntax-highlight.md b/exampleSite/content/en/posts/syntax-highlight.md
index 4b691d3..17508ef 100644
--- a/exampleSite/content/en/posts/syntax-highlight.md
+++ b/exampleSite/content/en/posts/syntax-highlight.md
@@ -38,8 +38,29 @@ It is important to spell
 +new line
 ```
 
+```diff {hl_lines=[4,"6-7"], linenos=false}
+*** /path/to/original	''timestamp''
+--- /path/to/new	''timestamp''
+***************
+*** 1 ****
+! This is a line.
+--- 1 ---
+! This is a replacement line.
+It is important to spell
+-removed line
++new line
+```
+
 ### Makefile
 
+``` makefile {linenos=false}
+CC=gcc
+CFLAGS=-I.
+
+hellomake: hellomake.o hellofunc.o
+     $(CC) -o hellomake hellomake.o hellofunc.o -I.
+```
+
 ``` makefile
 CC=gcc
 CFLAGS=-I.
diff --git a/layouts/partials/script/single-script.html b/layouts/partials/script/single-script.html
index 61e1c01..e3542a6 100644
--- a/layouts/partials/script/single-script.html
+++ b/layouts/partials/script/single-script.html
@@ -310,7 +310,7 @@
     var clipInit = false;
     var preChromaElem = document.querySelectorAll('pre.chroma');
     var langCodeElem = document.querySelectorAll('.language-code');
-    var dolorCodeElem = document.querySelectorAll('div.language-\\$');
+    var dollarCodeElem = document.querySelectorAll('div.language-\\$');
     var gtCodeElem = document.querySelectorAll('div.language-\\>');
 
     var makeClipboard = function(elem) {
@@ -367,7 +367,7 @@
             var newClipboardElem = document.createElement('span');
             newClipboardElem.setAttribute('class', 'copy-to-clipboard');
             newClipboardElem.setAttribute('title', 'Copy to clipboard');
-            closest(code, 'div.chroma').append(newClipboardElem);
+            elem.parentNode.parentNode.insertBefore(newClipboardElem, elem.parentNode.nextElementSibling);
           }
         }
       }
@@ -394,8 +394,8 @@
       });
     }) : null;
 
-    dolorCodeElem ? 
-    dolorCodeElem.forEach(function(elem) {
+    dollarCodeElem ? 
+    dollarCodeElem.forEach(function(elem) {
       elem.querySelectorAll('code').forEach(function (codeElem) {
         makeSymbolClipboard(codeElem);
       });
@@ -411,8 +411,8 @@
 
 
     // ================ codeblock line number to symbol ================
-    dolorCodeElem ?
-    dolorCodeElem.forEach(function(elem) {
+    dollarCodeElem ?
+    dollarCodeElem.forEach(function(elem) {
       var lnts = elem.parentNode.parentNode ? elem.parentNode.parentNode.querySelectorAll('.lnt') : null;
       lnts ? 
       lnts.forEach(function(lnt) {
diff --git a/layouts/partials/svgs/social/twitch.svg b/layouts/partials/svgs/social/twitch.svg
new file mode 100644
index 0000000..c750505
--- /dev/null
+++ b/layouts/partials/svgs/social/twitch.svg
@@ -0,0 +1 @@
+<svg fill="#000000" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30" width="{{ .width }}" height="{{ .height }}"><path fill="currentColor" d="M 6 4 L 4 8 L 4 24 L 9 24 L 9 27 L 13 27 L 16 24 L 20 24 L 26 18 L 26 4 L 6 4 z M 8 6 L 24 6 L 24 17 L 21 20 L 15 20 L 12 23 L 12 20 L 8 20 L 8 6 z M 13 9 L 13 16 L 15 16 L 15 9 L 13 9 z M 17 9 L 17 16 L 19 16 L 19 9 L 17 9 z"/></svg>
\ No newline at end of file