jekyll-theme-hydejack 6.0.0.pre.beta3 → 6.0.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: d25cc16b3abc1c550349906e5a3487394cfc83c0
-  data.tar.gz: 83f2611e3984784721dcad35a1453eb68cebeae7
+  metadata.gz: c1c7a25e8217a015f6299bb5c7196da31c648e74
+  data.tar.gz: e3cc387cce366b1af6be96dcb8d1328c34072689
 SHA512:
-  metadata.gz: bf407fdcf5a4e4d35b6d38878a289a56ec595e8d1b997d954997cf35c7a6f17fc914a0fd0a8572b47e283b208d1fb1641a2b33f434fa7c5d0829e33a65845dca
-  data.tar.gz: 0adb77bf1ff6b1bc8555c545980b99b6f891be59bedb6415fa383450a8e371be7c0433db4601cbe7f3b60207aefabed5a04e85ad4ffb2e61cfc9b8132718c2aa
+  metadata.gz: 892b3f39a4157f4c4c3d3103914fff1cc7fef3f6766be7152bb942430742c5e07571f40e1cc998d41a4cea0d8a1cec366a3627b4b438b4a23c515556e286cd20
+  data.tar.gz: 34a49444a5411cfdf8b9e3266bcd66864ef945fcf010d4955fc8a1005b10ac1e09af27cc9abeabb8f1f3c6f3a7bc6ee6a609f4b0ba5f8f5a6f75e3829b929fb6

data/README.md

@@ -1,8 +1,5 @@
 # Hydejack
 
-
-![Screenshot](https://qwtel.com/assets/img/projects/hydejack-v6@0,5x.jpg)
-
 Hydejack is a complete, interactive, configureable, responsive, reactive, mobile-first, touch-enabled, animated, printable, tab-able, fast[^1], search engine-friendly and robust Jekyll theme that feels like a modern web app, while preserving what is great about *web pages*: Working URLs, hyperlinks, a working back button, a working refresh button and less than 50MB of JavaScript (tongue-in-cheek).
 
 It can be hosted on GitHub Pages, where it has support for categories and tags, math blocks via KaTeX,
@@ -14,8 +11,8 @@ The site works all the way down to IE10. It works in IE9 if you don't need fancy
 All that being said, I think it's best to [see it in action](https://qwtel.com/hydejack/).
 
 ## Download
-You can download the latest version of Hydejack on [GitHub](https://github.com/qwtel/hydejack/releases/tag/v6.0.0-beta3), or use the [gem-based theme](https://rubygems.org/gems/jekyll-theme-hydejack/versions/6.0.0.pre.beta3).
-For further instructions, check out the [Documentation](https://qwtel.com/hydejack/docs/6.0.0-beta3/).
+You can download the latest version of Hydejack on [GitHub](https://github.com/qwtel/hydejack/releases/tag/v6.0.0), or use the [gem-based theme](https://rubygems.org/gems/jekyll-theme-hydejack/versions/6.0.0).
+For further instructions, check out the [Documentation](https://qwtel.com/hydejack/docs/6.0.0/).
 
 ## Footnotes
 [^1]: Hydejack is fast in two different ways. Its *perceived speed* hides latency through a combination of animations and a complex pre-fetching logic. *Load speed* is achieved through inlining critical CSS and removing non-essential requests from the critical rendering path.

data/_includes/body.html

@@ -1,19 +1,21 @@
 <!-- =============== -->
 <!-- MENU            -->
 <!-- =============== -->
-<span class="sr-only">Jump to:</span>
-
-<a id="_menu" class="menu no-hover" href="#_title">
-  <span>☰</span>
-  <span class="sr-only">Menu</span>
-</a>
+<div class="navbar fixed-top">
+  <div class="content">
+    <span class="sr-only">Jump to:</span>
+    <a id="_menu" class="menu no-hover" href="#_title">
+      <span class="sr-only">Menu</span>
+      <span>☰</span>
+    </a>
+  </div>
+</div>
 
 <!-- =============== -->
 <!-- CONTENT         -->
 <!-- =============== -->
 <div id="_yPushState">
-  <main id="_main" class="content container" role="main" data-color="{{ color | escape }}" data-image="{{ image | escape }}">
-
+  <main id="_main" class="content" role="main" data-color="{{ color | escape }}" data-image="{{ image | escape }}">
     {{ content }}
 
     {% if site.disqus_shortname and page.comments %}

data/_includes/copyright-header

@@ -11,5 +11,5 @@
  * Copyright (c) 2017 Florian Klampfer
  * Licensed under MIT
  * Powered by Hydejack (https://qwtel.com/hydejack/)
- * Version: 6.0.0-beta3
+ * Version: 6.0.0
  */

data/_includes/footer.html

@@ -4,6 +4,6 @@
     {{ site.copyright | markdownify }}
   {% endif %}
   <p>
-    <code>Powered by <a href="https://qwtel.com/hydejack/">Hydejack</a> v<span id="_version">6.0.0-beta3</span></code>
+    <code>Powered by <a href="https://qwtel.com/hydejack/">Hydejack</a> v<span id="_version">6.0.0</span></code>
   </p>
 </footer>

data/_includes/head.html

@@ -71,7 +71,7 @@
   {{ include_to_scssify | scssify }}
 </style>
 
-{% capture style_url %}{% link assets/css/hydejack.css %}?v=6.0.0-beta3{% endcapture %}
+{% capture style_url %}{% link assets/css/hydejack.css %}?v=6.0.0{% endcapture %}
 <link rel="preload" href="{{ style_url | relative_url }}" as="style" onload="this.rel='stylesheet'">
 
 {% include page-style.html %}

data/_includes/message.html

@@ -4,6 +4,4 @@
 {:.message}
   {% endcapture %}
   {{ desc | markdownify }}
-{% else %}
-  <hr/>
 {% endif %}

data/_includes/post.html

@@ -1,6 +1,6 @@
 {% assign post = include.post %}
 
-<article id="post-{{ post.id | slice: 1,9999 }}" class="post" role="article">
+<article id="post-{{ post.id | slice: 1,9999 }}" class="post{% unless include.link_title %} dingbat{% endunless %}" role="article">
   <header>
     <h1 class="post-title">
       {% if include.link_title %}<a href="{{ post.url | relative_url }}" data-flip="title">{% endif %}
@@ -17,12 +17,14 @@
     {% endcapture %}
 
     <p class="post-date heading">
-      <time datetime="{{ post.date | date_to_xmlschema }}">{{ post.date | date: "%d %b %Y" }}</time>
-      <span>{{ categories_content }} {{ tags_content }}</span>
+      <time datetime="{{ post.date | date_to_xmlschema }}">{{ post.date | date: "%d %b %Y" }}</time>{% if post.categories.size > 0 or post.tags.size > 0 %}, {% endif %}
+      {{ categories_content }}
+      {{ tags_content }}
     </p>
   </header>
 
   {% include message.html text=post.description %}
+  <hr/>
 
   {% unless include.excerpt %}
     {{ post.content }}

data/_includes/scripts.html

@@ -24,7 +24,7 @@
 {% unless page.redirect %}
 
 <!--[if gt IE 9]><!---->
-{% capture js_url %}{% link assets/js/hydejack.js %}?v=6.0.0-beta3{% endcapture %}
+{% capture js_url %}{% link assets/js/hydejack.js %}?v=6.0.0{% endcapture %}
 <script>loadJSDeferred('{{ js_url | relative_url }}');</script>
 <!--<![endif]-->
 

data/_includes/sidebar.html

@@ -1,7 +1,7 @@
 <div id="_yDrawer">
   <div id="_sidebar" class="sidebar">
     <div class="sidebar-bg" style="background-color:{{ color }};background-image:url({{ image }})"></div>
-    <header class="container sidebar-sticky" role="banner">
+    <header class="sidebar-sticky" role="banner">
       <div class="sidebar-about">
         <h1><a id="_title" href="{{ '/' | relative_url }}">{{ site.title }}</a></h1>
         {{ site.description | truncatewords:50 | markdownify }}

data/_includes/styles/inline.scss

@@ -8,9 +8,9 @@
 // @import "pooleparty/table";
 // @import "pooleparty/footnotes";
 // @import "pooleparty/code";
-@import "pooleparty/layout-inline";
 @import "pooleparty/footer-inline";
 @import "pooleparty/posts-inline";
+// @import "pooleparty/posts";
 // @import "pooleparty/pagination";
 @import "pooleparty/related-inline";
 @import "pooleparty/message-inline";

data/_includes/styles/style.scss

@@ -8,9 +8,9 @@
 @import "pooleparty/table";
 @import "pooleparty/footnotes";
 @import "pooleparty/code";
-// @import "pooleparty/layout-inline";
-// @import "pooleparty/footer";
+// @import "pooleparty/footer-inline";
 // @import "pooleparty/posts-inline";
+@import "pooleparty/posts";
 @import "pooleparty/pagination";
 // @import "pooleparty/related-inline";
 // @import "pooleparty/message-inline";
@@ -67,6 +67,7 @@
       font-size: smaller;
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;
+      opacity: 0.5;
     }
   }
 {% endunless %}

data/_layouts/base.html

@@ -4,8 +4,8 @@ layout: compress
 
 {% assign author = site.data.authors[page.author] | default:site.data.authors.first[1] %}
 
-{% assign color = site.color | default:'#967954' %}
-{% assign image = site.image | default:'/assets/img/gst.jpg' %}
+{% assign color = site.color | default:'#A85641' %}
+{% assign image = site.image | default:'/assets/img/nap.jpg' %}
 
 {% if page.categories.size > 0 %}
   {% assign category_name = page.categories.first %}

data/_layouts/compress.html

@@ -20,7 +20,7 @@
 Copyright (c) 2017 Florian Klampfer
 Licensed under MIT
 Powered by Hydejack (https://qwtel.com/hydejack/)
-Version: 6.0.0-beta3
+Version: 6.0.0
 -->{% capture _LINE_FEED %}
 {% endcapture %}{% if site.compress_html.ignore.envs contains jekyll.environment %}{{ content }}{% else %}{% capture _content %}{{ content }}{% endcapture %}{% assign _profile = site.compress_html.profile %}{% if site.compress_html.endings == "all" %}{% assign _endings = "html head body li dt dd p rt rp optgroup option colgroup caption thead tbody tfoot tr td th" | split: " " %}{% else %}{% assign _endings = site.compress_html.endings %}{% endif %}{% for _element in _endings %}{% capture _end %}</{{ _element }}>{% endcapture %}{% assign _content = _content | remove: _end %}{% endfor %}{% if _profile and _endings %}{% assign _profile_endings = _content | size | plus: 1 %}{% endif %}{% for _element in site.compress_html.startings %}{% capture _start %}<{{ _element }}>{% endcapture %}{% assign _content = _content | remove: _start %}{% endfor %}{% if _profile and site.compress_html.startings %}{% assign _profile_startings = _content | size | plus: 1 %}{% endif %}{% if site.compress_html.comments == "all" %}{% assign _comments = "<!-- -->" | split: " " %}{% else %}{% assign _comments = site.compress_html.comments %}{% endif %}{% if _comments.size == 2 %}{% capture _comment_befores %}.{{ _content }}{% endcapture %}{% assign _comment_befores = _comment_befores | split: _comments.first %}{% for _comment_before in _comment_befores %}{% if forloop.first %}{% continue %}{% endif %}{% capture _comment_outside %}{% if _carry %}{{ _comments.first }}{% endif %}{{ _comment_before }}{% endcapture %}{% capture _comment %}{% unless _carry %}{{ _comments.first }}{% endunless %}{{ _comment_outside | split: _comments.last | first }}{% if _comment_outside contains _comments.last %}{{ _comments.last }}{% assign _carry = false %}{% else %}{% assign _carry = true %}{% endif %}{% endcapture %}{% assign _content = _content | remove_first: _comment %}{% endfor %}{% if _profile %}{% assign _profile_comments = _content | size | plus: 1 %}{% endif %}{% endif %}{% assign _pre_befores = _content | split: "<pre" %}{% assign _content = "" %}{% for _pre_before in _pre_befores %}{% assign _pres = _pre_before | split: "</pre>" %}{% assign _pres_after = "" %}{% if _pres.size != 0 %}{% if site.compress_html.blanklines %}{% assign _lines = _pres.last | split: _LINE_FEED %}{% capture _pres_after %}{% for _line in _lines %}{% assign _trimmed = _line | split: " " | join: " " %}{% if _trimmed != empty or forloop.last %}{% unless forloop.first %}{{ _LINE_FEED }}{% endunless %}{{ _line }}{% endif %}{% endfor %}{% endcapture %}{% else %}{% assign _pres_after = _pres.last | split: " " | join: " " %}{% endif %}{% endif %}{% capture _content %}{{ _content }}{% if _pre_before contains "</pre>" %}<pre{{ _pres.first }}</pre>{% endif %}{% unless _pre_before contains "</pre>" and _pres.size == 1 %}{{ _pres_after }}{% endunless %}{% endcapture %}{% endfor %}{% if _profile %}{% assign _profile_collapse = _content | size | plus: 1 %}{% endif %}{% if site.compress_html.clippings == "all" %}{% assign _clippings = "html head title base link meta style body article section nav aside h1 h2 h3 h4 h5 h6 hgroup header footer address p hr blockquote ol ul li dl dt dd figure figcaption main div table caption colgroup col tbody thead tfoot tr td th" | split: " " %}{% else %}{% assign _clippings = site.compress_html.clippings %}{% endif %}{% for _element in _clippings %}{% assign _edges = " <e;<e; </e>;</e>;</e> ;</e>" | replace: "e", _element | split: ";" %}{% assign _content = _content | replace: _edges[0], _edges[1] | replace: _edges[2], _edges[3] | replace: _edges[4], _edges[5] %}{% endfor %}{% if _profile and _clippings %}{% assign _profile_clippings = _content | size | plus: 1 %}{% endif %}{{ _content }}{% if _profile %} <table id="compress_html_profile_{{ site.time | date: "%Y%m%d" }}" class="compress_html_profile"> <thead> <tr> <td>Step <td>Bytes <tbody> <tr> <td>raw <td>{{ content | size }}{% if _profile_endings %} <tr> <td>endings <td>{{ _profile_endings }}{% endif %}{% if _profile_startings %} <tr> <td>startings <td>{{ _profile_startings }}{% endif %}{% if _profile_comments %} <tr> <td>comments <td>{{ _profile_comments }}{% endif %}{% if _profile_collapse %} <tr> <td>collapse <td>{{ _profile_collapse }}{% endif %}{% if _profile_clippings %} <tr> <td>clippings <td>{{ _profile_clippings }}{% endif %} </table>{% endif %}{% endif %}
 </html>

data/_layouts/default.html

@@ -4,10 +4,11 @@ layout: base
 
 <div class="page">
   <h1 class="page-title">{{ page.title | default:"Home"}}</h1>
-  {% capture message %}
-Looks like you are using the `{{ page.layout }}` layout. This layout is not supported by Hydejack. Instead use `blog` or `list`. For more information see the [Hydejack Documentation](https://qwtel.com/hydejack/docs/6.0.0-beta3/).
+  {% capture text %}
+Looks like you are using the `{{ page.layout }}` layout. This layout is not supported by Hydejack. Instead use `blog` or `list`. For more information see the [Hydejack Documentation](https://qwtel.com/hydejack/docs/latest/).
   {% endcapture %}
-  {% include message.html text=message %}
+  {% include message.html text=text %}
+  <hr/>
 
   {{ content }}
 

data/_layouts/list.html

@@ -17,6 +17,7 @@ layout: base
 {% if page.title.size > 0 %}
   <h1 class="page-title">{{ page.title }}</h1>
   {% include message.html text=page.description %}
+  <hr/>
 {% endif %}
 
 {% for post in posts %}
@@ -24,6 +25,7 @@ layout: base
   {% if currentdate != date %}
     {% unless forloop.first %}</ul>{% endunless %}
     <h2 id="y{{post.date | date: "%Y"}}">{{ currentdate }}</h2>
+    <hr/>
     <ul class="related-posts">
     {% assign date = currentdate %}
   {% endif %}

data/_layouts/page.html

@@ -5,6 +5,7 @@ layout: base
 <article class="page" role="article">
   <h1 class="page-title">{{ page.title }}</h1>
   {% include message.html text=page.description %}
+  <hr/>
 
   {{ content }}
 </article>

data/_sass/_variables.scss

@@ -16,12 +16,12 @@ $border-color-light: #eee;
 $code-font-family: Menlo, Monaco, Consolas, monospace;
 $code-color: inherit;
 
-$break-point-1: 38em;
-$break-point-2: 50em;
+$break-point-1: 40em;
+$break-point-2: 54em;
 $break-point-3: 60em;
 $break-point-4: 72em;
 $break-point-5: 92em;
-$break-point-dynamic: 103.5em;
+$break-point-dynamic: 97.5em;
 $break-point-font-large: 125em;
 
 $dynamic-width: calc(50% - 28rem);

data/_sass/hydejack/_base-inline.scss

@@ -13,31 +13,14 @@ body, main {
   //     -ms-text-size-adjust: 100%;
 }
 
-@media screen {
-  main {
-    min-height: 100vh;
-    border-left: 0.5rem solid #ddd;
-  }
-}
-
-.shadow-main {
-  position: fixed;
-  // top: 0;
-  // left: 0.5rem;
-  // opacity: 0;
-  // will-change: opacity;
-  // width: calc(100% - 0.5rem);
-  // z-index: 2;
-  pointer-events: none;
-}
-
-.loading {
-  display: none;
-  // position: fixed;
-  // top: 1rem;
-  // right: 0;
-  // transform-origin: top left;
-  // transform: scale(0.33);
+body::before {
+  content: '';
+  width: .5rem;
+  background: $border-color;
+  position: absolute;
+  left: 0;
+  top: 0;
+  bottom: 0;
 }
 
 @media screen and (min-width: $break-point-1) {
@@ -50,15 +33,6 @@ body, main {
   html {
     font-size: $root-font-size;
   }
-
-  main {
-    border-left: none;
-  }
-
-  // .shadow-main {
-  //   left: 0;
-  //   width: 100%;
-  // }
 }
 
 @media screen and (min-width: $break-point-4) {
@@ -103,7 +77,7 @@ body, main {
 
 a, .a {
   position: relative;
-  padding-bottom: 0.15rem;
+  padding-bottom: .15rem;
   border-bottom: 1px solid;
   // transition: color 500ms, border-color 250ms ease;
   //
@@ -139,3 +113,7 @@ a, .a {
     // object-position: center;
   }
 }
+
+h2 + hr {
+  margin-top: 0;
+}

data/_sass/hydejack/_base.scss

@@ -13,31 +13,14 @@ body, main {
       -ms-text-size-adjust: 100%;
 }
 
-// @media screen {
-//   main {
-//     min-height: 100vh;
-//     border-left: 0.5rem solid #ddd;
-//   }
-// }
-
-.shadow-main {
-  // position: fixed;
-  top: 0;
-  left: 0.5rem;
-  opacity: 0;
-  will-change: opacity;
-  width: calc(100% - 0.5rem);
-  z-index: 2;
-  // pointer-events: none;
-}
-
-.loading {
-  // display:none;
-  position: fixed;
-  top: 1rem;
-  right: 0;
-  transform-origin: top left;
-  transform: scale(0.33);
+body::before {
+//   content: '';
+//   width: .5rem;
+//   background: $border-color;
+//   position: absolute;
+//   left: 0;
+//   top: 0;
+//   bottom: 0;
 }
 
 @media screen and (min-width: $break-point-1) {
@@ -50,15 +33,6 @@ body, main {
   // html {
   //   font-size: $root-font-size;
   // }
-  //
-  // main {
-  //   border-left: none;
-  // }
-
-  .shadow-main {
-    left: 0;
-    width: 100%;
-  }
 }
 
 @media screen and (min-width: $break-point-4) {
@@ -103,7 +77,7 @@ body, main {
 
 a, .a {
   // position: relative;
-  // padding-bottom: 0.15rem;
+  // padding-bottom: .15rem;
   // border-bottom: 1px dotted transparent;
   transition: color 500ms, border-color 250ms;
 
@@ -139,3 +113,7 @@ a, .a {
     object-position: center;
   }
 }
+
+// h2 + hr {
+//   margin-top: .5rem;
+// }

data/_sass/hydejack/_content-inline.scss

@@ -5,14 +5,22 @@
  */
 
 .content {
-  padding-top: 5rem;
-  padding-bottom: 10rem;
+  position: relative;
+  margin-left: auto;
+  margin-right: auto;
+  padding: 5rem 1rem 12rem;
+
+  @media screen {
+    max-width: 38rem;
+    padding-left: 1.5rem;
+    min-height: 100vh;
+  }
 
   @media screen and (min-width: $break-point-2) {
     max-width: 42rem;
-    padding-top: 4rem;
-    margin-left: 20rem;
-    margin-right: 2rem;
+    padding: 4rem 1rem 12rem;
+    margin-left: 22rem;
+    margin-right: 4rem;
   }
 
   @media screen and (min-width: $break-point-4) {

data/_sass/hydejack/_menu-inline.scss

@@ -1,31 +1,32 @@
-.menu {
-  display: block;
-  padding: 1.25rem 1.5rem;
-  color: $gray;
-  border-bottom: none;
+.fixed-top {
   position: fixed;
   top: 0;
   left: 0;
+  width: 100%;
   z-index: 1;
+}
+
+.navbar > .content {
+  padding-top: 0;
+  padding-bottom: 0;
+  min-height: 0;
+  height: 0;
+}
+
+.menu {
+  display: inline-block;
+  padding: 1.75rem 1.5rem;
+  border-bottom: none;
+  margin-left: -1.5rem;
+  color: $gray!important;
 
   @media screen and (min-width: $break-point-2) {
+    padding: 1.25rem 1.5rem;
     position: absolute;
     left: -9999px;
 
     &:focus {
-      left: 19.5rem;
-    }
-  }
-
-  @media screen and (min-width: $break-point-3) {
-    &:focus {
-      left: 21.5rem;
-    }
-  }
-
-  @media screen and (min-width: $break-point-dynamic) {
-    &:focus {
-      left: calc(50% - 24.5rem);
+      position: static;
     }
   }
 
@@ -33,3 +34,19 @@
   //   display: none;
   // }
 }
+
+.shadow-main {
+  // opacity: 0;
+  // will-change: opacity;
+  pointer-events: none;
+}
+
+.loading {
+  display: none;
+  // position: absolute;
+  // top: 0;
+  // right: 0;
+  // padding: 3 * 1.75rem 3 * 1.5rem;
+  // transform-origin: top right;
+  // transform: scale(0.33);
+}