type-on-strap 2.0.3 → 2.1.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 909d4360d960728b6976dae7998f9b7f01918238a0ea68a227d49ab0a38a2796
-  data.tar.gz: 8f5a5364a81b0559482a8093f9f14015e233102959a1a4f1fe744e09d62f3218
+  metadata.gz: ef06489094e16d39de802e362adc81b54d3a464458b52c84c02e0ce2b96cb3b4
+  data.tar.gz: b66a8e226d91c60fce5fa5ecf4abf7f54b39cfc5acb8234db84d4d1058c5f07b
 SHA512:
-  metadata.gz: 6e018b160763e591a46ee24f788c514a08172961c96c3a402f89f9bbc8c0ada741d2c5c395d2c13ea5770178382d0df5a70d9507d9c08712cc1ccd3653cf83b2
-  data.tar.gz: 3b2645e13b83aac4f1a36a5fafd57d0b0593641b8b0f0382913c95fb5a28bd7912e70c77943f47486709956e8597eb3a4f4b787e9493d5472a248bef36bc60fb
+  metadata.gz: dbd593fe75da9e1ccc579b9b33250d7ef176fda853622dd8b6fcf4f8dce15eac6ab8c42096442bda6411552a5f56b592f8408dc85e9b6e943a7397b5b0a8b769
+  data.tar.gz: aed10825e1a462a433438b09d0acabdf0e9c013b6720eb5e2ab08a50a1153ee7a862cabdd63b8bbf1441e166de13ea6c578bd979fc2236565eb6843f0f1649b9

data/README.md

