jumbo-jekyll-theme 5.7.0.4 → 5.7.0.5

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 39c295fc456d1f91410d059341206364b249d6f671cffe5c209231e2bf5e21f3
-  data.tar.gz: 1193f8810c1038ebc1aaf173fd6aa84ef3378c7cef83038bb871b51f95afb691
+  metadata.gz: 29dfefc605a487b71001741a124e6450002a3d807e2bbfa079708b86fe26ab52
+  data.tar.gz: 25e5ab5535fdcd88b5d52bff67afa4c2ff4aa7db48952f4e0cfcb7238f55610b
 SHA512:
-  metadata.gz: 3014be27c4a85a43e5e4cc44703f28796af2fed9755a35340e785c37a50bd9f2f2bba226cf95b9aee516c7365215267aebcff5d257ceee0233106e032ba30395
-  data.tar.gz: f10f39ae39c3a87878157b500956b4e57953cf555bc5853400683f287ce02458c0ca895f305aaf3dfcfdf4ac2ed6646137a2fc75cb117f7a048ac58920a48dbd
+  metadata.gz: ffe8aaaa4ebfeb3687597fca2379aa0716f0bfc97499315180076329acbf497c855ffa820cd6a56759f80809636bf75e2e84faed8a75703b81f106efe2953fe5
+  data.tar.gz: eff8de670dc5b438ad63e8e64c77c88913cac683e0aac813e2bd2e4324bbdf373f4fe954758095e5b4e11215e65038f6220cd4880ade638276f650a1eff6adc7

data/_config.yml

@@ -76,11 +76,10 @@ http2_resources:
     href: /assets/fonts/lato/Lato-regular.woff2
 google_analytics:
   enabled: true
-  cookies_popup_title: Cookies & Privacy Policy
+  cookies_popup_title: Test Cookies & Privacy Policy
   cookies_popup_description: >
-    Cookies enable you to use this website to the full extent and to personalize your experience on our sites. They tell us which parts of our websites people have visited, help us measure the effectiveness of ads and web searches and give us insights into user behavior so we can improve our communications with you.
-  privacy_url: /privacy/
-  enabled: true
+    Cookies enable test you to use this website to the full extent and to personalize your experience on our sites. They tell us which parts of our websites people have visited, help us measure the effectiveness of ads and web searches and give us insights into user behavior so we can improve our communications with you.
+  privacy_url: /privacy-test/
   code: UAXXXXXXB
 # Set the site-wide default social media share image.
 social_media_share_image: /assets/images/social-media-image.png

data/_data/picture.yml

@@ -68,7 +68,9 @@ markup_presets:
     fallback_width: 600 # Default 800
   # Images for blog posts
   blog_image:
-    markup: img
+    markup: data_picture
+    attributes:
+      img: 'class="lazyload img-fluid blog_content_image "'
     formats: [webp, original]
     widths: [400,800,1200]
   header_image:
@@ -127,7 +129,7 @@ markup_presets:
     attributes:
       img: 'class="lazyload rounded-circle small"'
     formats: [webp, original]
-    widths: [50]
+    widths: [50, 100]
   post_thumb:
     markup: data_picture
     attributes:

data/_includes/blog/display_latest_posts.html

@@ -4,7 +4,7 @@
     {% assign posts = site.posts | sort: 'date' | reverse %}
 {% endif %}
 <div class="row py-0">
-    {% for post in posts limit: 9 %}
+    {% for post in posts limit: 20 %}
         {% assign timeframe = 604800 %}
         {% assign post_in_seconds = post.date | date: "%s" | plus: 0 %}
         {% assign recent_posts = "now" | date: "%s" | minus: timeframe %}
@@ -60,14 +60,6 @@
             </div>
         {% else %}
 
-            {% comment %}
-                Blog Filler Element - This is needed due to the layout of the blog. If not included then there will be an empty col on the first blog page.
-            {% endcomment %}
-
-            {% if forloop.index == 6 %}
-                {% include {{site.blog_filler_element}} %}
-            {% endif %}
-
             <div class="col col-12 col-sm-6 col-lg-4 blog-post-item-col p-3">
                 <div class="card h-100 ">
                     <div class="blog_image_header">
@@ -98,13 +90,13 @@
                         </div>
                         <h5 class="card-title">{{post.title}}</h5>
                         <h6 class="card-subtitle mb-2 text-muted">{{ post.date | date: "%A, %B %-d, %Y"}}</h6>
+                        {% include blog/read_time.html content=post.content %}
                         <p class="card-text">
                             {% if post.description %}
