jekyll-text-theme 2.0.0 → 2.0.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 8d40ef49df1da21ab016b2ab711248fac71b6d12
-  data.tar.gz: 76b07e568155511b54e0ed869e4bcc6d44c9ed58
+  metadata.gz: 32a22a3074ab0f4f8246caba2cc52209b494e056
+  data.tar.gz: 97c05e54f41bf0d1dfbeac5b70f60c3297f64f06
 SHA512:
-  metadata.gz: 21bf66cb310779454b5054de19d130e75287abe59b5e76b52388d5880708f9853dbe30109392e3435494ccba91f83236c8c4beff7696b5131bdc40c9c1a743d7
-  data.tar.gz: 987d9ae4fe46c3aee45b995d130e7a564e8f75c0d722d1b22b94194f89a51df7848b110f0ee75668a43ff2bfc9679086d5986c1fc1e823ffde48c2d53c7e56d9
+  metadata.gz: f199ddcd6a845ee96893524aa30315da07af55dfebb27bcd2d2cf10bad4e0be7abcc537f24f6af63a1f3f03f8d2bfac06ca01abec34fa06995786b67433b4504
+  data.tar.gz: 3256fcf3d4fad70f0a1bfb319169f3df2b776203e09a7fb1103dc22951e482c53b0cabea488911c8044ea8fb260d8d32ac1b032cfcf393b2e1756a7ea20cf0b0

data/_includes/markdown-enhancements.html

@@ -10,7 +10,7 @@
 {%- endif -%}
 
 {%- assign __target = site.data.variables.default.mathjax -%}
-{%- assign __source = site.chart -%}
+{%- assign __source = site.mathjax -%}
 {%- include snippets/assign.html -%}
 
 {%- assign __target = __return -%}
@@ -21,7 +21,7 @@
 {%- endif -%}
 
 {%- assign __target = site.data.variables.default.mermaid -%}
-{%- assign __source = site.chart -%}
+{%- assign __source = site.mermaid -%}
 {%- include snippets/assign.html -%}
 
 {%- assign __target = __return -%}

data/_includes/scripts/archieve.js

@@ -100,7 +100,7 @@
     var $root = $('.js-all');
     var $searchBox = $('.js-search-box');
     var $searchInput = $searchBox.children('input');
-    var $searchClear = $searchBox.children('.icon-clear');
+    var $searchClear = $searchBox.children('.js-icon-clear');
     var $tags = $('.js-tags');
     var $articleTags = $('.js-article-tag');
     var $tagShowAll = $('.js-tag-show-all');

data/_includes/scripts/aside/toc.js

