jekyll-theme-horizon-flow 1.0.2 → 1.0.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 0b1490345f03372f82de84d6e7cbf9bb019b71b7eaf29004d33864cc50056162
-  data.tar.gz: 3ca9974557e6cd103bbce7f55ec75cc35b5685aab2ec9a3e42f69839cd6653ff
+  metadata.gz: fd4a3025c5c7dee3341d1b781738590518af5ec7d17438132723a39a13758e9d
+  data.tar.gz: 8606bb51af10a0e4e3fbd022b2ce394d9cf299e9e06ccceb52f06741af34c29d
 SHA512:
-  metadata.gz: 8748f115726697bef71a04e003b388606e6c41943e10eb678ba6562c6286d25ad2b04a213fcf55268688154201dd747bea7d72b1f9d06ba6aa0993a405a0d678
-  data.tar.gz: 05dcf53e6abff5e184cd946187f9b33e01c592b2c3c4e056241322b30bab813dc8eb0404a7e01e8d905a5e24b5f0e916310f62c8e8b1face7e24fa9935bde007
+  metadata.gz: 6f296954fdad793ba6945194ce91b40e1fc71933df88d0e4b07442084fcc3a6c5beb62c0f0af2a0d9a4564c793a36e3bce0de2a9db94e7df849d7813e2412301
+  data.tar.gz: 32617a1c81c5d929a9e6bf5c73d59f47e6d29bbec9f0dfc774e688e986eb5771bd7d8dac0ed07df6f2c030cbe8e3f1223cac2aefde9f58f187c4c13bd4efa024

data/README.md

@@ -1,7 +1,5 @@
 # [Horizon Flow Jekyll Theme](https://papierkorp.github.io/jekyll-theme-horizon-flow/)
 