-                                {{post.description}}
+                                {{post.description | strip_html | truncatewords:30 }}
                             {% else %}
                                 {{ post.content | strip_html | truncatewords:30 }}
                             {% endif %}
-                            Read time: {% include blog/read_time.html content=post.content %}
                         </p>
                         <p class="card-text">
                             <a href="{{post.url}}" class="btn btn-primary">Read</a>

data/_includes/blog/post_search.html

@@ -1,4 +1,4 @@
-{% assign url = include.object.payload | where: 'name', 'url' | first  %}
+{% assign url = include.object.payload %}
 <div class="col col-12 ">
     <div id="post_search" data-file-path="{{url.data}}">
         <input class="form-control form-control-lg"  id="search-input" type="text" placeholder="Search {{posts.size}} posts..."/>

data/_includes/blog/read_time.html

@@ -4,4 +4,4 @@
 {% else %}
     {% assign words = content | number_of_words %}
 {% endif %}
-<span class="reading-time" title="Estimated read time">{% if words < 360 %}1 min read{% else %}{{ words | divided_by:180 }} mins read{% endif %} <i class="fa fa-clock-o" aria-hidden="true"></i></span>
+<span class="reading-time badge badge-light" title="Estimated read time">{% if words < 360 %}1 min read{% else %}{{ words | divided_by:180 }} mins read{% endif %} <i class="fa fa-clock-o" aria-hidden="true"></i></span>

data/_includes/flow/blocks.html

@@ -7,13 +7,13 @@
             {% endif %}
             {% for block in include.object.block_section_content.blocks %}
                 <div class="col col-12 col-sm-6 col-lg-{{block_width}} block_column">
-                    <div class="card h-100 {% if block.background_image %}background_image text-white{% endif %}">
+                    <div class="card h-100 {% if block.background_image %}background_image text-white{% endif %} {% if block.style %}{{block.style}}{% endif %}">
                         {% if block.image %}
                             {% assign block_image = block.image | remove_first: "/assets/images/" %}
                             {% capture block_image_alt %}{{block.title}} image {% endcapture %}
                             {% picture card_block_image {{block_image}} --alt {{block_image_alt}} %}
                         {% endif %}
-                        <div class="card-body {% if block.background_image %}card-img-overlay{% else %}card-body{% endif %}">
+                        <div class="card-body {% if block.background_image %}card-img-overlay{% else %}card-body{% endif %}  {% if block.content_style %}{{block.content_style}}{% endif %}">
                             {% if block.title %}
                             <h5 class="card-title">{{block.title}}</h5>
                             {% endif %}

data/_includes/flow/buttons.html

@@ -1,4 +1,4 @@
-<div class="col col-12 buttons no-padding {% if include.style %}{{include.style}}{% endif %}">
+<div class="col col-12 buttons px-0 {% if include.style %}{{include.style}}{% endif %}">
     {% for button in include.object %}
         {% include flow/button.html object=button %}
     {% endfor %}

data/_includes/image.html

@@ -1,5 +1,11 @@
-{% if include.path %}
-{% picture blog_image {{include.path | remove_first: "/assets/images/" }} %}
+{% if include.alt %}
+    {% capture image_alt %}{{include.alt}}{% endcapture %}
 {% else %}
-Image path not specified...
+    {% capture image_alt %}{{page.title}} content image{% endcapture %}
 {% endif %}
+{% if include.class %}
+    {% capture image_class %}{{include.class}}{% endcapture %}
+{% else %}
+    {% capture image_class %}{% endcapture %}
+{% endif %}
+{% picture blog_image {{include.path | remove_first: "/assets/images/" }} class="{{image_class}}"  --alt {{image_alt}} --class {{image_class}} %}

data/_includes/media.html

@@ -6,6 +6,6 @@
     {% assign media_url = include.media_url %}
 {% endif %}
 
-<div class="embed-responsive embed-responsive-16by9">
+<div class="embed-responsive embed-responsive-16by9" {% if include.class %}{{include.class}}{% endif %}>
   <iframe src='about:blank' allowFullScreen="allowFullScreen" frameBorder="0" class="lazyload embed-responsive-item" data-src="{{media_url}}"></iframe>
 </div>

data/_includes/nav/universal_nav.html

@@ -14,7 +14,7 @@
                 {% for item in site.data.universal_nav.items %}
                     {% if item.options %}
                         <li class="nav-item dropdown {% for project-site in item.options %}{% if project-site.active %}active{% break %}{% endif %}{% endfor %}">
-                            <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown"
+                            <a class="nav-link dropdown-toggle" target="_self" href="#" id="navbarDropdown" role="button" data-toggle="dropdown"
                                 aria-haspopup="true" aria-expanded="false">
                                 {{item.title}}
                             </a>
@@ -26,7 +26,7 @@
                         </li>
                     {% else %}
                         <li class="nav-item {% if item.active %}active{% endif %}">
-                            <a class="nav-link" href="{{item.url}}">{{item.title}} <span class="sr-only">(current)</span></a>
+                            <a target="_self" class="nav-link" href="{{item.url}}">{{item.title}} <span class="sr-only">(current)</span></a>
                         </li>
                     {% endif %}
                 {% endfor %}

data/_layouts/flow.html

@@ -10,7 +10,7 @@ layout: base
     {% if page.flow %}
         {% for each in page.flow %}
             {% if each.row == "main_content_row" %}
-                <div class="row" id="main_content">
+                <div class="row {% if each.style %}{{style}}{% endif %}" id="main_content">
                     <div class="container">
                         {{content}}
                     </div>

data/_layouts/post.html

@@ -2,6 +2,7 @@
 layout: base
 css_package: blog
 ---
+<div itemscope="" itemtype="http://schema.org/BlogPosting">
 <div
     class="jumbotron d-flex align-items-center jumbotron-fluid {% if page.image %}background_image{% endif%}">
     {% if page.image %}
@@ -10,7 +11,7 @@ css_package: blog
     {% endif %}
     <div class="container text-center">
         <div class="inner_content_wrapper">
-            <h1 class="">{{page.title}}</h1>
+            <h1 class="" itemprop="name headline">{{page.title}}</h1>
 
             {% assign author = site.authors | where: "username", page.author | first %}
             {% assign author-url = author.url %}
@@ -21,15 +22,17 @@ css_package: blog
             {% else %}
                 {% assign author_image = site.avatar_placeholder | remove_first: "/assets/images/" %}
             {% endif %}
-            <a href="{{author-url}}">
-                {% picture author_thumbnail {{author_image}} --alt {{author_image_alt}} %}
-                <p class="lead">
-                    <em>{{author_name}}</em>
-                </p>
-            </a>
-            <hr class="my-4">
+            <div itemprop="author" itemscope="" itemtype="http://schema.org/Person">
+                <a href="{{author-url}}" itemprop="url" rel="author">
+                    {% picture author_thumbnail {{author_image}} --alt {{author_image_alt}} %}
+                    <p class="lead">
+                        <em itemprop="name">{{author_name}}</em>
+                    </p>
+                </a>
+            </div>
+
             <p>
-                <em>{{page.date |  date: "%A, %B %-d, %Y"}}</em>
+                <time datetime="{{page.date}}" itemprop="datePublished">{{page.date |  date: "%A, %B %-d, %Y"}}</time>
             </p>
             {% include blog/read_time.html %}
         </div>
@@ -53,3 +56,4 @@ css_package: blog
         </div>
     </div>
 </div>
+</div>

data/_sass/app/custom.scss

@@ -0,0 +1 @@
+/* Custom rules for your website can be defined here. */

data/_sass/core/blog.scss

@@ -1,170 +1,206 @@
 #wrapper {