@@ -4,7 +4,7 @@
   window.Lazyload.js(SOURCES.jquery, function() {
     var $window = $(window);
     var $articleContent = $('.js-article-content');
-    var $tocRoot = $('.js-toc-root'), $col2 = $('.js-col-2');
+    var $tocRoot = $('.js-toc-root'), $col2 = $('.js-col-aside');
     var toc;
     var tocDisabled = false;
     var hasSidebar = $('.js-page-root').hasClass('layout--page--sidebar');

data/_includes/scripts/common.js

@@ -1,3 +1,7 @@
-/*(function () {
-
-})();*/
+(function () {
+  var $root = document.getElementsByClassName('root')[0];
+  if (window.hasEvent('touchstart')) {
+    $root.dataset.isTouch = true;
+    document.addEventListener('touchstart', function(){}, false);
+  }
+})();

data/_layouts/archive.html

@@ -8,14 +8,16 @@ titles:
 show_title: false
 ---
 
-<div class="layout--all js-all">
+<div class="layout--archive js-all">
   <div class="search-box js-search-box">
-    <div class="icon-search"><i class="fas fa-search"></i></div>
+    <div class="search-box__icon-search"><i class="fas fa-search"></i></div>
     <input type="text" />
-    <div class="button icon-clear"><i class="fas fa-times"></i></div>
+    <div class="search-box__icon-clear js-icon-clear">
+      <div class="button button--secondary button--circle button--sm"><i class="fas fa-times"></i></div>
+    </div>
   </div>
   {%- include tags.html -%}
-  <div class="js-result layout--all__result"></div>
+  <div class="js-result layout--archive__result"></div>
 </div>
 
 <script>

data/_layouts/article.html

@@ -13,15 +13,6 @@ type: article
 
 <div class="layout--article">
 
-  {%- if _show_author_profile -%}
-    {%- if page.author -%}
-      {%- assign __author = site.data.authors[page.author] -%}
-    {%- else -%}
-      {%- assign __author = site.author -%}
-    {%- endif -%}
-    {%- include author-profile.html -%}
-  {%- endif -%}
-
   <div class="article__content" itemprop="articleBody">{{ content }}</div>
 
   <footer class="article__footer">
@@ -40,6 +31,16 @@ type: article
       <meta itemprop="dateModified" content="{{ page.date | date_to_xmlschema }}">
     {%- endif -%}
     {%- include article-footer/custom.html -%}
+
+    {%- if _show_author_profile -%}
+      {%- if page.author -%}
+        {%- assign __author = site.data.authors[page.author] -%}
+      {%- else -%}
+        {%- assign __author = site.author -%}
+      {%- endif -%}
+      {%- include article-footer/author-profile.html -%}
+    {%- endif -%}
+
     {%- if page.license -%}
       <div class="article__license">{%- include article-footer/license.html -%}</div>
     {%- endif -%}

data/_layouts/base.html

@@ -10,9 +10,13 @@ layout: none
       {%- include scripts/utils.js -%}
       {%- include scripts/lib/throttle.js -%}
       {%- include scripts/lib/lazyload.js -%}
-      {%- include scripts/common.js -%}
     </script>
     {%- include scripts/variables.html -%}
   </head>
-  <body>{{ content }}</body>
+  <body>
+    <div class="root" data-is-touch="false">
+      {{ content }}
+    </div>
+    <script>{%- include scripts/common.js -%}</script>
+  </body>
 </html>

data/_layouts/home.html

@@ -31,7 +31,7 @@ show_title: false
           {%- endif -%}
         </div>
 
-        <a href="{{ _href }}">{{ _locale_readmore }}</a>
+        <p><a href="{{ _href }}">{{ _locale_readmore }}</a></p>
         {%- include article-info.html -%}
       </article>
     {%- endfor -%}

data/_layouts/landing.html

@@ -31,7 +31,7 @@ full_width: true
         {%- include snippets/get-nav-url.html -%}
         {%- assign _url = __return -%}
         {%- assign _type = _action.type | default: 'info' -%}
-        <li><a class="button button--{{ _type }} button--rounded button--lg" href="{{ _url }}">{{ _action.text }}</a></li>
+        <li><a class="button button--{{ _type }} button--pill button--lg" href="{{ _url }}">{{ _action.text }}</a></li>
       {%- endfor -%}
       </ul>
       {%- endif -%}
@@ -62,7 +62,7 @@ full_width: true
                 {%- include snippets/get-nav-url.html -%}
                 {%- assign _url = __return -%}
                 {%- assign _type = _action.type | default: 'outline-info' -%}
-                <li><a class="button button--{{ _type }} button--rounded button--lg" href="{{ _url }}">{{ _action.text }}</a></li>
+                <li><a class="button button--{{ _type }} button--pill button--lg" href="{{ _url }}">{{ _action.text }}</a></li>
               {%- endfor -%}
               </ul>
             {%- endif -%}
@@ -92,7 +92,7 @@ full_width: true
                           {%- include snippets/get-nav-url.html -%}
                           {%- assign _url = __return -%}
                           {%- assign _type = _action.type | default: 'outline-info' -%}
-                          <li><a class="button button--{{ _type }} button--rounded button--lg" href="{{ _url }}">{{ _action.text }}</a></li>
+                          <li><a class="button button--{{ _type }} button--pill button--lg" href="{{ _url }}">{{ _action.text }}</a></li>
                         {%- endfor -%}
                       </ul>
                     {%- endif -%}

data/_layouts/page.html

@@ -73,7 +73,7 @@ layout: base
         <div class ="main">
       {%- endif -%}
 
-          <div class="col-2 js-col-2">
+          <div class="col-aside js-col-aside">
             {%- if page.aside -%}
               <aside class="page__aside js-page-aside">
                 {%- include aside/toc.html -%}
@@ -81,7 +81,7 @@ layout: base
             {%- endif -%}
           </div>
 
-          <div class="col-1">
+          <div class="col-main">
             {%- if _page_type == 'article' -%}
               <article itemscope itemtype="http://schema.org/Article">
             {%- elsif _page_type == 'webpage' -%}
@@ -101,9 +101,10 @@ layout: base
                     {%- if site.repository and site.repository_tree -%}
                       {%- assign __locale = site.data.locale.POST_ON_GITHUB -%}
                       {%- include snippets/locale-to-string.html -%}
-                      <a class="edit-on-github-button button button--secondary button--rounded button--sm"
+                      <a class="edit-on-github ml-3"
+                        title="{{ __return }}"
                         href="https://github.com/{{ site.repository }}/tree/{{ site.repository_tree }}/{{ page.path }}">
-                        <i class="fab fa-github"></i> {{ __return }}</a>
+                        <i class="far fa-edit"></i></a>
                     {%- endif -%}
                   {%- endif -%}
               {%- if _show_title or _show_edit_on_github -%}

data/_sass/common/_classes.scss

@@ -3,6 +3,7 @@
 @import
   "common/classes/animation",
   "common/classes/clearfix",
+  "common/classes/clickable",
   "common/classes/flex",
   "common/classes/horizontal-rules",
   "common/classes/pseudo",

data/_sass/common/_function.scss

@@ -0,0 +1,7 @@
+@function get-color-theme($color) {
+  @if lightness($color) < 15% {
+    @return 'dark';
+  } @else {
+    @return 'light';
+  }
+}

data/_sass/common/_reset.scss

@@ -54,6 +54,10 @@ body {
   }
 }
 
+.root {
+  height: 100%;
+}
+
 input, textarea, select, button {
   font: map-get($base, font-weight) #{map-get($base, font-size)}/#{map-get($base, line-height)} map-get($base, font-family);
   color: $text-color;
@@ -126,9 +130,9 @@ a {
     text-decoration: underline;
   }
   @include active() {
-    text-decoration: underline;
+    text-decoration: none;
   }
-  @include link-colors($main-color-1, $main-color-1, $main-color-1);
+  @include link-colors($main-color-1);
   @include transition(map-get($link, transition));
 }
 

data/_sass/common/_variables.scss

@@ -96,7 +96,7 @@ $link: (
 );
 
 $button: (
-  padding-y-lg:           .5rem,
+  padding-y-lg:           .3rem,
   padding-x-lg:           1.2rem,
 
   padding-y:              .1rem,
@@ -107,9 +107,11 @@ $button: (
 
   font-weight:            map-get($base, font-weight-bold),
 
-  circle-diameter-lg:     3rem,
+  pill-radius:            4rem,
+
+  circle-diameter-lg:     2.8rem,
   circle-diameter:        2rem,
-  circle-diameter-sm:     1.2rem,
+  circle-diameter-sm:     1.5rem,
 
   transition:             all .2s ease-in-out
 );

data/_sass/common/classes/_clickable.scss

@@ -0,0 +1,115 @@
+@mixin clickable($clr, $bg-clr, $hover-clr: default, $hover-bg-clr: default, $active-clr: default, $active-bg-clr: default, $focus-clr: default, $focus-bg-clr: default, $theme: default) {
+
+  @if $theme == default {
+    @if $bg-clr == null and $hover-bg-clr == null {
+      @if $hover-clr == default {
+        $theme: get-color-theme($clr);
+      } @else {
+        $theme: get-color-theme($hover-clr);
+      }
+    } @else {
+      @if $hover-bg-clr == default {
+        $theme: get-color-theme($bg-clr);
+      } @else {
+        $theme: get-color-theme($hover-bg-clr);
+      }
+    }
+  }
+
+  // hover
+  @if $hover-clr == default {
+    @if $hover-bg-clr == null {
+      @if $theme == 'light' {
+        $hover-clr: darken($clr, 14%);
+      }
+      @if $theme == 'dark' {
+        $hover-clr: lighten($clr, 18%);
+      }
+    } @else if $hover-bg-clr == default {
+      $hover-clr: $clr
+    }
+  }
+
+  @if $hover-bg-clr == default {
+    @if $theme == 'light' {
+      $hover-bg-clr: darken($bg-clr, 14%);
+    }
+    @if $theme == 'dark' {
+      $hover-bg-clr: lighten($bg-clr, 18%);
+    }
+  }
+
+  // active
+  @if $active-clr == default {
+    @if $active-bg-clr == null {
+      @if $theme == 'light' {
+        $active-clr: darken($hover-clr, 15%);
+      }
+      @if $theme == 'dark' {
+        $active-clr: lighten($hover-clr, 16%);
+      }
+    } @else if $active-bg-clr == default {
+      $active-clr: $hover-clr;
+    }
+  }
+
+  @if $active-bg-clr == default {
+    @if $theme == 'light' {
+      $active-bg-clr: darken($hover-bg-clr, 15%);
+    }
+    @if $theme == 'dark' {
+      $active-bg-clr: lighten($hover-bg-clr, 16%);
+    }
+  }
+
+  // focus
+  @if $focus-clr == default {
+    @if $focus-bg-clr == null {
+      $focus-clr: $hover-clr;
+    } @else if $hover-bg-clr == default {
+      $focus-clr: $hover-clr;
+    }
+  }
+
+  @if $focus-bg-clr == default {
+    $focus-bg-clr: $hover-bg-clr;
+  }
+
+  @include plain {
+    color: $clr;
+    @if $bg-clr {
+      background-color: $bg-clr;
+    }
+    svg path {
+      fill: $clr;
+    }
+  }
+  @include hover {
+    color: $hover-clr;
+    @if $hover-bg-clr {
+      background-color: $hover-bg-clr;
+    }
+    svg path {
+      fill: $hover-clr;
+    }
+  }
+  @include active {
+    color: $active-clr;
+    @if $active-bg-clr {
+      background-color: $active-bg-clr;
+    }
+    svg path {
+      fill: $active-clr;
+    }
+  }
+  @include focus {
+    color: $focus-clr;
+    @if $focus-bg-clr{
+      box-shadow: 0 0 0 2px rgba($focus-bg-clr, .4);
+      background-color: $focus-bg-clr;
+    }
+    svg path {
+      fill: $focus-clr;
+    }
+  }
+}

data/_sass/common/classes/_link.scss

@@ -1,34 +1,65 @@
-@mixin link-colors($clr, $hover-clr: default, $active-clr: default, $focus-clr: null) {
-  @if $hover-clr == default {
-    $hover-clr: $clr;
-  }
-  @if $active-clr == default {
-    $active-clr: $clr;
-  }
-  @include plain {
-    color: $clr;
-    svg path {
-      fill: $clr;
-    }
-  }
-  @include hover {
-    color: $hover-clr;
-    svg path {
-      fill: $hover-clr;
-    }
-  }
-  @include active {
-    color: $active-clr;
-    svg path {
-      fill: $active-clr;
-    }
-  }
-  @if $focus-clr {
-    @include focus {
-      color: $focus-clr;
-      svg path {
-        fill: $focus-clr;
-      }
-    }
-  }
+@mixin link-colors($clr, $hover-clr: default, $active-clr: default, $focus-clr: null, $theme: default) {
+  @include clickable($clr, null, $hover-clr, null, $active-clr, null, $focus-clr, null, $theme: default);
+
+  // @if $theme == default {
+  //   @if $hover-clr == default {
+  //     $theme: get-color-theme($clr);
+  //   } @else {
+  //     $theme: get-color-theme($hover-clr);
+  //   }
+  // }
+
+  // @if $hover-clr == default {
+  //   @if $theme == 'light' {
+  //     $hover-clr: darken($clr, 14%);
+  //   }
+  //   @if $theme == 'dark' {
+  //     $hover-clr: lighten($clr, 18%);
+  //   }
+  // }
+
+  // @if $active-clr == default {
+  //   @if $theme == 'light' {
+  //     $active-clr: darken($hover-clr, 15%);
+  //   }
+  //   @if $theme == 'dark' {
+  //     $active-clr: lighten($hover-clr, 16%);
+  //   }
+  // }
+
+  // @if $focus-clr == default {
+  //   @if $theme == 'light' {
+  //     $focus-clr: $hover-clr;
+  //   }
+  //   @if $theme == 'dark' {
+  //     $focus-clr: $hover-clr;
+  //   }
+  // }
+
+  // @include plain {
+  //   color: $clr;
+  //   svg path {
+  //     fill: $clr;
+  //   }
+  // }
+  // @include hover {
+  //   color: $hover-clr;
+  //   svg path {
+  //     fill: $hover-clr;
+  //   }
+  // }
+  // @include active {
+  //   color: $active-clr;
+  //   svg path {
+  //     fill: $active-clr;
+  //   }
+  // }
+  // @if $focus-clr {
+  //   @include focus {
+  //     color: $focus-clr;
+  //     svg path {
+  //       fill: $focus-clr;
+  //     }
+  //   }
+  // }
 }

data/_sass/common/classes/_pseudo.scss

@@ -7,20 +7,20 @@
 }
 
 @mixin hover() {
-  &:hover {
+  .root[data-is-touch="false"] &:hover {
     @content;
   }
 }
 
 @mixin active() {
-  &.active,
-  &:active {
+  .root[data-is-touch] &.active,
+  .root[data-is-touch] &:active {
     @content;
   }
 }
 
 @mixin focus() {
-  &.focus {
+  .root[data-is-touch] &.focus {
     @content;
   }
 }

data/_sass/common/classes/_spacing.scss

@@ -28,11 +28,23 @@
     $_dirs: ('top', 'bottom');
   }
   @else if ($direction == '') {
-    $_dirs: ('top', 'bottom', 'left', 'right');
+    $_dirs: ('');
   }
 
   @each $dir in $_dirs {
-    #{$_type}-#{$dir} : map-get($spacers, $spacer);
+    @if ($spacer == 'auto') {
+      @if ($dir == '') {
+        #{$_type}: auto;
+      } @else {
+        #{$_type}-#{$dir}: auto;
+      }
+    } @else {
+      @if ($dir == '') {
+        #{$_type}: map-get($spacers, $spacer);
+      } @else {
+        #{$_type}-#{$dir}: map-get($spacers, $spacer);
+      }
+    }
   }
 }
 
@@ -49,4 +61,10 @@ $_spacers: (0, 1, 2, 3, 4, 5);
       }
     }
   }