-<!-- MarkdownTOC -->
-
 - [Installation](#installation)
 - [Configuration](#configuration)
   - [Site URL](#site-url)
@@ -26,8 +24,6 @@
   - [`layout: tags`](#layout-tags)
 - [whislist](#whislist)
 
-<!-- /MarkdownTOC -->
-
 
 
 [![LICENSE](https://img.shields.io/badge/license-MIT-lightgrey.svg?style=flat-square)](https://raw.githubusercontent.com/papierkorp/jekyll-theme-horizon-flow/main/LICENSE.txt)
@@ -47,13 +43,10 @@ This theme can offer:
 * offers an archive
 * Carefully designed posts for almost all Markup elements
 * Activateable TOC and to the TOP Buttons for each post
+* Mobile Friendly
+* Highly Customizable
 
 ![Horizon Flow Screenshots](https://papierkorp.github.io/jekyll-theme-horizon-flow/screenshot.png)
-![Horizon Flow Screenshots](https://papierkorp.github.io/jekyll-theme-horizon-flow/post.png)
-![Horizon Flow Screenshots](https://papierkorp.github.io/jekyll-theme-horizon-flow/post_toc.png)
-![Horizon Flow Screenshots](https://papierkorp.github.io/jekyll-theme-horizon-flow/categories.png)
-![Horizon Flow Screenshots](https://papierkorp.github.io/jekyll-theme-horizon-flow/tags.png)
-![Horizon Flow Screenshots](https://papierkorp.github.io/jekyll-theme-horizon-flow/archive.png)
 
 
 ## Installation
@@ -417,25 +410,34 @@ footer_sidebar:
   - recentposts  # will be displayed last
   description:
     enabled: true  # default: true
+    coluns: 2  # default: 2 - if you include a list
   categories:
     enabled: true  # default: false
     count: 100  # default: 100
+    columns: 5  # default: 5
   tags:
     enabled: true  # default: false
     count: 100  # default: 100
+    columns: 5  # default: 5
   recentposts:
     enabled: true  # default: true
     count: 10  # default: 10
+    columsn: 2  # default: 2
   custom_content:
     enabled: true
     data: >-
       <h3>EXTRACONTENT</h3>
       <p>not really content though...</p>
+    columns: 2  # default: 2 - if you include a list
   custom_content2:
     enabled: false
     data: "<h3>mhm</h3>"
+    columns: 2  # default: 2 - if you include a list
 ```
 
+
+
+
 ### Table of Contents
 
 Take a look at the [Front Matter](#front-matter) on how to disable the TOC.
@@ -610,9 +612,4 @@ There is no front matter for it.
 
 # whislist
 
-- footer
-  + make the columns in the footer-sidebar (tags, categories, recent posts) configurable
-  + fix for mobile screens
-- post
-  + fix TOC for mobile screens
 - more colors

data/_config.yml

@@ -63,19 +63,9 @@ navigation:
 footer_sidebar:
   arrangement:
   - description
-  - tags
-  - categories
   - recentposts
   description:
     enabled: true
-  categories:
-    enabled: true
-    count: 100
-    columns: 1
-  tags:
-    enabled: true
-    count: 100
-    columns: 3
   recentposts:
     enabled: true
     count: 10

data/_includes/footer.html

@@ -13,19 +13,19 @@
   <aside class="footer_sidebar">
     {% for section in site.footer_sidebar.arrangement %}
       {% if section == 'description' and site.footer_sidebar.description.enabled %}
-        <section class="footer_sitedescription">
+        <section class="footer_sitedescription footer_sitedescription{% if site.footer_sidebar.description.columns and site.footer_sidebar.description.columns >= 1 and site.footer_sidebar.description.columns <= 5 %}{{site.footer_sidebar.description.columns}}{% else %}2{% endif %}">
           {{ site.description }}
         </section>
-      {% elsif section == 'extracontent' and site.footer_sidebar.extracontent.enabled %}
-        <section class="footer_extracontent">
-          {{ site.footer_sidebar.extracontent.data }}
+      {% elsif section == 'customcontent' and site.footer_sidebar.customcontent.enabled %}
+        <section class="footer_customcontent footer_customcontent{% if site.footer_sidebar.customcontent.columns and site.footer_sidebar.customcontent.columns >= 1 and site.footer_sidebar.customcontent.columns <= 5 %}{{site.footer_sidebar.customcontent.columns}}{% else %}2{% endif %}">
+          {{ site.footer_sidebar.customcontent.data }}
         </section>
-      {% elsif section == 'extracontent2' and site.footer_sidebar.extracontent2.enabled %}
-        <section class="footer_extracontent">
-          {{ site.footer_sidebar.extracontent2.data }}
+      {% elsif section == 'customcontent2' and site.footer_sidebar.customcontent2.enabled %}
+        <section class="footer_customcontent2 footer_customcontent2{% if site.footer_sidebar.customcontent2.columns and site.footer_sidebar.customcontent2.columns >= 1 and site.footer_sidebar.customcontent2.columns <= 5 %}{{site.footer_sidebar.customcontent2.columns}}{% else %}2{% endif %}">
+          {{ site.footer_sidebar.customcontent2.data }}
         </section>
       {% elsif section == 'categories' and site.footer_sidebar.categories.enabled %}
-        <section class="footer_categories">
+        <section class="footer_categories footer_categories{% if site.footer_sidebar.categories.columns and site.footer_sidebar.categories.columns >= 1 and site.footer_sidebar.categories.columns <= 5 %}{{site.footer_sidebar.categories.columns}}{% else %}5{% endif %}">
           <h3>Categories</h3>
           <ul>
             {% assign all_categories = "" %}
@@ -46,7 +46,7 @@
           </ul>
         </section>
       {% elsif section == 'tags' and site.footer_sidebar.tags.enabled %}
-        <section class="footer_tags">
+        <section class="footer_tags footer_tags{% if site.footer_sidebar.tags.columns and site.footer_sidebar.tags.columns >= 1 and site.footer_sidebar.tags.columns <= 5 %}{{site.footer_sidebar.tags.columns}}{% else %}5{% endif %}">
           <h3>Tags</h3>
           <ul>
             {% assign all_tags = "" %}
@@ -67,7 +67,7 @@
           </ul>
         </section>
       {% elsif section == 'recentposts' and site.footer_sidebar.recentposts.enabled %}
-        <section class="footer_recentposts">
+        <section class="footer_recentposts footer_recentposts{% if site.footer_sidebar.recentposts.columns and site.footer_sidebar.recentposts.columns >= 1 and site.footer_sidebar.recentposts.columns <= 5 %}{{site.footer_sidebar.recentposts.columns}}{% else %}2{% endif %}">
           <h3>Recent Posts</h3>
           <ul>
             {% assign recentposts_count = site.footer_sidebar.recentposts.count | default: 10 %}
@@ -90,9 +90,9 @@
   <div class="social-icons item3">
     {% for link in site.footer_links %}
       {% if link.icon %}
-        <a href="{{ link.url }}" class="{{ link.icon }}" target="_blank"></a>
+        <a href="{{ site.baseurl }}{{ link.url }}" class="{{ link.icon }}" target="_blank"></a>
       {% else %}
-        <a href="{{ link.url }}">{{ link.title }}</a>
+        <a href="{{ site.baseurl }}{{ link.url }}">{{ link.title }}</a>
       {% endif %}
       {% unless forloop.last %}
         <span class="divider"></span>

data/_layouts/archive.html

@@ -8,7 +8,7 @@ layout: default
 
     {% if site.posts.size > 0 %}
     <!-- show all years -->
-    <div class="archive_all_years{% if site.layouts.archive.columns and site.layouts.archive.columns >= 1 and site.layouts.archive.columns <= 5 %}{{site.layouts.archive.columns}}{% else %}2{% endif %}">
+    <div class="archive_all_years archive_all_years{% if site.layouts.archive.columns and site.layouts.archive.columns >= 1 and site.layouts.archive.columns <= 5 %}{{site.layouts.archive.columns}}{% else %}2{% endif %}">
       <ul>
         {% assign postsByYear = site.posts | group_by_exp: 'post', 'post.date | date: "%Y"' %}
         {% for year in postsByYear %}
@@ -52,16 +52,12 @@ layout: default
 
             <div class="archive_findresults">
 
-              <span class="archive_date">
+             
 
-                <a href="{{ site.baseurl }}{{ post.url }}">
-                  <i class="archive_day">{{ post.date | date: "%d" }}</i>
-                </a>
-                <a href="{{ site.baseurl }}{{ post.url }}">
-                  <span>{{ post.date | date: "%b/%Y" }}</span>
-                </a>
-
-              </span>
+              <a class="archive_date" href="{{ site.baseurl }}{{ post.url }}">
+                <i class="archive_day">{{ post.date | date: "%d" }}</i>
+                <span>{{ post.date | date: "%b/%Y" }}</span>
+              </a>
 
               <span class="archive_summary">
                 <h3>

data/_layouts/categories.html

@@ -17,7 +17,7 @@ layout: default
 
     {% if sortedCategories.size > 0 %}
     <!-- Show all categories sorted by count -->
-    <div class="categories_all{% if site.layouts.categories.columns and site.layouts.categories.columns >= 1 and site.layouts.categories.columns <= 5 %}{{site.layouts.categories.columns}}{% else %}3{% endif %}">
+    <div class="categories_all categories_all{% if site.footer_sidebar.categories.columns and site.footer_sidebar.categories.columns >= 1 and site.footer_sidebar.categories.columns <= 5 %}{{site.footer_sidebar.categories.columns}}{% else %}3{% endif %}">
       <ul>
         {% for category in sortedCategories %}
           {% assign categoryParts = category | split: '&#x1F;' %}
@@ -55,16 +55,10 @@ layout: default
 
           {% for post in category[1] %}
             <div class="categories_findresult">
-              <span class="categories_date">
-
-                <a href="{{ site.baseurl }}{{ post.url }}">
-                  <i class="categories_day">{{ post.date | date: "%d" }}</i>
-                </a>
-                <a href="{{ site.baseurl }}{{ post.url }}">
-                  <span>{{ post.date | date: "%b/%Y" }}</span>
-                </a>
-
-              </span>
+              <a href="{{ site.baseurl }}{{ post.url }}" class="categories_date">
+                <i class="categories_day">{{ post.date | date: "%d" }}</i>
+                <span>{{ post.date | date: "%b/%Y" }}</span>
+              </a>
 
               <span class="categories_summary">
                 <h3>

data/_layouts/home.html

@@ -42,16 +42,17 @@ layout: default
 				</p>
 				
 			</article>
+			<hr class="article-divider">
 		{% endfor %}
 
 		<!-- Pagination links -->
 		<div class="pagination">
 			{% if paginator.previous_page %}
-				<a class="previous" href="{{ site.baseurl}}{{ paginator.previous_page_path }}"><span class="spanprevious"><i class="arrow left" title="previous page"></i></span></a>
+				<a class="previous" href="{{ site.baseurl}}{{ paginator.previous_page_path }}"><span class="spanprevious"><i class="fa fa-arrow-left" title="previous page"></i></span></a>
 			{% endif %}
 				<p class="page_count">{{ paginator.page }} / {{ paginator.total_pages }}</p>
 			{% if paginator.next_page %}
-				<a class="next" href="{{ site.baseurl}}{{ paginator.next_page_path }}"><span class="spannext"><i class="arrow right" title="next page"></i></span></a>
+				<a class="next" href="{{ site.baseurl}}{{ paginator.next_page_path }}"><span class="spannext"><i class="fa fa-arrow-right" title="next page"></i></span></a>
 			{% endif %}
 		</div>
 	</section>

data/_layouts/search.html

@@ -9,7 +9,7 @@ layout: default
   * Copyright 2015-2020, Christian Fei
   * Licensed under the MIT License.
   */
-!function(){"use strict";var f={compile:function(r){return i.template.replace(i.pattern,function(t,e){var n=i.middleware(e,r[e],i.template);return void 0!==n?n:r[e]||t})},setOptions:function(t){i.pattern=t.pattern||i.pattern,i.template=t.template||i.template,"function"==typeof t.middleware&&(i.middleware=t.middleware)}};const i={pattern:/\{(.*?)\}/g,template:"",middleware:function(){}};var n=function(t,e){var n=e.length,r=t.length;if(n<r)return!1;if(r===n)return t===e;t:for(var i=0,o=0;i<r;i++){for(var u=t.charCodeAt(i);o<n;)if(e.charCodeAt(o++)===u)continue t;return!1}return!0},e=new function(){this.matches=function(t,e){return n(e.toLowerCase(),t.toLowerCase())}},r=new function(){this.matches=function(e,t){return!!e&&(e=e.trim().toLowerCase(),(t=t.trim().toLowerCase()).split(" ").filter(function(t){return 0<=e.indexOf(t)}).length===t.split(" ").length)}},d={put:function(t){if(l(t))return a(t);if(function(t){return Boolean(t)&&"[object Array]"===Object.prototype.toString.call(t)}(t))return function(n){const r=[];s();for(let t=0,e=n.length;t<e;t++)l(n[t])&&r.push(a(n[t]));return r}(t);return undefined},clear:s,search:function(t){return t?function(e,n,r,i){const o=[];for(let t=0;t<e.length&&o.length<i.limit;t++){var u=function(t,e,n,r){for(const i in t)if(!function(n,r){for(let t=0,e=r.length;t<e;t++){var i=r[t];if(new RegExp(i).test(n))return!0}return!1}(t[i],r.exclude)&&n.matches(t[i],e))return t}(e[t],n,r,i);u&&o.push(u)}return o}(u,t,c.searchStrategy,c).sort(c.sort):[]},setOptions:function(t){c=t||{},c.fuzzy=t.fuzzy||!1,c.limit=t.limit||10,c.searchStrategy=t.fuzzy?e:r,c.sort=t.sort||o,c.exclude=t.exclude||[]}};function o(){return 0}const u=[];let c={};function s(){return u.length=0,u}function l(t){return Boolean(t)&&"[object Object]"===Object.prototype.toString.call(t)}function a(t){return u.push(t),u}c.fuzzy=!1,c.limit=10,c.searchStrategy=c.fuzzy?e:r,c.sort=o,c.exclude=[];var p={load:function(t,e){const n=window.XMLHttpRequest?new window.XMLHttpRequest:new ActiveXObject("Microsoft.XMLHTTP");n.open("GET",t,!0),n.onreadystatechange=h(n,e),n.send()}};function h(e,n){return function(){if(4===e.readyState&&200===e.status)try{n(null,JSON.parse(e.responseText))}catch(t){n(t,null)}}}var m=function y(t){if(!(e=t)||!("undefined"!=typeof e.required&&e.required instanceof Array))throw new Error("-- OptionsValidator: required options missing");var e;if(!(this instanceof y))return new y(t);const r=t.required;this.getRequiredOptions=function(){return r},this.validate=function(e){const n=[];return r.forEach(function(t){"undefined"==typeof e[t]&&n.push(t)}),n}},w={merge:function(t,e){const n={};for(const r in t)n[r]=t[r],"undefined"!=typeof e[r]&&(n[r]=e[r]);return n},isJSON:function(t){try{return t instanceof Object&&JSON.parse(JSON.stringify(t))?!0:!1}catch(e){return!1}}};!function(t){let i={searchInput:null,resultsContainer:null,json:[],success:Function.prototype,searchResultTemplate:'<div class="single_result"><div class="search_findresults"><span class="search_date"><a href="{url}"><i class="search_day">{date_day}</i></a><a href="{url}">{date_my}</a></span><span class="search_summary"><h3><a href="{url}">{title}</a></h3>{summary}</span></div></div>',templateMiddleware:Function.prototype,sortMiddleware:function(){return 0},noResultsText:"No results found",limit:10,fuzzy:!1,debounceTime:null,exclude:[]},n;const e=function(t,e){e?(clearTimeout(n),n=setTimeout(t,e)):t.call()};var r=["searchInput","resultsContainer","json"];const o=m({required:r});function u(t){d.put(t),i.searchInput.addEventListener("input",function(t){-1===[13,16,20,37,38,39,40,91].indexOf(t.which)&&(c(),e(function(){l(t.target.value)},i.debounceTime))})}function c(){i.resultsContainer.innerHTML=""}function s(t){i.resultsContainer.innerHTML+=t}function l(t){var e;(e=t)&&0<e.length&&(c(),function(e,n){var r=e.length;if(0===r)return s(i.noResultsText);for(let t=0;t<r;t++)e[t].query=n,s(f.compile(e[t]))}(d.search(t),t))}function a(t){throw new Error("SimpleJekyllSearch --- "+t)}t.SimpleJekyllSearch=function(t){var n;0<o.validate(t).length&&a("You must specify the following required options: "+r),i=w.merge(i,t),f.setOptions({template:i.searchResultTemplate,middleware:i.templateMiddleware}),d.setOptions({fuzzy:i.fuzzy,limit:i.limit,sort:i.sortMiddleware,exclude:i.exclude}),w.isJSON(i.json)?u(i.json):(n=i.json,p.load(n,function(t,e){t&&a("failed to get JSON ("+n+")"),u(e)}));t={search:l};return"function"==typeof i.success&&i.success.call(t),t}}(window)}();
+!function(){"use strict";var f={compile:function(r){return i.template.replace(i.pattern,function(t,e){var n=i.middleware(e,r[e],i.template);return void 0!==n?n:r[e]||t})},setOptions:function(t){i.pattern=t.pattern||i.pattern,i.template=t.template||i.template,"function"==typeof t.middleware&&(i.middleware=t.middleware)}};const i={pattern:/\{(.*?)\}/g,template:"",middleware:function(){}};var n=function(t,e){var n=e.length,r=t.length;if(n<r)return!1;if(r===n)return t===e;t:for(var i=0,o=0;i<r;i++){for(var u=t.charCodeAt(i);o<n;)if(e.charCodeAt(o++)===u)continue t;return!1}return!0},e=new function(){this.matches=function(t,e){return n(e.toLowerCase(),t.toLowerCase())}},r=new function(){this.matches=function(e,t){return!!e&&(e=e.trim().toLowerCase(),(t=t.trim().toLowerCase()).split(" ").filter(function(t){return 0<=e.indexOf(t)}).length===t.split(" ").length)}},d={put:function(t){if(l(t))return a(t);if(function(t){return Boolean(t)&&"[object Array]"===Object.prototype.toString.call(t)}(t))return function(n){const r=[];s();for(let t=0,e=n.length;t<e;t++)l(n[t])&&r.push(a(n[t]));return r}(t);return undefined},clear:s,search:function(t){return t?function(e,n,r,i){const o=[];for(let t=0;t<e.length&&o.length<i.limit;t++){var u=function(t,e,n,r){for(const i in t)if(!function(n,r){for(let t=0,e=r.length;t<e;t++){var i=r[t];if(new RegExp(i).test(n))return!0}return!1}(t[i],r.exclude)&&n.matches(t[i],e))return t}(e[t],n,r,i);u&&o.push(u)}return o}(u,t,c.searchStrategy,c).sort(c.sort):[]},setOptions:function(t){c=t||{},c.fuzzy=t.fuzzy||!1,c.limit=t.limit||10,c.searchStrategy=t.fuzzy?e:r,c.sort=t.sort||o,c.exclude=t.exclude||[]}};function o(){return 0}const u=[];let c={};function s(){return u.length=0,u}function l(t){return Boolean(t)&&"[object Object]"===Object.prototype.toString.call(t)}function a(t){return u.push(t),u}c.fuzzy=!1,c.limit=10,c.searchStrategy=c.fuzzy?e:r,c.sort=o,c.exclude=[];var p={load:function(t,e){const n=window.XMLHttpRequest?new window.XMLHttpRequest:new ActiveXObject("Microsoft.XMLHTTP");n.open("GET",t,!0),n.onreadystatechange=h(n,e),n.send()}};function h(e,n){return function(){if(4===e.readyState&&200===e.status)try{n(null,JSON.parse(e.responseText))}catch(t){n(t,null)}}}var m=function y(t){if(!(e=t)||!("undefined"!=typeof e.required&&e.required instanceof Array))throw new Error("-- OptionsValidator: required options missing");var e;if(!(this instanceof y))return new y(t);const r=t.required;this.getRequiredOptions=function(){return r},this.validate=function(e){const n=[];return r.forEach(function(t){"undefined"==typeof e[t]&&n.push(t)}),n}},w={merge:function(t,e){const n={};for(const r in t)n[r]=t[r],"undefined"!=typeof e[r]&&(n[r]=e[r]);return n},isJSON:function(t){try{return t instanceof Object&&JSON.parse(JSON.stringify(t))?!0:!1}catch(e){return!1}}};!function(t){let i={searchInput:null,resultsContainer:null,json:[],success:Function.prototype,searchResultTemplate:'<div class="single_result"><div class="search_findresults"><a href="{url}" class="search_date"><i class="search_day">{date_day}</i>{date_my}</a><span class="search_summary"><h3><a href="{url}">{title}</a></h3>{summary}</span></div></div>',templateMiddleware:Function.prototype,sortMiddleware:function(){return 0},noResultsText:"No results found",limit:10,fuzzy:!1,debounceTime:null,exclude:[]},n;const e=function(t,e){e?(clearTimeout(n),n=setTimeout(t,e)):t.call()};var r=["searchInput","resultsContainer","json"];const o=m({required:r});function u(t){d.put(t),i.searchInput.addEventListener("input",function(t){-1===[13,16,20,37,38,39,40,91].indexOf(t.which)&&(c(),e(function(){l(t.target.value)},i.debounceTime))})}function c(){i.resultsContainer.innerHTML=""}function s(t){i.resultsContainer.innerHTML+=t}function l(t){var e;(e=t)&&0<e.length&&(c(),function(e,n){var r=e.length;if(0===r)return s(i.noResultsText);for(let t=0;t<r;t++)e[t].query=n,s(f.compile(e[t]))}(d.search(t),t))}function a(t){throw new Error("SimpleJekyllSearch --- "+t)}t.SimpleJekyllSearch=function(t){var n;0<o.validate(t).length&&a("You must specify the following required options: "+r),i=w.merge(i,t),f.setOptions({template:i.searchResultTemplate,middleware:i.templateMiddleware}),d.setOptions({fuzzy:i.fuzzy,limit:i.limit,sort:i.sortMiddleware,exclude:i.exclude}),w.isJSON(i.json)?u(i.json):(n=i.json,p.load(n,function(t,e){t&&a("failed to get JSON ("+n+")"),u(e)}));t={search:l};return"function"==typeof i.success&&i.success.call(t),t}}(window)}();
 </script>
 
 

data/_layouts/tags.html

@@ -17,7 +17,7 @@ layout: default
 
     {% if sortedTags.size > 0 %}
     <!-- Show all tags sorted by count -->
-    <div class="tags_all{% if site.layouts.tags.columns and site.layouts.tags.columns >= 1 and site.layouts.tags.columns <= 5 %}{{site.layouts.tags.columns}}{% else %}4{% endif %}">
+    <div class="tags_all tags_all{% if site.layouts.tags.columns and site.layouts.tags.columns >= 1 and site.layouts.tags.columns <= 5 %}{{site.layouts.tags.columns}}{% else %}4{% endif %}">
       <ul>
         {% for tag in sortedTags %}
           {% assign tagParts = tag | split: '&#x1F;' %}
@@ -53,14 +53,11 @@ layout: default
 
           {% for post in tag[1] %}
             <div class="tags_findresult">
-              <span class="tags_date">
-                <a href="{{ site.baseurl }}{{ post.url }}">
-                  <i class="tags_day">{{ post.date | date: "%d" }}</i>
-                </a>
-                <a href="{{ site.baseurl }}{{ post.url }}">
-                  <span>{{ post.date | date: "%b/%Y" }}</span>
-                </a>
-              </span>
+
+              <a href="{{ site.baseurl }}{{ post.url }}" class="tags_date">
+                <i class="tags_day">{{ post.date | date: "%d" }}</i>
+                <span>{{ post.date | date: "%b/%Y" }}</span>
+              </a>
 
               <span class="tags_summary">
                 <h3>

data/_posts/2022-12-12-chatgpt-testpost-all-markdown-elements.md

@@ -1,6 +1,6 @@
 ---
 layout: post
-title: "Chatgpt Testpost all markdown elements"
+title: "Supercalifragilisticexpialidocious: A Comprehensive Guide to the Longest Word in the English Language"
 date: 2022-12-12
 tags: champion test
 subtitle: "testing can be fun"

data/_sass/default/_base.scss

@@ -6,7 +6,6 @@
 
 html {
   height: 100%;
-  //overflow-x: hidden;
 }
 
 body {
@@ -14,18 +13,46 @@ body {
   width: 100%;
   position: relative;
   margin: 0;
-  display: flex;
-  flex-direction: column;
   background-color: $background-color;
   overflow-x: hidden;
+  display: flex;
+  flex-direction: column;
+  word-break: break-word;
 }
 
-img {
-  max-width: 100%;
-  height: auto;
+header {
+  position: fixed;
+  margin: auto;
+  top: 0;
+  left: 0;
+  right: 0;
+  width: 100%;
+  font-size: 1.1em;
+  z-index: 100;
 }
 
 main {
   max-width: 70%;
   margin: 5rem auto;
+  flex: 1;
+}
+
+
+footer {
+  width: 100%;
+  color: $background-color;
+  margin-top: 4em;
+  flex-shrink: 0;
+}
+
+
+// @media (width >= $small) and (max-width: $large) 
+@media screen and (max-width: $large) {
+  body {
+      font-size: 2.5em;
+  }
+
+  main {
+    margin-top: 8rem;
+  }
 }

data/_sass/default/_footer.scss

@@ -1,20 +1,9 @@
-footer {
-  width: 100%;
-  color: $background-color;
-  font-size: 0.8em;
-  margin-top: auto;
-}
-
 footer ul {
   list-style-type: none;
   margin: 0;
   padding: 0;
 }
 
-footer ul li {
-  padding-bottom: 0.2em;
-}
-
 footer a {
   @include links($background-color);
   padding: 0;
@@ -53,6 +42,7 @@ footer .social-icons .divider::before {
   font-size: 0.8em;
 }
 
+
 /* ---------------------------------------------------- */
 /* ---------------------------------------------------- */
 /* footer sidebar */
@@ -111,52 +101,92 @@ footer aside section:first-child {
   padding: 0;
 }
 
+.footer_sitedescription1, 
+.footer_customcontent1, 
+.footer_customcontent21, 
+.footer_recentposts1, 
+.footer_categories1, 
+.footer_tags1 {
+  @include footer_elements(1);
+}
 
+.footer_sitedescription2, 
+.footer_customcontent2, 
+.footer_customcontent22, 
+.footer_recentposts2, 
+.footer_categories2, 
+.footer_tags2 {
+  @include footer_elements(2);
+}
 
-.footer_categories, .footer_tags {
-  ul {
-    list-style: none;
-    padding: 0;
-    margin: 0;
-    columns: 5;
-  }
-
-  a {
-    text-decoration: none;
-    color: $background-color;
-    letter-spacing: -1px;
-    width: 100%;
-    cursor: pointer;
-  }
+.footer_sitedescription3, 
+.footer_customcontent3, 
+.footer_customcontent23, 
+.footer_recentposts3, 
+.footer_categories3, 
+.footer_tags3 {
+  @include footer_elements(3);
 }
 
-.footer_categories1, .footer_tags1, .footer_tags, .footer_recentposts1  {
+.footer_sitedescription4, 
+.footer_customcontent4, 
+.footer_customcontent24, 
+.footer_recentposts4, 
+.footer_categories4, 
+.footer_tags4 {
+  @include footer_elements(4);
+}
 
+.footer_sitedescription5, 
+.footer_customcontent5, 
+.footer_customcontent25, 
+.footer_recentposts5, 
+.footer_categories5, 
+.footer_tags5 {
+  @include footer_elements(5);
 }
 
-.footer_recentposts {
-  ul {
-    list-style: none;
-    padding: 0;
-    margin: 0;
-    columns: 2;
+
+
+@media (width >= $small) and (max-width: $large) {
+  footer {
+    font-size: 1.5em;
   }
 
-  a {
-    text-decoration: none;
-    color: $background-color;
-    letter-spacing: -1px;
-    width: 100%;
-    cursor: pointer;
+  footer .social-icons {
+    flex-wrap: wrap; /* Allow the icons to wrap to the next line */
+  }
+
+  footer .social-icons > * {
+    margin: 0.5em 0.5em; /* Adjust the margin as needed */
+  }
+
+  footer aside  {
+    flex-direction: column;
+  }
+
+  footer li {
+      width: 100%;
+    }
+
+  .footer_sitedescription, .footer_customcontent, .footer_customcontent2, .footer_recentposts, .footer_categories, .footer_tags {
+    ul li {
+      width: 100%;
+    }
   }
-}
 
-.footer_sitedescription, .footer_extracontent {
-    a {
-    text-decoration: none;
-    color: $background-color;
-    letter-spacing: -1px;
-    width: 100%;
-    cursor: pointer;
+  footer aside section:first-child:nth-last-child(1),
+  footer aside section:first-child:nth-last-child(2),
+  footer aside section:first-child:nth-last-child(2) ~ section,
+  footer aside section:first-child:nth-last-child(3),
+  footer aside section:first-child:nth-last-child(3) ~ section,
+  footer aside section:first-child:nth-last-child(4),
+  footer aside section:first-child:nth-last-child(4) ~ section,
+  footer aside section:first-child:nth-last-child(5),
+  footer aside section:first-child:nth-last-child(5) ~ section,
+  footer aside section:first-child {
+    padding: 0 0 0 1em;
+    flex-grow: 1;
+    max-width: 100%;
   }
 }

data/_sass/default/_header.scss

@@ -1,15 +1,3 @@
-header {
-  position: fixed;
-  margin: auto;
-  top: 0;
-  left: 0;
-  right: 0;
-  width: 100%;
-  font-size: 1.1em;
-  z-index: 100;
-}
-
-
 header nav {
 	background-color: $primary-color;
 	width: fit-content;
@@ -60,3 +48,9 @@ nav li a {
 	margin: 0;
 	padding: 0;
 }
+
+@media (width >= $small) and (max-width: $large) {
+	header {
+		font-size: 1em;
+	}
+}

data/_sass/external/_normalize.scss

@@ -145,7 +145,10 @@ sup {
  * Remove the border on images inside links in IE 10.
  */
 
+
 img {
+  max-width: 100%;
+  height: auto;
   border-style: none;
 }
 

data/_sass/functions/_mixins.scss

@@ -36,7 +36,7 @@
     text-shadow: 0px 2px 4px rgba(100,100,100,0.5);
     color: $primary-color;
     font-family: Inter;
-    font-size: 36px;
+    font-size: 3em;
     font-weight: 700;
     text-align: center;
     margin-top: 0;
@@ -70,6 +70,13 @@
         text-decoration: none;
         font-weight: bold;
     }
+
+    @media screen and (max-width: $large) {
+        font-size: 1em;
+        flex-wrap: wrap;
+    }
+
+
 }
 
 @mixin findresults_day() {
@@ -90,8 +97,17 @@
     display: flex;
     flex-direction: column;
     align-items: center;
-    gap: -5px;
+    // gap: -5px;
     margin: auto;
+    min-width: 6em;
+
+    @media screen and (max-width: $large) {
+        border: 1px solid black;
+        background-color: $secondary-color;
+        border-radius: 500px;
+        padding: 1em;
+    }
+
 }
 
 @mixin findresults_summary() {
@@ -101,6 +117,12 @@
     a:hover {
         @include hover();
     }
+
+    @media screen and (max-width: $large) {
+        margin-top: 1em;
+        padding-bottom: 3em;
+        border-bottom: 1px dotted $primary-color;
+    }
 }
 
 @mixin showlinks($rows: 4) {
@@ -108,11 +130,11 @@
         content: "";
         display: block;
         border-top: 1px solid $secondary-color;
-        margin-left: -100vw;
-        margin-right: -100vw;
-        margin-bottom: 4em;
-        margin-top: 4em;
-        width: 200vw; //only working with overflow-x: hidden; in body in _base.scss
+        width: 98vw;
+        height: 0px;
+        margin: 4em 0;
+        position: relative;
+        left: -20%;
     }
 
     ul {
@@ -189,4 +211,69 @@
             }
         }
     }
+}
+
+
+@mixin footer_elements($rows: 5) {
+    ul {
+        list-style: none;
+        padding: 0;
+        margin: 0;
+        display: flex;
+        flex-wrap: wrap;
+        row-gap: 0;
+        column-gap: 0;
+
+        // Each item takes half of the container width minus the gap
+        @if $rows == 1 {
+            li {
+                width: calc(100% - 1rem);
+            }
+        } @else if $rows == 2 {
+            li {
+                width: calc(50% - 1rem);
+            }
+        } @else if $rows == 3 {
+            li {
+                width: calc(33.33% - 1rem);
+            }
+        } @else if $rows == 4 {
+            li {
+                width: calc(25% - 1rem);
+            }
+        } @else if $rows == 5 {
+            li {
+                width: calc(20% - 1rem);
+            }
+        }
+
+        li {
+            display: flex;
+            justify-content: space-between;
+            align-items: left;
+            cursor: pointer;
+            overflow-wrap: break-word;
+
+            a {
+                text-decoration: none;
+                color: $background-color;
+                text-transform: lowercase;
+                letter-spacing: -1px;
+                width: 100%;
+                display: flex;
+                justify-content: space-between;
+                padding: 0.5em;
+                text-align: left;
+                border: 1px solid rgba(0, 0, 0, 0.1);
+
+                &:hover {
+                    @include hover();
+                }
+            }
+
+            .archive_linktitle {
+                flex: 1;
+            }
+        }
+    }
 }

data/_sass/functions/_values.scss

@@ -4,6 +4,8 @@ $medium: 768px !default;
 $large: 1024px !default;
 $xlarge: 1280px !default;
 
+// @media only screen and (max-width: $small)
+
 $darker: #060606;
 $dark: #404040;
 $mid: #9c9b9b;

data/_sass/layouts/_archive.scss

@@ -13,10 +13,6 @@
 /* ---------------------------------------------------- */
 
 
-.archive_all_years {
-	@include showlinks(2);
-}
-
 .archive_all_years1 {
 	@include showlinks(1);
 }
@@ -33,8 +29,10 @@
 	@include showlinks(4);
 }
 
-.archive_all_years5 {
-	@include showlinks(5);
+@media screen and (max-width: $large) {
+.archive_all_years {
+	@include showlinks(1);
+	}
 }
 
 /* ---------------------------------------------------- */

data/_sass/layouts/_categories.scss

@@ -13,10 +13,6 @@
 /* ---------------------------------------------------- */
 
 
-.categories_all {
-	@include showlinks(3);
-}
-
 .categories_all1 {
 	@include showlinks(1);
 }
@@ -37,6 +33,11 @@
 	@include showlinks(5);
 }
 
+@media screen and (max-width: $large) {
+	.categories_all {
+		@include showlinks(1);
+	}
+}
 
 /* ---------------------------------------------------- */
 /* ---------------------------------------------------- */

data/_sass/layouts/_home.scss

@@ -9,21 +9,21 @@
 /* ---------------------------------------------------- */
 // Supplements = Date + Tags
 
-.single_article {
-	&::after {
-		content: "";
-		display: block;
+#home {
+	.article-divider {
+		width: 98vw;
+		height: 0px;
 		border-top: 1px dashed $secondary-color;
-		margin-left: -100vw;
-		margin-right: -100vw;
-		margin-bottom: 4em; //same as .single_article .summary
-		width: 200vw; //only working with overflow-x: hidden; in body in _base.scss
+		margin: 4em 0;
+		position: relative;
+		left: -20%;
 	}
+}
 
-
+.single_article {
 	h3 {
 		//font-family: Inter;
-		font-size: 36px;
+		font-size: 2em;
 		font-weight: 700;
 		letter-spacing: 2px;
 		margin: 0;
@@ -49,7 +49,6 @@
 
 	.summary {
 		margin-top: 2em;
-		margin-bottom: 4em;
 	}
 
 	.supplements-sep::before {
@@ -68,6 +67,11 @@
 .pagination {
 	display: flex;
 	justify-content: space-between;
+	color: $primary-color;
+
+	a {
+		color: $primary-color;
+	}
 
 
 	.page_count {
@@ -75,21 +79,14 @@
 	}
 
 	.spannext {
-		padding-right: 15px;
-		padding-left: 12px;
-		border: 1px solid black;
-		padding-top: 0;
-		padding-bottom: 5px;
+		padding: 5px 15px;
+		border: 1px solid $primary-color;
 		height: 1em;
-		position: relative;
 	}
 
 	.spanprevious {
-		padding-right: 12px;
-		padding-left: 15px;
-		border: 1px solid black;
-		padding-top: 0;
-		padding-bottom: 5px;
+		padding: 5px 15px;
+		border: 1px solid $primary-color;
 		height: 1em;
 	}
 
@@ -100,21 +97,4 @@
 	.previous {
 		float: left;
 	}
-
-	.arrow {
-	  border: solid $primary-color;
-	  border-width: 0 3px 3px 0;
-	  display: inline-block;
-	  padding: 3px;
-	}
-
-	.right {
-	  transform: rotate(-45deg);
-	  -webkit-transform: rotate(-45deg);
-	}
-
-	.left {
-	  transform: rotate(135deg);
-	  -webkit-transform: rotate(135deg);
-	}
 }

data/_sass/layouts/_post.scss

@@ -26,6 +26,7 @@
 		margin-top: 3em;
 		background-color: $background-color;
 		margin-left: calc(-1em + 5px);; // 14px*2 padding - 5px border
+		overflow-wrap: break-word;
 	}
 
 
@@ -167,7 +168,6 @@
 /* ---------------------------------------------------- */
 /* ---------------------------------------------------- */
 
-
 article {
 	position: relative;
 }
@@ -192,7 +192,7 @@ article {
 	position: fixed;
 	bottom: 0;
 	right: 0;
-	padding: 16px;
+	padding: 1rem; /* Adjust padding as needed */
 	z-index: 1;
 }
 
@@ -200,11 +200,10 @@ article {
 	display: block;
 	border: 1px solid $primary-color;
 	position: fixed;
-	top: 1em;
-	right: 1em;
-	bottom: 1em;
+	top: 3vw; /* Adjust top, right, bottom, and left as needed */
+	right: 3vw;
 	min-width: 10vw;
-	max-width: 30vw;
+	max-width: 40vw;
 	background-color: $background-color;
 	z-index: 1;
 	overflow-x: hidden;
@@ -212,30 +211,32 @@ article {
 	max-height: 80vh;
 
 	h1 {
-		text-shadow: 0px 2px 4px rgba(100,100,100,0.5);
+		text-shadow: 0px 0.1em 0.2em rgba(100, 100, 100, 0.5); /* Adjust text-shadow as needed */
 		color: $primary-color;
 		font-size: 2em;
 		font-weight: bold;
-		letter-spacing: 20px;
+		letter-spacing: 1rem; /* Adjust letter-spacing as needed */
 		text-align: center;
 	}
 
 	ul {
 		list-style: none;
+		padding-left: 24px; /* Remove default list padding */
 	}
 
-	li a{
+	li a {
 		border-bottom: 1px dashed $secondary-color;
 		opacity: 0.8;
 		width: 80%;
 		display: block;
+		margin: 1rem auto; /* Adjust margin as needed */
 	}
 
 	a {
 		text-decoration: none;
 		color: $secondary-color;
 		font-size: 1em;
-		line-height: 1.5em;
+		line-height: 1.5;
 	}
 
 	a:hover {
@@ -244,6 +245,38 @@ article {
 }
 
 
+@media screen and (max-width: $large) {
+  #tocMenuButtonLabel {
+    font-size: 1.5em;
+    padding: 0.5rem;
+  }
+
+  #tocMenuButton:checked ~ #tocContainer {
+    max-width: 80vw;
+    height: 80vh;
+    top: 10vw;
+    left: 10vw;
+    font-size: 1.5em;
+
+    h1 {
+      font-size: 1.5em;
+      letter-spacing: 0.5rem;
+    }
+
+    ul {
+      margin: 0;
+    }
+
+    li a {
+      margin: 0.5rem auto;
+    }
+  }
+}
+
+
+
+
+
 /* ---------------------------------------------------- */
 /* ---------------------------------------------------- */
 /* header layout */
@@ -252,14 +285,14 @@ article {
 
 
 .post_header::after {
-	content: "";
-	display: block;
-	border-top: 1px solid $secondary-color;
-	margin-left: -100vw;
-	margin-right: -100vw;
-	margin-bottom: 4em;
-	margin-top: 4em;
-	width: 200vw; //only working with overflow-x: hidden; in body in _base.scss
+    content: "";
+    display: block;
+    border-top: 1px solid $secondary-color;
+    width: 98vw;
+    height: 0px;
+    margin: 4em 0;
+    position: relative;
+    left: -20%;
 }
 
 #post article {
@@ -300,6 +333,7 @@ article {
 		.supplements a {
 			/* Set links to display as block-level elements so capitalize works*/
 			display: inline-block;
+			word-break: break-all;
 			&:hover {
 				@include hover();
 			}

data/_sass/layouts/_tags.scss

@@ -37,6 +37,11 @@
     @include showlinks(5);
 }
 
+@media screen and (max-width: $large) {
+.tags_all {
+    @include showlinks(1);
+}
+}
 
 
 /* ---------------------------------------------------- */

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: jekyll-theme-horizon-flow
 version: !ruby/object:Gem::Version
-  version: 1.0.2
+  version: 1.0.3
 platform: ruby
 authors:
 - Markus Schiller
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2023-09-13 00:00:00.000000000 Z
+date: 2023-09-14 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -175,8 +175,9 @@ requirements: []
 rubygems_version: 3.3.5
 signing_key: 
 specification_version: 4
-summary: '"Horizon-Flow" is a minimalist Jekyll theme characterized by a serene color
-  palette of blue, gray, and orange. It features a clean, sidebar-free layout, keeping
-  all content in a single, flowing main container. The header remains fixed even while
-  scrolling, ensuring easy navigation.'
+summary: '"Horizon-Flow" is a mobile friendly Jekyll theme characterized by a serene
+  color palette of blue, gray, and orange. It features a clean, sidebar-free layout,
+  keeping all content in a single, flowing main container. The header remains fixed
+  even while scrolling, ensuring easy navigation. Allows Custom content to be displaye
+  in the footer and footer-sidebar.'
 test_files: []