@@ -2,7 +2,7 @@
 
 [![Build Status](https://travis-ci.org/sylhare/Type-on-Strap.svg?branch=master)](https://travis-ci.org/sylhare/Type-on-Strap)
 [![Gem Version](https://badge.fury.io/rb/type-on-strap.svg)](https://badge.fury.io/rb/type-on-strap)
-[![Docker Pulls](https://img.shields.io/docker/pulls/sylhare/type-on-strap)](https://hub.docker.com/repository/docker/sylhare/type-on-strap)
+[![Docker Pulls](https://img.shields.io/docker/pulls/sylhare/type-on-strap)](https://hub.docker.com/r/sylhare/type-on-strap)
 
 A free and open-source [Jekyll](https://jekyllrb.com) theme. Based on Rohan Chandra [type-theme](https://github.com/rohanchandra/type-theme) with a few new features:
 
@@ -23,13 +23,13 @@ A free and open-source [Jekyll](https://jekyllrb.com) theme. Based on Rohan Chan
 
 ## Table of Contents
 
-1. [Usage](https://github.com/Sylhare/Type-on-Strap#Usage)
-2. [Structure](https://github.com/Sylhare/Type-on-Strap#structure)
-3. [Configure Type on Strap](https://github.com/Sylhare/Type-on-Strap#configure-type-on-strap)
-4. [Other Layouts](https://github.com/Sylhare/Type-on-Strap#other-layouts)
-5. [Feature pages](https://github.com/Sylhare/Type-on-Strap#feature-pages)
-6. [Advanced](https://github.com/Sylhare/Type-on-Strap#advanced)
-7. [License](https://github.com/Sylhare/Type-on-Strap#license)
+  - [Usage](#usage)
+  - [Structure](#structure)
+  - [Configure Type on Strap](#configure-type-on-strap)
+  - [Other Layouts](#other-layouts)
+  - [Feature pages](#feature-pages)
+  - [Advanced](#advanced)
+  - [License](#license)
 
 ## Usage
 
@@ -265,6 +265,23 @@ some text in the excerpt
 
 The html is stripped out of the excerpt so it only display text.
 
+
+### Image aligner
+
+To easily add align images side by side in your article using the `aligner.html` include:
+
+```ruby
+{% include aligner.html images="path/to/img1.png,path/to/img2.png,path/to/img3.png" column=3 %}
+```
+
+Use it in any markdown file. There are two fields in the include you need to look into:
+  - _images_: Takes a string separated with `,` of all the images path. 
+    - It by default look into `assets/img/` so give the path from there.
+  - _column_: (OPTIONAL) Set the number of column you want your imaged displayed in.
+    - default is 2 columns
+    - `column=3` set 3 columns
+    - `column="auto"` makes as many columns as images
+
 ## Other Layouts
 Please refer to the [Jekyll docs for writing posts](https://jekyllrb.com/docs/posts/). 
 Non-standard features are documented below.

data/_includes/aligner.html

@@ -0,0 +1,15 @@
+{% assign images = include.images | split: ',' %}
+
+{% if include.column == "auto" %}
+{% assign column = 100.0 | divided_by: images.size %}
+{% elsif include.column > 0 %}
+{% assign column = 100.0 | divided_by: include.column %}
+{% endif %}
+
+<div class="row">
+    {% for image in images %}
+    <div {% unless column %}class="column"{% endunless%} style="flex: {{ column }}%" >
+        <img src="{{ image | prepend: 'assets/img/' | relative_url }}" alt="{{ image | prepend: '/' | split: '/' | last }}">
+    </div>
+    {% endfor %}
+</div>

data/_sass/includes/_navbar.scss

@@ -81,6 +81,7 @@
       &#pull {
         i {
           margin-top: 13px;
+          margin-right: 10px;
           float: right;
         }
 
@@ -121,7 +122,8 @@
       overflow: hidden;
 
       /* fade out, then shrink */
-      transition: opacity .5s .25s, font-size .5s .25s;
+      transition: opacity .25s 0s, font-size .25s 0s;
+      transition-delay: 0s;
 
       &.hide {
         font-size: 0;
@@ -129,24 +131,25 @@
         opacity: 0;
         padding: 0;
       }
+    }
 
-      li {
-        width: 100%;
-        text-align: center;
-        font-size: 1em;
-        position: relative;
-        background-color: darken($background-color, 2%);
+    li {
+      width: 100%;
+      text-align: center;
+      font-size: 1em;
+      position: relative;
+      background-color: darken($background-color, 2%);
 
-        &:nth-of-type(4n) {
-          background-color: $background-color;
-        }
+      &:nth-of-type(4n) {
+        background-color: $background-color;
+      }
 
-        a {
-          width: 100%;
-          margin: 0;
-          display: block;
-        }
+      a {
+        width: 100%;
+        margin: 0;
+        display: block;
       }
+
     }
   }
 }

data/_sass/layouts/_page.scss

@@ -9,4 +9,18 @@ h1.title {
   text-shadow: 1px 1px 2px $text-shadow;
 }
 
+.row {
+  display: flex;
+  flex-wrap: wrap;
+}
+
+.column {
+  flex: 50%;
+
+  img {
+    width: 100%;
+    min-width: 250px;
+  }
+}
+
 //Shared css in _post.scss

data/assets/js/main.min.js

@@ -1 +1 @@
-var elements=document.getElementsByTagName("script");Array.prototype.forEach.call(elements,function(e){if(-1!==e.type.indexOf("math/tex")){var t=e.innerText||e.textContent;t=t.replace(/%.*/g,"");var n=document.createElement("span");-1!==e.type.indexOf("mode=display")?(n.className+="math-display",t="\\displaystyle {"+t+"}"):n.className+="math-inline",katex.render(t,n,{displayMode:!1}),e.parentNode.insertBefore(n,e)}});try{var elem=document.querySelector(".grid"),msnry=new Masonry(elem,{itemSelector:".grid-item",columnWidth:".grid-sizer",gutter:".gutter-sizer",percentPosition:!0}),imgLoad=imagesLoaded(elem);imgLoad.on("progress",function(e,t){msnry.layout()})}catch(e){if(!(e instanceof ReferenceError))throw e}document.addEventListener("DOMContentLoaded",function(e){var t=document.getElementById("pull"),n=document.querySelector("nav ul");t.addEventListener("click",function(e){n.classList.toggle("hide")}),window.addEventListener("scroll",function(){var e=window.pageYOffset||document.body.scrollTop;document.getElementById("main").style.backgroundPosition="100% "+parseInt(-e/3)+"px, 0%, center top"})});
+var elements=document.getElementsByTagName("script");Array.prototype.forEach.call(elements,function(e){if(-1!==e.type.indexOf("math/tex")){var t=e.innerText||e.textContent;t=t.replace(/%.*/g,"");var n=document.createElement("span");-1!==e.type.indexOf("mode=display")?(n.className+="math-display",t="\\displaystyle {"+t+"}"):n.className+="math-inline",katex.render(t,n,{displayMode:!1}),e.parentNode.insertBefore(n,e)}});try{var elem=document.querySelector(".grid"),msnry=new Masonry(elem,{itemSelector:".grid-item",columnWidth:".grid-sizer",gutter:".gutter-sizer",percentPosition:!0}),imgLoad=imagesLoaded(elem);imgLoad.on("progress",function(e,t){msnry.layout()})}catch(e){if(!(e instanceof ReferenceError))throw e}document.addEventListener("DOMContentLoaded",function(e){var t=document.getElementById("pull"),n=document.querySelector("nav ul");["click","touch"].forEach(function(e){t.addEventListener(e,function(e){n.classList.toggle("hide")},!1)}),window.addEventListener("scroll",function(){var e=window.pageYOffset||document.body.scrollTop;document.getElementById("main").style.backgroundPosition="100% "+parseInt(-e/3)+"px, 0%, center top"})});

data/assets/js/partials/navbar.js

@@ -6,8 +6,11 @@ document.addEventListener("DOMContentLoaded", function (event) {
   var pull = document.getElementById('pull');
   var menu = document.querySelector('nav ul');
 
-  pull.addEventListener('click', function (e) {
-    menu.classList.toggle('hide');
+
+  ['click', 'touch'].forEach(function (e) {
+    pull.addEventListener(e, function (e) {
+      menu.classList.toggle('hide')
+    }, false);
   });
 
   /*
@@ -20,4 +23,4 @@ document.addEventListener("DOMContentLoaded", function (event) {
 
     mainStyle.backgroundPosition = '100% ' + parseInt(-x / 3) + 'px' + ', 0%, center top';
   });
-});
+});

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: type-on-strap
 version: !ruby/object:Gem::Version
-  version: 2.0.3
+  version: 2.1.0
 platform: ruby
 authors:
 - Sylhare
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2020-01-31 00:00:00.000000000 Z
+date: 2020-03-25 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -87,6 +87,7 @@ files:
 - LICENSE
 - README.md
 - _data/language.yml
+- _includes/aligner.html
 - _includes/blog.html
 - _includes/blog_nav.html
 - _includes/disqus.html
@@ -267,7 +268,7 @@ post_install_message: |
 
     * Use _data/ for social and language customization
 
-    * Vist https://github.com/sylhare/Type-on-Strap for more info.
+    * Visit https://github.com/sylhare/Type-on-Strap for more info.
 
   -------------------------------------------------------------------------------------
 rdoc_options: