jekyll-theme-hydejack 8.5.2 → 9.0.0

data/_layouts/post.html

@@ -17,7 +17,7 @@
 layout: base
 ---
 
-{% include components/post.html post=page no_link_title=true no_excerpt=true hide_image=page.hide_image %}
+{% include_cached components/post.html post=page no_link_title=true no_excerpt=true hide_image=page.hide_image hide_description=page.hide_description %}
 
 <hr class="dingbat related" />
 
@@ -26,9 +26,11 @@ layout: base
 {% for addon in addons %}
   {% case addon %}
   {% when 'about' %}
-     {% include components/about.html %}
+     {% include_cached components/about.html author=page.author %}
   {% when 'related' %}
-    {% include components/related-posts.html post=post %}
+    {% include if-non-null try="components/related-posts.html" %}
+  {% when 'comments' %}
+    {% include body/comments.html %}
   {% else %}
   {% endcase %}
 {% endfor %}

data/_sass/_mixins.scss

@@ -13,22 +13,6 @@
 // You should have received a copy of the GNU General Public License
 // along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
-body {
-  --code-font-family: #{$code-font-family};
-
-  --font-weight: #{$font-weight};
-  --font-weight-bold: #{$font-weight-bold};
-  --font-weight-heading: #{$font-weight-heading};
-
-  --text-muted: #{$gray};
-  --gray-bg: #{$gray-bg};
-  --gray-text: #{$gray-text};
-  --menu-text: #{$menu-text};
-  --body-color: #{$body-color};
-  --body-bg: #{$body-bg};
-  --border-color: #{$border-color};
-}
-
 @mixin aspect-ratio($width, $height) {
   position: relative;
 
@@ -55,9 +39,11 @@ body {
 }
 
 .color-transition {
-  transition: background-color 1s ease, border-color 1s ease;
+  transition: none;
 }
 
-.no-color-transition {
-  transition: none!important;
-}
+@mixin fallback-image() {
+  background-position: center;
+  background-repeat: no-repeat;
+  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB3aWR0aD0iMTYwIiBoZWlnaHQ9IjkwIiB2aWV3Qm94PSIwIDAgMTYwIDkwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0ibWF0cml4KDAuMDQ4ODI4LCAwLCAwLCAwLjA0Nzk5MSwgNTQuOTk5OTczLCAyMC40MjgxNDgpIj4KICAgIDxwYXRoIGQ9Ik05NTkuODg0IDEyOGMwLjA0MCAwLjAzNCAwLjA4MiAwLjA3NiAwLjExNiAwLjExNnY3NjcuNzdjLTAuMDM0IDAuMDQwLTAuMDc2IDAuMDgyLTAuMTE2IDAuMTE2aC04OTUuNzdjLTAuMDQwLTAuMDM0LTAuMDgyLTAuMDc2LTAuMTE0LTAuMTE2di03NjcuNzcyYzAuMDM0LTAuMDQwIDAuMDc2LTAuMDgyIDAuMTE0LTAuMTE0aDg5NS43N3pNOTYwIDY0aC04OTZjLTM1LjIgMC02NCAyOC44LTY0IDY0djc2OGMwIDM1LjIgMjguOCA2NCA2NCA2NGg4OTZjMzUuMiAwIDY0LTI4LjggNjQtNjR2LTc2OGMwLTM1LjItMjguOC02NC02NC02NHYweiIgc3R5bGU9ImZpbGw6IHJnYigyMjEsIDIyMSwgMjIxKTsiLz4KICAgIDxwYXRoIGQ9Ik04MzIgMjg4YzAgNTMuMDIwLTQyLjk4IDk2LTk2IDk2cy05Ni00Mi45OC05Ni05NiA0Mi45OC05NiA5Ni05NiA5NiA0Mi45OCA5NiA5NnoiIHN0eWxlPSJmaWxsOiByZ2IoMjIxLCAyMjEsIDIyMSk7Ii8+CiAgICA8cGF0aCBkPSJNODk2IDgzMmgtNzY4di0xMjhsMjI0LTM4NCAyNTYgMzIwaDY0bDIyNC0xOTJ6IiBzdHlsZT0iZmlsbDogcmdiKDIyMSwgMjIxLCAyMjEpOyIvPgogIDwvZz4KPC9zdmc+');
+}

data/_sass/_syntax.scss

@@ -1,131 +1,143 @@
-.highlight,
-pre.highlight {
-  // background: #fafafa;
-  color: #383a42;
-}
-.highlight pre {
-  // background: #fafafa;
-}
-.highlight .ge {
-  font-style: italic;
-}
-.highlight .gs {
-  font-weight: 700;
-}
-.highlight .ow {
-  font-weight: 700;
-}
-.highlight .n,
-.highlight .nf,
-.highlight .nn,
-.highlight .o,
-.highlight .p {
-  color: #383a42;
-}
-.highlight .c,
-.highlight .c1,
-.highlight .cm,
-.highlight .cp,
-.highlight .cs {
-  color: #a0a1a7;
-  font-style: italic;
-}
-.highlight .sr,
-.highlight .ss {
-  color: #0184bc;
-}
-.highlight .k,
-.highlight .kc,
-.highlight .kd,
-.highlight .kn,
-.highlight .kp,
-.highlight .kr,
-.highlight .kt {
-  color: #a626a4;
-}
-.highlight .l,
-.highlight .ld,
-.highlight .s,
-.highlight .s1,
-.highlight .s2,
-.highlight .sb,
-.highlight .sc,
-.highlight .sd,
-.highlight .se,
-.highlight .sh,
-.highlight .si,
-.highlight .sx {
-  color: #50a14f;
-}
-.highlight .nt,
-.highlight .nx,
-.highlight .vi {
-  color: #e45649;
-}
-.highlight .il,
-.highlight .m,
-.highlight .mf,
-.highlight .mh,
-.highlight .mi,
-.highlight .mo,
-.highlight .na {
-  color: #986801;
-}
-.highlight .bp,
-.highlight .nb,
-.highlight .nc,
-.highlight .nd,
-.highlight .ne,
-.highlight .ni,
-.highlight .nl,
-.highlight .no,
-.highlight .nv,
-.highlight .py,
-.highlight .vc,
-.highlight .vg {
-  color: #c18401;
-}
-// .highlight .err {
-//   color: #fff;
-//   background-color: #ff1414;
-// }
-.highlight .gd {
-  color: #ff1414;
-}
-.highlight .gi {
-  color: #2db448;
-}
-.highlight .w {
-  color: #f8f8f2;
-}
-.highlight .cpf {
-  color: navy;
-}
-.highlight .gu {
-  color: #75715e;
-}
-.highlight .lineno {
-  color: #9d9d9f;
-  user-select: none;
-}
-.highlight .ln {
-  color: #9d9d9f;
-  user-select: none;
-}
-.highlight .ln:after {
-  content: " ";
-}
-.highlight .hll {
-  color: #383a42;
-  background-color: #e5e5e6;
-}
-.highlight .hl {
-  color: #383a42;
-  background-color: #e5e5e6;
-}
-.highlight .language-json .w + .s2 {
-  color: #e45649;
-}
-.highlight .language-json .kc {
-  color: #0184bc;
+@mixin lightmode-syntax() {
+  .highlight,
+  pre.highlight {
+    // background: #fafafa;
+    color: #383a42;
+  }
+  // .highlight pre {
+  //   background: #fafafa;
+  // }
+  .highlight .ge {
+    font-style: italic;
+  }
+  .highlight .gs {
+    font-weight: 700;
+  }
+  .highlight .ow {
+    font-weight: 700;
+  }
+  .highlight .n,
+  .highlight .nf,
+  .highlight .nn,
+  .highlight .o,
+  .highlight .p {
+    color: #383a42;
+  }
+  .highlight .c,
+  .highlight .c1,
+  .highlight .cm,
+  .highlight .cp,
+  .highlight .cs {
+    color: #a0a1a7;
+    font-style: italic;
+  }
+  .highlight .sr,
+  .highlight .ss {
+    color: #0184bc;
+  }
+  .highlight .k,
+  .highlight .kc,
+  .highlight .kd,
+  .highlight .kn,
+  .highlight .kp,
+  .highlight .kr,
+  .highlight .kt {
+    color: #a626a4;
+  }
+  .highlight .l,
+  .highlight .ld,
+  .highlight .s,
+  .highlight .s1,
+  .highlight .s2,
+  .highlight .sb,
+  .highlight .sc,
+  .highlight .sd,
+  .highlight .se,
+  .highlight .sh,
+  .highlight .si,
+  .highlight .sx {
+    color: #50a14f;
+  }
+  .highlight .nt,
+  .highlight .nx,
+  .highlight .vi {
+    color: #e45649;
+  }
+  .highlight .il,
+  .highlight .m,
+  .highlight .mf,
+  .highlight .mh,
+  .highlight .mi,
+  .highlight .mo,
+  .highlight .na {
+    color: #986801;
+  }
+  .highlight .bp,
+  .highlight .nb,
+  .highlight .nc,
+  .highlight .nd,
+  .highlight .ne,
+  .highlight .ni,
+  .highlight .nl,
+  .highlight .no,
+  .highlight .nv,
+  .highlight .py,
+  .highlight .vc,
+  .highlight .vg {
+    color: #c18401;
+  }
+  // .highlight .err {
+  //   color: #fff;
+  //   background-color: #ff1414;
+  // }
+  .highlight .gd {
+    color: #ff1414;
+  }
+  .highlight .gi {
+    color: #2db448;
+  }
+  .highlight .w {
+    color: #f8f8f2;
+  }
+  .highlight .cpf {
+    color: navy;
+  }
+  .highlight .gu {
+    color: #75715e;
+  }
+  .highlight .lineno {
+    color: #9d9d9f;
+    user-select: none;
+  }
+  .highlight .ln {
+    color: #9d9d9f;
+    user-select: none;
+  }
+  .highlight .ln:after {
+    content: " ";
+  }
+  .highlight .hll {
+    color: #383a42;
+    background-color: #e5e5e6;
+  }
+  .highlight .hl {
+    color: #383a42;
+    background-color: #e5e5e6;
+  }
+  .highlight .language-json .w + .s2 {
+    color: #e45649;
+  }
+  .highlight .language-json .kc {
+    color: #0184bc;
+  }
+}
+
+body {
+  @include lightmode-syntax();
+}
+
+@media screen {
+  body.light-mode {
+    @include lightmode-syntax();
+  }
 }

data/_sass/_variables.scss

@@ -13,51 +13,10 @@
 // You should have received a copy of the GNU General Public License
 // along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
-$gray: #888;
+$gray: #777;
 $gray-bg: rgba(0,0,0,.025);
 $gray-text: #666;
 $menu-text: #bbb;
 $body-color: #333;
 $body-bg: #fff;
 $border-color: #ebebeb;
-
-$root-font-size: 16px;
-$root-font-size-medium: 17px;
-$root-font-size-large: 18px;
-$root-font-size-print: 11pt;
-$root-line-height: 1.75;
-
-$font-weight: 400;
-$font-weight-bold: 700;
-$font-weight-heading: 400;
-
-$code-font-family: Menlo, Monaco, Consolas, monospace;
-
-// Breakpoints and content width. All units must be in rem!
-// NOTE: Duplicated values from `_js/src/drawer.js`.
-$content-width: 38rem;
-$content-width-2: 42rem;
-$content-width-5: 48rem;
-
-$content-margin-3: 3rem;
-$content-margin-5: 4rem;
-
-$content-padding: 1rem;
-
-$sidebar-width: 21rem;
-
-$break-point-1: 42em;
-$break-point-2: 54em;
-$break-point-3: 64em;
-$break-point-4: 72em;
-$break-point-5: 88em;
-$break-point-font-large: 124em;
-
-// The sidebar width starts adjusting dynamically when the content is at the center of the window.
-// This is the case when the window size has a `min-width` of content area + twice the sidebar (left, right):
-//
-// $break-point-dynamic: $content-width-5 + (2 * $content-margin-5) + (2 * $sidebar-width); // = 98rem
-//
-// HACK: Since Chrome doesn't treat rem values in media queries correctly,
-// we hard-code the pixel value for the values above.
-$break-point-dynamic: 1666px; // = 98 * 17px

data/_sass/html.scss

@@ -0,0 +1,42 @@
+html {
+  --font-family: #{$font-family};
+  --font-family-heading: #{$font-family-heading};
+  --code-font-family: #{$code-font-family};
+
+  --gray: #{$gray};
+  --gray-bg: #{$gray-bg};
+  --gray-text: #{$gray-text};
+  --menu-text: #{$menu-text};
+  --body-color: #{$body-color};
+  --body-bg: #{$body-bg};
+  --border-color: #{$border-color};
+
+  --root-font-size: #{$root-font-size};
+  --root-font-size-medium: #{$root-font-size-medium};
+  --root-font-size-large: #{$root-font-size-large};
+  --root-font-size-print: #{$root-font-size-print};
+  --root-line-height: #{$root-line-height};
+
+  --font-weight: #{$font-weight};
+  --font-weight-bold: #{$font-weight-bold};
+  --font-weight-heading: #{$font-weight-heading};
+
+  // --content-width: #{$content-width};
+  // --content-width-2: #{$content-width-2};
+  --content-width-5: #{$content-width-5};
+
+  // --content-margin-3: #{$content-margin-3};
+  --content-margin-5: #{$content-margin-5};
+
+  --sidebar-width: #{$sidebar-width};
+  --half-content: #{$half-content};
+
+  // --break-point-1: #{$break-point-1};
+  // --break-point-2: #{$break-point-2};
+  --break-point-3: #{$break-point-3};
+  // --break-point-4: #{$break-point-4};
+  --break-point-5: #{$break-point-5};
+  // --break-point-font-large: #{$break-point-font-large};
+
+  --break-point-dynamic: #{$break-point-dynamic};
+}

data/_sass/hydejack/__inline__/_avatar.scss

@@ -24,25 +24,25 @@
 
 .avatar {
   
-  width: 6.5rem;
-  height: 6.5rem;
+  width: 7rem;
+  height: 7rem;
   border-radius: 100%;
   overflow: hidden;
+  display: inline-block;
+  img { width: 100%; }
   
 
   
-
-  
-  @media screen and (min-width: $break-point-5) {
-    width: 7rem;
-    height: 7rem;
-  }
-  
 }
 
 
 .content .avatar {
+  @extend .color-transition;
   float: right;
-  margin-left: .5rem;
+  box-sizing: content-box;
+  border: 1rem solid var(--body-bg);
+  transition: border-color 1s ease;
+  margin-top: -1.5rem;
+  margin-right: -1rem;
 }