jekyll-text-theme 2.0.1 → 2.0.2

data/_sass/common/components/_menu.scss

@@ -1,3 +1,14 @@
+@mixin menu-direction($direction: default) {
+  @if $direction == default {
+    $direction: 'horizontal';
+  }
+  @if $direction == 'vertical' {
+    @include flex-direction(column);
+  } @else {
+    @include flex-direction(row);
+  }
+}
+
 @mixin menu($horizontal-spacer: default, $horizontal-item-vertical-spacer: default, $wrap: default) {
   @if $horizontal-spacer == default {
     $horizontal-spacer: map-get($menu, horizontal-spacer);
@@ -10,7 +21,6 @@
   }
   @include flexbox();
   @include flex-wrap($wrap);
-  @include align-items(center);
   margin-top: 0;
   margin-bottom: 0;
   & > li {
@@ -28,6 +38,16 @@
 
 .menu {
   @include menu();
+  @include menu-direction();
+  @include align-items(center);
+}
+
+.menu--vertical {
+  @include menu-direction('vertical');
+  @include align-items(normal);
+  & > li {
+    margin-right: 0;
+  }
 }
 
 .menu--center {

data/_sass/common/components/_toc.scss

@@ -3,11 +3,12 @@ ul.toc {
   margin: 0;
   list-style-type: none;
   & > li {
-    margin: .1rem 0;
+    margin: .2rem 0;
     &.active {
       a {
+        color: $text-color-3;
         background-color: $main-color-3;
-        @include link-colors($main-color-1);
+        box-shadow: 0 0 0 2px rgba($main-color-3, .4);
       }
     }
   }
@@ -17,17 +18,14 @@ ul.toc {
     padding: .2rem .8rem .2rem .8rem;
     border-radius: map-get($base, border-radius);
     text-decoration: none !important;
-    @include link-colors($text-color);
-    @include hover() {
-      background-color: $main-color-3;
-    }
+    @include clickable($text-color, null, $text-color-3, $main-color-3);
   }
 
   .toc-h1 {
     @include split-line(bottom);
     padding: .8rem 0 .3rem 0;
     margin-bottom: .6rem;
-    &, a {
+    a {
       @include link-colors($text-color-d);
     }
   }
@@ -47,7 +45,7 @@ ul.toc {
   }
   .toc-h5,
   .toc-h6 {
-    &, a {
+    a {
       @include link-colors($text-color-l);
     }
   }
@@ -64,13 +62,13 @@ ul.toc {
   .toc-h1 {
     &, a {
       font-size: map-get($base, font-size);
-      line-height: map-get($base, line-height-lg);
+      line-height: map-get($base, line-height);
     }
   }
   .toc-h2 {
     &, a {
       font-size: map-get($base, font-size-sm);
-      line-height: map-get($base, line-height);
+      line-height: map-get($base, line-height-sm);
     }
   }
   .toc-h3,
@@ -89,6 +87,7 @@ ul.toc--navigator {
     &.active {
       a {
         background-color: transparent;
+        box-shadow: none;
         @include link-colors($main-color-1);
         @include split-line(left, 4px, $main-color-1);
         margin-left: -4px;

data/_sass/components/{_article.content.scss → _article-content.scss}

@@ -140,7 +140,7 @@
             & > pre {
               border-radius: 0;
               display: block;
-              overflow: visible;
+              @include overflow(auto);
               margin: 0;
               &.lineno {
                 color: $text-color-l;
@@ -159,17 +159,15 @@
       margin-bottom: 0;
     }
     li {
-      margin: 0;
       p {
-        margin: 0;
+        margin: map-get($base, vertical-space);
       }
     }
   }
   dl {
     dt, dd {
-      margin: 0;
       p {
-        margin: 0;
+        margin: map-get($base, vertical-space);
       }
     }
     dt {

data/_sass/components/{_article.info.scss → _article-info.scss}

@@ -15,10 +15,10 @@
     }
     & > li {
       &:not(:last-child) {
-        @include split-line(right, default, $border-color);
+        @include split-line(right, default, $text-color-l);
         line-height: map-get($base, line-height-xs);
-        padding-right: .6rem;
-        margin-right: .8rem;
+        padding-right: .7rem;
+        margin-right: .7rem;
       }
     }
   }

data/_sass/components/{_follow-me.scss → _author-links.scss}

@@ -1,4 +1,4 @@
-.follow-me {
+.author-links {
   & > ul {
     margin: 0;
     & > li > {

data/_sass/components/_author-profile.scss

@@ -33,7 +33,7 @@
       padding-left: 0;
       margin-left: 0;
     }
-    .follow-me {
+    .author-links {
       float: left;
       @include media-breakpoint-down(md) {
         float: none;

data/_sass/components/_footer.scss

@@ -5,28 +5,30 @@
 .footer {
   @include flexbox;
   @include align-items(center);
-  background-color: $main-color-3;
+  background: $footer-background;
   height: map-get($layout, footer-height);
-  .follow-me {
+  .author-links {
     padding-top: 1rem;
   }
   p {
-    color: $text-color-3;
+    color: $footer-text-color;
   }
   a {
-    @include link-colors ($text-color-3, $main-color-1);
+    @include link-colors ($footer-text-color, $main-color-1);
   }
   .site-info {
+    .menu {
+      line-height: map-get($base, line-height-xs);
+      & > * {
+        &:not(:last-child) {
+          @include split-line(right, default, $footer-text-color);
+          padding-right: .3rem;
+          margin-right: .3rem;
+        }
+      }
+    }
     text-align: center;
     font-size: map-get($base, font-size-xs);
     margin: 1rem auto 0 auto;
   }
-  .site-info__rss {
-    @include split-line(left, default, $text-color-3);
-    padding-left: .3rem;
-    margin-left: .1rem;
-  }
-  .site-info__copyright, .site-info__rss {
-    line-height: map-get($base, line-height-xs);
-  }
 }

data/_sass/components/_header.scss

@@ -1,8 +1,9 @@
 .header {
+  background: $header-background;
   a {
     font-weight: map-get($base, font-weight);
     text-decoration: none !important;
-    @include link-colors($text-color, $main-color-1);
+    @include link-colors($header-text-color, $main-color-1);
   }
   & > .main > .logo {
     float: left;

data/_sass/components/_tags.scss

@@ -1,5 +1,6 @@
 .site-tags {
   .tag-button {
+    @include clickable($text-color-3, $main-color-3, default, default, $text-color-2,$main-color-2, $text-color-2,$main-color-2);
     & > .tag-button__count {
       font-size: map-get($base, font-size-xs);
       display: inline-block;

data/_sass/layout/_archive.scss

@@ -18,10 +18,13 @@
       width: 100%;
       padding: .2rem 1.8rem;
       margin: 0;
-      border: none;
+      border: 2px solid $border-color;
       border-radius: map-get($button, pill-radius);
-      @include clickable($text-color, $text-background-color);
+      background-color: transparent;
       @include transition(box-shadow map-get($animation, duration) map-get($animation, timing-function));
+      @include focus {
+        box-shadow: 0 0 0 2px rgba($border-color, .4);
+      }
     }
     & > .search-box__icon-search, & > .search-box__icon-clear {
       position: absolute;
@@ -34,10 +37,10 @@
     }
     & > .search-box__icon-clear {
       display: none;
-      right: .3rem;
+      right: .35rem;
     }
     & > .search-box__icon-search {
-      left: .5rem;
+      left: .6rem;
     }
   }
 

data/_sass/layout/_article.scss

@@ -13,7 +13,7 @@
       }
     }
   }
-  .article__previous-next {
+  .article__section-navigator {
     word-wrap: break-word;
     margin: map-get($spacers, 4) 0 map-get($spacers, 3) 0;
     padding-top: map-get($base, vertical-space-lg) / 2;

data/_sass/layout/_base.scss

@@ -0,0 +1,10 @@
+.root {
+  height: 100%;
+}
+
+.icon {
+  display: block;
+  >svg {
+    display: block;
+  }
+}

data/_sass/layout/_home.scss

@@ -59,6 +59,9 @@
         max-height: 12rem;
       }
     }
+    .post-list__readmore {
+      font-size: map-get($base, font-size-sm);
+    }
   }
 
   .pagination {

data/_sass/layout/_page.scss

@@ -15,6 +15,8 @@
     height: auto !important;
     height: 100%;
     min-height: 100%;
+    color: $text-color;
+    background-color: $background-color;
 
     .col-aside {
       display: none;
@@ -40,6 +42,9 @@
     header, h1 {
       display: inline;
     }
+    .split-space {
+      @include user-select(none);
+    }
     .edit-on-github {
       text-decoration: none !important;
     }
@@ -59,7 +64,6 @@
 
   .sidebar-button {
     @include clickable($text-color-d, rgba($main-color-3, .75));
-    border: 1px $border-color solid;
   }
 
   .page__sidebar {

data/_sass/skins/_chocolate.scss

@@ -5,17 +5,18 @@
 ///
 
 // main colors
-$main-color-1:     #c68a45;
-$text-color-1:     #fff;
+$main-color-1:     #563a20;
+$text-color-1:     rgba(#fff, .85);
 
-$main-color-2:     #6e3e85;
-$text-color-2:     #fff;
+$main-color-2:     #8a2827;
+$text-color-2:     rgba(#fff, .85);
 
-$main-color-3:     #7f5543;
-$text-color-3:     #fff;
+$main-color-3:     #b49b92;
+$text-color-3:     rgba(#fff, .85);
+
+// page background
+$background-color: #d2c2bc;
 
-// background colors
-$background-color: #efefef;
 // text colors
 $text-color-theme-light-d: rgba(#000, .95);
 $text-color-theme-light:   rgba(#000, .85);
@@ -31,19 +32,26 @@ $text-color-l:     $text-color-theme-light-l;
 
 $text-background-color: rgba(#000, .05);
 
+// header and footer colors
+$header-text-color: $text-color-3;
+$header-background: $main-color-3;
+
+$footer-text-color: $text-color-3;
+$footer-background: $main-color-3;
+
 // border and shadow colors
-$border-color:     mix(#000, $background-color, 20%);
+$border-color:     $main-color-3;
 $border-color-l:   mix(#000, $background-color, 10%);
 $decorate-color:   rgba(#000, .1);
 $mask-color:       rgba(#000, .8);
 $select-color:     rgba($main-color-3, .5);
 
 // function colors
-$green:           #57c22d;
-$blue:            #2593fc;
-$yellow:          #f8ac30;
-$red:             #f22635;
-$text-color-function: #fff;
+$green:           #5baa34;
+$blue:            #1c7cd4;
+$yellow:          #c9771f;
+$red:             #da3d45;
+$text-color-function: rgba(#fff, .85);
 
 // logo colors
 $mail-color:       #0072c5;
@@ -54,3 +62,6 @@ $twitter-color:    #1da1f2;
 $douban-color:     #42bd56;
 $github-color:     #000;
 $linkedin-color:   #1074af;
+
+// highlight colors
+@import './highlight/tomorrow-night-eighties';

data/_sass/skins/_dark.scss

@@ -8,14 +8,15 @@
 $main-color-1:     #FF9500;
 $text-color-1:     rgba(#fff, .8);
 
-$main-color-2:     #FF3B30;
+$main-color-2:     #ff006a;
 $text-color-2:     rgba(#fff, .8);
 
 $main-color-3:     #202020;
 $text-color-3:     rgba(#fff, .8);
 
-// background colors
+// page background
 $background-color: #121212;
+
 // text colors
 $text-color-theme-light-d: #000;
 $text-color-theme-light:   #222;
@@ -31,19 +32,26 @@ $text-color-l:     $text-color-theme-dark-l;
 
 $text-background-color: rgba(#fff, .05);
 
+// header and footer colors
+$header-text-color: $text-color-3;
+$header-background: $main-color-3;
+
+$footer-text-color: $text-color-3;
+$footer-background: $main-color-3;
+
 // border and shadow colors
 $border-color:     mix(#fff, $background-color, 20%);
 $border-color-l:   mix(#fff, $background-color, 10%);
 $decorate-color:   rgba(#fff, .1);
-$mask-color:       rgba(#fff, .8);
+$mask-color:       rgba(#000, .8);
 $select-color:     rgba($main-color-1, .5);
 
 // function colors
-$green:           #5c7829;
-$blue:            #087099;
-$yellow:          #b7b327;
-$red:             #cc3333;
-$text-color-function: rgba(#fff, .9);
+$green:           #5baa34;
+$blue:            #1c7cd4;
+$yellow:          #c9771f;
+$red:             #da3d45;
+$text-color-function: rgba(#fff, .8);
 
 // logo colors
 $mail-color:       #0072c5;
@@ -54,3 +62,6 @@ $twitter-color:    #1da1f2;
 $douban-color:     #42bd56;
 $github-color:     #000;
 $linkedin-color:   #1074af;
+
+// highlight colors
+@import './highlight/tomorrow-night';