jekyll-theme-centos 0.5.3 → 0.5.8

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: ae119c8f39b6aa8baec3821c6406c37f7ff3c7db0f8f87951ce13aff0054fc1d
-  data.tar.gz: c3520e53ade572d47f7da165aceb3e0a74a321bdc1d7306e51852ac86ebef84f
+  metadata.gz: daceb5812e455c146d36dc268efeb1d088faad2e1942b78b16d3772446725691
+  data.tar.gz: f623690b8fdb873dda2447df495c6c8da099a9c41acaef300667dc44c5f6c64b
 SHA512:
-  metadata.gz: 43b4c009adb1db0e55387f2e71847abaabd872782dd9d0d849e01777d1ae0da05e43918d71d4e6c2cfd0000c2de0809a1188b7faa83f80c247ef7959adb33ca0
-  data.tar.gz: 1a90c361bfeff9e7ef867fe1e8295977ea089a7d5fb71b783e8498e6a54d4690d68b9488aef2cd8805371151175e46110ad8e4a02b3e7a1fab8abaac03e6badb
+  metadata.gz: 80f3567f9d5e3da5b22dc7918239179c2ed0a72f0f90112d83ac2e305623810da30b8789c69f2a429824badb568b7c9e78795083efe602db7bd99bd91a9b8398
+  data.tar.gz: 41cc1a3a9885f3dada9fda45ef17e99755a91fd7b044adfd92d3474f3583ca8043c5a9b5a7e43df39b61e9cdd927f9bd8a349bab1adddb95e8401a94ab26d025

data/_includes/page/code-header.html

@@ -0,0 +1,4 @@
+<div class="code-header">
+    <button class="copy-code-button" aria-label="Copy code to clipboard"></button>
+</div>
+

data/_layouts/default.html

@@ -14,6 +14,7 @@
 
   <script src="/assets/js/jquery.min.js"></script>
   <script src="/assets/js/bootstrap.min.js"></script>
+  <script src="/assets/js/copycode.js"></script>
 </body>
 
 </html>

data/_sass/centos/_main.scss

@@ -116,32 +116,34 @@
 }
 
 .search {
-  @include content;
+  &__content {
+    @extend .col-sm-12;
+    @include content;
 
-  .ais-search-box {
-    max-width: 100%;
-    margin-bottom: 15px;
-  }
-  .ais-hits {
-    @include link-list;
-  }
-  .ais-pagination {
-    li {
-      text-decoration: none;
+    .ais-search-box {
+      max-width: 100%;
+      margin-bottom: 15px;
+    }
+    .ais-hits {
+      @include link-list;
+    }
+    .ais-pagination {
+      li {
+        text-decoration: none;
+      }
+    }
+    .ais-Highlight {
+      font-weight: bold;
+      font-style: normal;
+    }
+    .post-breadcrumbs {
+      display: block;
+      font-size: small;
+    }
+    .post-snippet img {
+      display: none;
     }
   }
-  .ais-Highlight {
-    font-weight: bold;
-    font-style: normal;
-  }
-  .post-breadcrumbs {
-    display: block;
-    font-size: small;
-  }
-  .post-snippet img {
-    display: none;
-  }
-
 }
 
 .download {

data/_sass/centos/_mixins.scss

@@ -2,5 +2,6 @@
 @import "mixins/_content-nav";
 @import "mixins/_aside-nav";
 @import "mixins/_link-list";
+@import "mixins/_code-header";
 
 @import "mixins/_post-nav-explorer"

data/_sass/centos/mixins/_code-header.scss

@@ -0,0 +1,41 @@
+@mixin code-header {
+
+  .code-header {
+    display: flex;
+    justify-content: flex-end;
+    background: $black;
+  }
+
+  .copy-code-button {
+    @extend .btn, .btn-dark, .shadow-none;
+    border-radius: 0px;
+    display: grid;
+    grid-auto-flow: column;
+    align-items: center;
+    grid-column-gap: 4px;
+    border: none;
+    cursor: pointer;
+    background-color: $black;
+    font-size: small;
+
+    &:before {
+      @extend .fas;
+      content: fa-content($fa-var-clipboard);
+    }
+    &:after {
+      content: "Copy";
+      display: block;
+    }
+
+    // This class will be toggled via JavaScript
+    &.copied {
+      &:before {
+        @extend .fas;
+        content: fa-content($fa-var-clipboard-check);
+      }
+      &:after {
+        content: "Copied!";
+      }
+    }
+  }
+}

data/_sass/centos/mixins/_content.scss

@@ -70,4 +70,5 @@
     margin-bottom: $line-height-base * 1em;
   }
 
+  @include code-header;
 }

data/assets/js/copycode.js

@@ -0,0 +1,18 @@
+// Thanks Aleksandr
+// https://www.aleksandrhovhannisyan.com/blog/how-to-add-a-copy-to-clipboard-button-to-your-jekyll-blog/
+const codeBlocks = document.querySelectorAll(".code-header + .highlighter-rouge");
+const copyCodeButtons = document.querySelectorAll(".copy-code-button");
+
+copyCodeButtons.forEach((copyCodeButton, index) => {
+  const code = codeBlocks[index].innerText;
+
+  copyCodeButton.addEventListener("click", () => {
+    window.navigator.clipboard.writeText(code);
+    copyCodeButton.classList.add("copied");
+
+    setTimeout(() => {
+      copyCodeButton.classList.remove("copied");
+      copyCodeButton.blur();
+    }, 2000);
+  });
+});

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: jekyll-theme-centos
 version: !ruby/object:Gem::Version
-  version: 0.5.3
+  version: 0.5.8
 platform: ruby
 authors:
 - Alain Reguera Delgado
@@ -97,6 +97,7 @@ files:
 - _includes/page/alert-info.html
 - _includes/page/alert-success.html
 - _includes/page/alert-warning.html
+- _includes/page/code-header.html
 - _includes/page/figure.html
 - _includes/page/video.html
 - _includes/post-nav-explorer.html
@@ -217,6 +218,7 @@ files:
 - _sass/centos/centos.scss
 - _sass/centos/fonts/_montserrat.scss
 - _sass/centos/mixins/_aside-nav.scss
+- _sass/centos/mixins/_code-header.scss
 - _sass/centos/mixins/_content-nav.scss
 - _sass/centos/mixins/_content.scss
 - _sass/centos/mixins/_link-list.scss
@@ -335,6 +337,7 @@ files:
 - assets/img/post.png
 - assets/js/bootstrap.min.js
 - assets/js/bootstrap.min.js.map
+- assets/js/copycode.js
 - assets/js/dataTables.bootstrap4.min.js
 - assets/js/instantsearch.min.js
 - assets/js/jquery.dataTables.min.js