+}
+
+@each $j in $_directions {
+  .m#{$j}-auto {
+    @include make-spacing('m', $j, 'auto');
+  }
 }

data/_sass/common/components/_button.scss

@@ -1,73 +1,3 @@
-@mixin button-colors($clr, $bg-clr, $hover-clr: default, $hover-bg-clr: default, $active-clr: default, $active-bg-clr: default, $focus-clr: default, $focus-bg-clr: default, $theme: default) {
-  @if $theme == default {
-    $theme: light;
-  }
-  @if $hover-clr == default {
-    $hover-clr: $clr
-  }
-  @if $hover-bg-clr == default {
-    @if $theme == 'light' {
-      $hover-bg-clr: darken($bg-clr, 13%);
-    }
-    @if $theme == 'dark' {
-      $hover-bg-clr: lighten($bg-clr, 23%);
-    }
-  }
-
-  @if $active-clr == default {
-    $active-clr: $clr
-  }
-  @if $active-bg-clr == default {
-    @if $theme == 'light' {
-      $active-bg-clr: darken($bg-clr, 13%);
-    }
-    @if $theme == 'dark' {
-      $active-bg-clr: lighten($bg-clr, 23%);
-    }
-  }
-
-  @if $focus-clr == default {
-    $focus-clr: $clr
-  }
-  @if $focus-bg-clr == default {
-    @if $theme == 'light' {
-      $focus-bg-clr: darken($bg-clr, 13%);
-    }
-    @if $theme == 'dark' {
-      $focus-bg-clr: lighten($bg-clr, 23%);
-    }
-  }
-  @include plain {
-    color: $clr;
-    background-color: $bg-clr;
-    svg path {
-      fill: $clr;
-    }
-  }
-  @include hover {
-    color: $hover-clr;
-    background-color: $hover-bg-clr;
-    svg path {
-      fill: $hover-clr;
-    }
-  }
-  @include active {
-    color: $active-clr;
-    background-color: $active-bg-clr;
-    svg path {
-      fill: $active-clr;
-    }
-  }
-  @include focus {
-    color: $focus-clr;
-    @include box-shadow(2, $focus-bg-clr);
-    background-color: $focus-bg-clr;
-    svg path {
-      fill: $focus-clr;
-    }
-  }
-}
-
 @mixin button() {
   font-weight: map-get($button, font-weight);
   line-height: map-get($base, line-height);
@@ -75,6 +5,7 @@
   display: inline-block;
   cursor: pointer;
   text-decoration: none !important;
+  @include user-select(none);
   @include transition(map-get($button, transition));
   svg {
     width: 1rem;
@@ -99,67 +30,67 @@
 }
 
 .button--primary {
-  @include button-colors($text-color-1, $main-color-1);
+  @include clickable($text-color-1, $main-color-1);
 }
 
 .button--secondary {
-  @include button-colors($text-color-3, $main-color-3);
+  @include clickable($text-color-3, $main-color-3);
 }
 
 .button--success {
-  @include button-colors($text-color-function, $green);
+  @include clickable($text-color-function, $green);
 }
 
 .button--info {
-  @include button-colors($text-color-function, $blue);
+  @include clickable($text-color-function, $blue);
 }
 
 .button--warning {
-  @include button-colors($text-color-function, $yellow);
+  @include clickable($text-color-function, $yellow);
 }
 
 .button--error {
-  @include button-colors($text-color-function, $red);
+  @include clickable($text-color-function, $red);
 }
 
 .button--outline-primary {
   color: $main-color-1;
   border: 1px solid $main-color-1;
-  @include button-colors($main-color-1, transparent, $text-color-1, $main-color-1, $text-color-1, $main-color-1, $text-color-1, $main-color-1);
+  @include clickable($main-color-1, transparent, $text-color-1, $main-color-1);
 }
 
 .button--outline-secondary {
   color: $main-color-3;
   border: 1px solid $main-color-3;
-  @include button-colors($main-color-3, transparent, $text-color-3, $main-color-3, $text-color-3, $main-color-3, $text-color-3, $main-color-3);
+  @include clickable($main-color-3, transparent, $text-color-3, $main-color-3);
 }
 
 .button--outline-success {
   color: $green;
   border: 1px solid $green;
-  @include button-colors($green, transparent, $text-color-function, $green, $text-color-function, $green, $text-color-function, $green);
+  @include clickable($green, transparent, $text-color-function, $green);
 }
 
 .button--outline-info {
   color: $blue;
   border: 1px solid $blue;
-  @include button-colors($blue, transparent, $text-color-function, $blue, $text-color-function, $blue, $text-color-function, $blue);
+  @include clickable($blue, transparent, $text-color-function, $blue);
 }
 
 .button--outline-warning {
   color: $yellow;
   border: 1px solid $yellow;
-  @include button-colors($yellow, transparent, $text-color-function, $yellow, $text-color-function, $yellow, $text-color-function, $yellow);
+  @include clickable($yellow, transparent, $text-color-function, $yellow);
 }
 
 .button--outline-error {
   color: $red;
   border: 1px solid $red;
-  @include button-colors($red, transparent, $text-color-function, $red, $text-color-function, $red, $text-color-function, $red);
+  @include clickable($red, transparent, $text-color-function, $red);
 }
 
 .button--pill {
-  border-radius: 2rem;
+  border-radius: map-get($button, pill-radius);
   @extend .button--md;
 }
 

data/_sass/common/components/_toc.scss

@@ -16,20 +16,10 @@ ul.toc {
     display: inline-block;
     padding: .2rem .8rem .2rem .8rem;
     border-radius: map-get($base, border-radius);
+    text-decoration: none !important;
     @include link-colors($text-color);
-    @include plain() {
-      text-decoration: none;
-    }
     @include hover() {
-      color: $text-color-3;
       background-color: $main-color-3;
-      text-decoration: none;
-    }
-    @include active() {
-      text-decoration: none;
-    }
-    @include focus() {
-      text-decoration: none;
     }
   }
 
@@ -38,7 +28,7 @@ ul.toc {
     padding: .8rem 0 .3rem 0;
     margin-bottom: .6rem;
     &, a {
-      color: $text-color-d;
+      @include link-colors($text-color-d);
     }
   }
   .toc-h1,
@@ -58,7 +48,7 @@ ul.toc {
   .toc-h5,
   .toc-h6 {
     &, a {
-      color: $text-color-l;
+      @include link-colors($text-color-l);
     }
   }
   .toc-h3 {
@@ -110,7 +100,7 @@ ul.toc--navigator {
   .toc-h3,
   .toc-h4 {
     &, a {
-      @include link-colors($text-color-l, $main-color-1, $main-color-1);
+      @include link-colors($text-color-l);
     }
   }
 

data/_sass/components/_article.content.scss

@@ -8,7 +8,7 @@
     position: relative;
     margin-top: map-get($base, vertical-space-lg) * 1.5;
     & > .anchor {
-      @include link-colors($border-color, $main-color-1, $main-color-1);
+      @include link-colors($border-color, $main-color-1);
       margin-left: .2rem;
       visibility: hidden;
       text-decoration: none;
@@ -17,7 +17,7 @@
         font-size: map-get($base, font-size-sm);
       }
     }
-    &:hover {
+    @include hover() {
       & > .anchor {
         visibility: visible;
         opacity: 1;

data/_sass/components/_author-profile.scss

@@ -15,7 +15,7 @@
     font-size: map-get($base, font-size-lg);
     font-weight: map-get($base, font-weight-bold);
     a {
-      @include link-colors($text-color, $text-color, $text-color);
+      @include link-colors($text-color, $main-color-1);
     }
   }
   .left-col {

data/_sass/components/_follow-me.scss

@@ -3,28 +3,28 @@
     margin: 0;
     & > li > {
       .mail-button {
-        @include button-colors($text-color-1, $mail-color);
+        @include clickable($text-color-1, $mail-color);
       }
       .weibo-button {
-        @include button-colors($text-color-1, $weibo-color);
+        @include clickable($text-color-1, $weibo-color);
       }
       .facebook-button {
-        @include button-colors($text-color-1, $facebook-color);
+        @include clickable($text-color-1, $facebook-color);
       }
       .twitter-button {
-        @include button-colors($text-color-1, $twitter-color);
+        @include clickable($text-color-1, $twitter-color);
       }
       .googlepluse-button {
-        @include button-colors($text-color-1, $google-plus-color);
+        @include clickable($text-color-1, $google-plus-color);
       }
       .github-button {
-        @include button-colors($text-color-1, $github-color, default, default, default, default, default, default, 'dark');
+        @include clickable($text-color-1, $github-color);
       }
       .linkedin-button {
-        @include button-colors($text-color-1, $linkedin-color);
+        @include clickable($text-color-1, $linkedin-color);
       }
       .douban-button {
-        @include button-colors($text-color-1, $douban-color);
+        @include clickable($text-color-1, $douban-color);
       }
     }
   }

data/_sass/components/_footer.scss

@@ -14,7 +14,7 @@
     color: $text-color-3;
   }
   a {
-    @include link-colors ($text-color-3, $main-color-1, $main-color-1);
+    @include link-colors ($text-color-3, $main-color-1);
   }
   .site-info {
     text-align: center;

data/_sass/components/_header.scss

@@ -1,8 +1,8 @@
 .header {
   a {
     font-weight: map-get($base, font-weight);
-    text-decoration: none;
-    @include link-colors($text-color, $main-color-1, $main-color-1);
+    text-decoration: none !important;
+    @include link-colors($text-color, $main-color-1);
   }
   & > .main > .logo {
     float: left;
@@ -50,7 +50,7 @@
         &.active {
           @include split-line(bottom, 4px, $main-color-1);
           a {
-            @include link-colors($main-color-1, $main-color-1, $main-color-1);
+            @include link-colors($main-color-1, $main-color-1);
           }
         }
       }

data/_sass/components/_tags.scss

@@ -9,15 +9,15 @@
     }
   }
   .tag-button-1 {
-    @include button-colors($text-color-1, rgba($main-color-1, .4), default, default, $text-color-2,$main-color-2, $text-color-2,$main-color-2);
+    @include clickable($text-color-1, rgba($main-color-1, .4), default, default, $text-color-2,$main-color-2, $text-color-2,$main-color-2);
   }
   .tag-button-2 {
-    @include button-colors($text-color-1, rgba($main-color-1, .55), default, default, $text-color-2,$main-color-2, $text-color-2,$main-color-2);
+    @include clickable($text-color-1, rgba($main-color-1, .55), default, default, $text-color-2,$main-color-2, $text-color-2,$main-color-2);
   }
   .tag-button-3 {
-    @include button-colors($text-color-1, rgba($main-color-1, .7), default, default, $text-color-2,$main-color-2, $text-color-2,$main-color-2);
+    @include clickable($text-color-1, rgba($main-color-1, .7), default, default, $text-color-2,$main-color-2, $text-color-2,$main-color-2);
   }
   .tag-button-4 {
-    @include button-colors($text-color-1, rgba($main-color-1, .9), default, default, $text-color-2,$main-color-2, $text-color-2,$main-color-2);
+    @include clickable($text-color-1, rgba($main-color-1, .9), default, default, $text-color-2,$main-color-2, $text-color-2,$main-color-2);
   }
 }

data/_sass/layout/{_all.scss → _archive.scss}

@@ -1,4 +1,4 @@
-.layout--all {
+.layout--archive {
   .site-tags {
     margin-bottom: map-get($base, vertical-space-lg) * 2;
     display: block;
@@ -13,41 +13,35 @@
       width: 100%;
     }
     & > input {
-      border-radius: 2rem;
-      padding: .2rem 1.8rem;
-      @include transition(box-shadow map-get($animation, duration) map-get($animation, timing-function));
       -webkit-appearance: none; /* fix iOS don't display box-shadow properly */
-      width: 100%;
       display: inline-block;
-      border: none;
+      width: 100%;
+      padding: .2rem 1.8rem;
       margin: 0;
-      background-color: $text-background-color;
-      @include focus() {
-        @include box-shadow();
-      }
+      border: none;
+      border-radius: map-get($button, pill-radius);
+      @include clickable($text-color, $text-background-color);
+      @include transition(box-shadow map-get($animation, duration) map-get($animation, timing-function));
     }
-    & > .icon-search, & > .icon-clear {
+    & > .search-box__icon-search, & > .search-box__icon-clear {
       position: absolute;
+      vertical-align: middle;
       top: 50%;
       @include transform(translateY(-50%));
-      display: inline-block;
-      vertical-align: middle;
-      font-size: map-get($base , font-size-sm);
     }
-    &.not-empty > .icon-clear {
+    &.not-empty > .search-box__icon-clear {
       display: block;
     }
-    & > .icon-clear {
+    & > .search-box__icon-clear {
       display: none;
-      right: .8rem;
-      @include link-colors($text-color-l, $text-color-d);
+      right: .3rem;
     }
-    & > .icon-search {
+    & > .search-box__icon-search {
       left: .5rem;
     }
   }
 
-  & > .layout--all__result {
+  & > .layout--archive__result {
     margin: map-get($base, vertical-space-lg) 0;
     section {
       &:not(:last-child) {
@@ -68,7 +62,7 @@
         }
         .link {
           font-size: 1rem;
-          @include link-colors($text-color-d, $main-color-1, $main-color-1);
+          @include link-colors($text-color-d, $main-color-1);
         }
       }
     }
@@ -77,7 +71,7 @@
     & > .site-tags {
       display: none;
     }
-    & > .layout--all__result {
+    & > .layout--archive__result {
       section {
         ul > li {
           .date {

data/_sass/layout/_article.scss

@@ -5,13 +5,11 @@
     font-size: map-get($base, font-size-sm);
     color: $text-color-l;
     .article__license {
-      position: relative;
       img {
-        height: map-get($base, font-size-sm) * 1.5;
-        vertical-align: text-bottom;
+        height: map-get($base, font-size) * 1.6;
       }
       a {
-        @include link-colors($text-color, $main-color-1, $main-color-1);
+        @include link-colors($text-color, $main-color-1);
       }
     }
   }
@@ -28,7 +26,7 @@
       }
       & > a {
         display: block;
-        @include link-colors($text-color, $main-color-1, $main-color-1);
+        @include link-colors($text-color, $main-color-1);
       }
     }
     & > .previous {

data/_sass/layout/_home.scss

@@ -4,7 +4,7 @@
       & > h1, h2  {
         font-size: map-get($base, font-size-h3);
         & > a {
-          @include link-colors($text-color-d, $main-color-1, $main-color-1);
+          @include link-colors($text-color-d, $main-color-1);
         }
       }
       & > a {

data/_sass/layout/_page.scss

@@ -16,7 +16,7 @@
     height: 100%;
     min-height: 100%;
 
-    .col-2 {
+    .col-aside {
       display: none;
       float: right;
       & > aside {
@@ -40,12 +40,8 @@
     header, h1 {
       display: inline;
     }
-    .edit-on-github-button {
-      vertical-align: text-bottom;
-      margin-left: map-get($spacers, 3);
-      @include media-breakpoint-down(md) {
-        display: none;
-      }
+    .edit-on-github {
+      text-decoration: none !important;
     }
   }
 
@@ -62,7 +58,7 @@
   }
 
   .sidebar-button {
-    @include button-colors($text-color-d, rgba($main-color-3, .75));
+    @include clickable($text-color-d, rgba($main-color-3, .75));
     border: 1px $border-color solid;
   }
 
@@ -98,7 +94,6 @@
     .toc-aside {
       padding: 1rem 0 1rem 3rem;
     }
-
   }
 
   .page__footer {
@@ -109,13 +104,13 @@
 
   .has-aside {
     .page__main-inner{
-      .col-1 {
+      .col-main {
         margin-right: map-get($layout, aside-width);
         @include media-breakpoint-down(lg) {
           margin-right: 0;
         }
       }
-      .col-2 {
+      .col-aside {
         width: map-get($layout, aside-width);
         position: relative;
         display: block;

data/assets/css/main.scss

@@ -14,6 +14,7 @@
 
     "common/variables",
     "common/highlighting",
+    "common/function",
     "common/classes",
     "common/reset",
     "common/components/button",
@@ -31,7 +32,6 @@
     "components/article.content",
     "components/tags",
     "components/follow-me",
-    "components/license",
     "components/footer",
 
     "additional/alert",
@@ -39,7 +39,7 @@
 
     "layout/page",
     "layout/home",
-    "layout/all",
+    "layout/archive",
     "layout/article",
     "layout/landing",
     "layout/404"

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: jekyll-text-theme
 version: !ruby/object:Gem::Version
-  version: 2.0.0
+  version: 2.0.1
 platform: ruby
 authors:
 - kitian616
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2018-07-01 00:00:00.000000000 Z
+date: 2018-07-07 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -125,11 +125,11 @@ files:
 - _includes/analytics-providers/custom.html
 - _includes/analytics-providers/google.html
 - _includes/analytics.html
+- _includes/article-footer/author-profile.html
 - _includes/article-footer/custom.html
 - _includes/article-footer/license.html
 - _includes/article-info.html
 - _includes/aside/toc.html
-- _includes/author-profile.html
 - _includes/comments-providers/custom.html
 - _includes/comments-providers/disqus.html
 - _includes/comments-providers/gitalk.html
@@ -204,11 +204,13 @@ files:
 - _sass/animate/_fade-in-down.scss
 - _sass/animate/_fade-in.scss
 - _sass/common/_classes.scss
+- _sass/common/_function.scss
 - _sass/common/_highlighting.scss
 - _sass/common/_reset.scss
 - _sass/common/_variables.scss
 - _sass/common/classes/_animation.scss
 - _sass/common/classes/_clearfix.scss
+- _sass/common/classes/_clickable.scss
 - _sass/common/classes/_flex.scss
 - _sass/common/classes/_grid.scss
 - _sass/common/classes/_horizontal-rules.scss
@@ -232,11 +234,10 @@ files:
 - _sass/components/_follow-me.scss
 - _sass/components/_footer.scss
 - _sass/components/_header.scss
-- _sass/components/_license.scss
 - _sass/components/_main.scss
 - _sass/components/_tags.scss
 - _sass/layout/_404.scss
-- _sass/layout/_all.scss
+- _sass/layout/_archive.scss
 - _sass/layout/_article.scss
 - _sass/layout/_home.scss
 - _sass/layout/_landing.scss

data/_sass/components/_license.scss

@@ -1,2 +0,0 @@
-.license {
-}