-    #post_search {
-        #results-container {
-            position: absolute;
-            z-index: 9999;
-            background-color: white;
-            width: 100%;
-            border: 1px solid #eee;
-            height: 300px;
-            overflow: scroll;
+  .blog-content {
+    .blog_content_image {
+      margin: 20px 0px;
+      &.small-inline {
+        @include media-breakpoint-up(md) {
+          width: 200px;
+          display: block;
+          float: left;
+          margin: 0px 20px;
         }
-        .close_search {
-            display:none;
-            position: absolute;
-            top: 0px;
-            right: 0px;
-            font-size: 26px;
-            color:#000;
-            line-height: 80px;
-            padding-right: 10px;
-            &:hover{
-                text-decoration: none;
-                color:$primary;
-            }
+      }
+      &.medium-inline {
+        @include media-breakpoint-up(md) {
+          width: 300px;
+          display: block;
+          float: left;
+          margin: 0px 20px;
         }
-        .search_result_img {
-            width: 100px;
+      }
+      &.large-inline {
+        @include media-breakpoint-up(md) {
+          width: 400px;
+          display: block;
+          float: left;
+          margin: 0px 20px;
         }
-    }
-    .highlighter-rouge {
-        div.highlight {
-            position: relative;
-            pre.highlight {
-                padding: 15px;
-                position: relative;
-            }
-            .copyBtn {
-                position: absolute;
-                bottom: 0px;
-                z-index: 9999;
-                height: 40px;
-                right: 0px;
-                border-left: 1px solid white;
-                border-top: 1px solid white;
-                border-top-right-radius: 0px;
-                border-bottom-right-radius: 0px;
-                border-bottom-left-radius: 0px;
-                width: 40px;
-                &:hover, &:focus  {
-                    background-color:$primary;
-                }
-            }
+      }
+      &.right {
+        @include media-breakpoint-up(md) {
+          float: right !important;
         }
+      }
+
     }
-    .suggested_post_thumb {
-        width: 100px;
-        border:1px solid lightgray;
-        padding:0;
-        @include media-breakpoint-down(xs) {
-            width:100%;
-        }
+  }
+  #post_search {
+    #results-container {
+      position: absolute;
+      z-index: 9999;
+      background-color: white;
+      width: 100%;
+      border: 1px solid #eee;
+      height: 300px;
+      overflow: scroll;
     }
-    .media-body {
-        h5{
-            font-size: 1.7rem;
-        }
-        & > a {
-            color: #313131;
-            &:hover{
-                text-decoration: none;
-            }
-        }
+    .close_search {
+      display: none;
+      position: absolute;
+      top: 0px;
+      right: 0px;
+      font-size: 26px;
+      color: #000;
+      line-height: 80px;
+      padding-right: 10px;
+      &:hover {
+        text-decoration: none;
+        color: $primary;
+      }
     }
-    .suggested_post_date {
-        display:block;
+    .search_result_img {
+      width: 100px;
     }
-    a {
-        transition: all 500ms ease-in-out;
-        &:hover {
-            color: $primary;
+  }
+  .highlighter-rouge {
+    div.highlight {
+      position: relative;
+      pre.highlight {
+        padding: 15px;
+        position: relative;
+      }
+      .copyBtn {
+        position: absolute;
+        bottom: 0px;
+        z-index: 9999;
+        height: 40px;
+        right: 0px;
+        border-left: 1px solid white;
+        border-top: 1px solid white;
+        border-top-right-radius: 0px;
+        border-bottom-right-radius: 0px;
+        border-bottom-left-radius: 0px;
+        width: 40px;
+        &:hover,
+        &:focus {
+          background-color: $primary;
         }
+      }
     }
-    .rounded-circle {
-        width: 100px;
-        height: 100px;
-        &.small {
-            height: 50px;
-            width: 50px;
-            margin-right: 10px;
-        }
+  }
+  .suggested_post_thumb {
+    width: 100px;
+    border: 1px solid lightgray;
+    padding: 0;
+    @include media-breakpoint-down(xs) {
+      width: 100%;
     }
-    .featured_post {
-        .row {
-            border-radius: 20px;
-            overflow: hidden;
-            -webkit-box-shadow: 0px 0px 20px 5px #f0f0f0;
-            -moz-box-shadow: 0px 0px 20px 5px #e5e5e5;
-            box-shadow: 0px 0px 20px 5px #ebebeb;
-            margin-left: 0;
-            margin-right: 0;
-            padding: 0px;
-            .latest-featured-post-content {
-                .card{
-                    border-radius: 20px;
-                    border-top-right-radius: 0px;
-                    border-bottom-right-radius: 0px;
-                    @include media-breakpoint-down(sm){
-                        border-bottom-right-radius: 20px;
-                        border-top-right-radius: 0px;
-                        border-top-left-radius: 0px;;
-                    }
-                }
-            }
-        }
+  }
+  .media-body {
+    h5 {
+      font-size: 1.7rem;
     }
-    .blog_image_header {
-        overflow: hidden;
-        position: relative;
-        img {
-            height: 150px;
-            width: 100%;
-            object-fit: cover;
-        }
-        &:after {
-            content: '';
-            display: none;
-            height: 100%;
-            width: 100%;
-            position: absolute;
-            top: 0px;
-            opacity: .4;
-            background-color: $primary;
-            z-index: 0;
-        }
-        &:before {
-            content: 'Read';
-            display: none;
-            width: 100%;
-            color:white;
-            position: absolute;
-            z-index: 1;
-            text-align: center;
-            top: 50%;
-            transform: translateY(-50%);
-            opacity:1;
-
-        }
+    & > a {
+      color: #313131;
+      &:hover {
+        text-decoration: none;
+      }
+    }
+  }
+  .suggested_post_date {
+    display: block;
+  }
+  a {
+    transition: all 500ms ease-in-out;
+    &:hover {
+      color: $primary;
+    }
+  }
+  .rounded-circle {
+    width: 100px;
+    height: 100px;
+    &.small {
+      height: 50px;
+      width: 50px;
+      margin-right: 10px;
     }
-    .blog-post-item-col {
+  }
+  .featured_post {
+    .row {
+      border-radius: 20px;
+      overflow: hidden;
+      -webkit-box-shadow: 0px 0px 20px 5px #f0f0f0;
+      -moz-box-shadow: 0px 0px 20px 5px #e5e5e5;
+      box-shadow: 0px 0px 20px 5px #ebebeb;
+      margin-left: 0;
+      margin-right: 0;
+      padding: 0px;
+      .latest-featured-post-content {
         .card {
-            border-radius: 20px;
-            overflow:hidden;
-            -webkit-box-shadow: 0px 0px 20px 5px #f0f0f0;
-            -moz-box-shadow: 0px 0px 20px 5px #e5e5e5;
-            box-shadow: 0px 0px 20px 5px #ebebeb;
-            transition: all 200ms ease;
-            &:hover {
-                transform: translateY(-5px);
-                -webkit-box-shadow: 0px 0px 20px 5px #b3b3b3;
-                -moz-box-shadow: 0px 0px 20px 5px #b3b3b3;
-                box-shadow: 0px 0px 20px 5px#b3b3b3;
-                .blog_image_header {
-                    &:before , &:after {
-                        display:block;
-                    }
-                }
-            }
+          border-radius: 20px;
+          border-top-right-radius: 0px;
+          border-bottom-right-radius: 0px;
+          @include media-breakpoint-down(sm) {
+            border-bottom-right-radius: 20px;
+            border-top-right-radius: 0px;
+            border-top-left-radius: 0px;
+          }
+        }
+      }
+    }
+  }
+  .blog_image_header {
+    overflow: hidden;
+    position: relative;
+    img {
+      height: 150px;
+      width: 100%;
+      object-fit: cover;
+    }
+    &:after {
+      content: "";
+      display: none;
+      height: 100%;
+      width: 100%;
+      position: absolute;
+      top: 0px;
+      opacity: 0.4;
+      background-color: $primary;
+      z-index: 0;
+    }
+    &:before {
+      content: "Read";
+      display: none;
+      width: 100%;
+      color: white;
+      position: absolute;
+      z-index: 1;
+      text-align: center;
+      top: 50%;
+      transform: translateY(-50%);
+      opacity: 1;
+    }
+  }
+  .blog-post-item-col {
+    .card {
+      border-radius: 20px;
+      overflow: hidden;
+      -webkit-box-shadow: 0px 0px 20px 5px #f0f0f0;
+      -moz-box-shadow: 0px 0px 20px 5px #e5e5e5;
+      box-shadow: 0px 0px 20px 5px #ebebeb;
+      transition: all 200ms ease;
+      &:hover {
+        transform: translateY(-5px);
+        -webkit-box-shadow: 0px 0px 20px 5px #b3b3b3;
+        -moz-box-shadow: 0px 0px 20px 5px #b3b3b3;
+        box-shadow: 0px 0px 20px 5px#b3b3b3;
+        .blog_image_header {
+          &:before,
+          &:after {
+            display: block;
+          }
         }
+      }
     }
+  }
 }

data/_sass/core/jumbotron.scss

@@ -8,6 +8,10 @@
         img {
             height: 150px;
             width: auto;
+            &.rounded-circle {
+                height: 75px;
+                width: 75px;
+            }
         }
     }
     h1 {

data/assets/css/main.scss

@@ -1,6 +1,8 @@
 ---
 ---
 @charset "UTF-8";
+// Custom sass and css rules
+@import "app/custom";
 //Bootstrap Overrides
 @import "app/overrides";
 @import "bootstrap/functions";

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: jumbo-jekyll-theme
 version: !ruby/object:Gem::Version
-  version: 5.7.0.4
+  version: 5.7.0.5
 platform: ruby
 authors:
 - Kyle Kirkby
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2020-04-01 00:00:00.000000000 Z
+date: 2020-04-17 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -205,6 +205,7 @@ files:
 - _layouts/flow.html
 - _layouts/post.html
 - _sass/app/blog.scss
+- _sass/app/custom.scss
 - _sass/app/overrides.scss
 - _sass/app/search.scss
 - _sass/blog.scss