classic-jekyll-theme 1.8.4 → 1.9.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 667f087979bb4416150d30b4f023f13d6e03966d
-  data.tar.gz: a8337cd4b8c4ab90cbb973f0d3dd95f4072f0689
+  metadata.gz: 50c96a1ef3329dd06e283d37c5fd093b648451aa
+  data.tar.gz: da7dfb274d2c4d6810c65732e566083faca60e30
 SHA512:
-  metadata.gz: cdc8ebd8ca664e5975ac2ef08eae06904efbe33684ec1ffc33b30ed981452c6ea78f013cf5a5a57497e132c9372e6f317f55ddd30c2adf165425b99e55b34947
-  data.tar.gz: 5bc4034e5c702f4476726d9abfee90bf123dcb1dac17d44311c01164c2fdd40f7727c90f58aeb6c9a62ed48fcf396d9a3d966451c4f2d45a1b859a2f046eaa76
+  metadata.gz: 876ae805d23ed754fbb3ba5bfdeccb99501c760089ffa1ce992e830f7914212977619119d93ef39bdd636bf1d457004b54cf8388dc30c361eed9d8694a80ee7e
+  data.tar.gz: af4fc2633d6280da070a007106f7cbba1f881037198365a4bd85a503cfbea169d2413330095834db2babc1e5aa553d088f2a817b2aca1d7b71a0fbbd2706b661

data/README.md

@@ -1,4 +1,4 @@
-# Classic-Jekyll-Theme v1.8.3
+# Classic-Jekyll-Theme v1.9.0
 
 Welcome to Classic-Jekyll-Theme. This theme centers around one of the most used website structures on the web. A banner, navigation menu (dropdown), (up to) three columns and a footer. The design is fully responsive for three different screen widths: wide, medium and narrow. It is probably best shown in an example:
 
@@ -58,6 +58,7 @@ Other features:
 
 - __Move banner/menu to main column__ The banner & navigation can be moved to within the main column only. The secondary and tertiary columns will ten run right up to the top of the screen.
 
+- __Split files for the menu's__ It is possible to generate the menu file separate from the content file. While this may slow down the loading of the site a little, it is a huge speed up for site generation under Jekyll.
 
 You can download it from [github](https://github.com/Balancingrock/classic-jekyll-theme) or install it with [rubygems](https://rubygems.org/gems/classic-jekyll-theme).
 
@@ -100,11 +101,11 @@ Delete the file `about.md`:
 
 It is possible to start the jekyll server now:
 
-	$ jekyll serve
+	$ bundle exec jekyll serve
 	
 Then the site will show up at `localhost:4000`.
 
-To add sample content that illustrates how pages and categories are implemented, copy the folder `pages` from the gem to the current project. 
+To add sample content that illustrates how pages and categories are implemented, copy the folder `pages` from the gem to the current project. To use the 'separate navbanner file' feature, also copy the `navbanner.md` from the gem to the project.
 
 ## Configuration
 
@@ -149,6 +150,16 @@ The following values are configurable:
  
 	`yes` to enable the cookies warning, `no` to disable. The cookies warning is from [Silktide](http://silktide.com/cookieconsent), distributed under the MIT license.
 
+- navbanner-position:
+
+	`top`: The navigation banner will be placed over the entire site (all columns)
+	`main`: The navigation banner will be placed at the top of the main column. Possibly next to or in between the secondary and tertiary columns.
+
+- useSeparateNavBanner:
+
+	`yes`: Use a separate file for the navigation banner. This may cause a slight performance hit for browsers, but is a huge performance enhancement for the site generation process. Note that this option necessitates a JQuery library. By default the google JQuery library is loaded. Update the `_includes/head.html` if a different JQuery library should be used or if the library should be upgraded.
+	`no`: Generate the navigation banner in-line into the posts and pages.
+
 ### text-for.yml
 
 Some of the text elements in the theme can be translated with the following definitions:
@@ -185,16 +196,17 @@ Some of the text elements in the theme can be translated with the following defi
 
 Typically you will need to copy some files from the gem iteself to the project (web site) directory. The most common files are:
 
-- `_sass/classic-jekyll-theme.scss` for configuration
-- `_sass/classic/_normalize-override.scss` if site wide updates must be made to `_normalize.scss`
-- `_data/setup.yml` for configuration
-- `_data/text-for.yml` for configuration
-- `_includes/secondary-column.html` for the secondary column contents
-- `_includes/tertiary-column.html` for the tertiary column contents
+- `_sass/classic-jekyll-theme.scss` for configuration.
+- `_sass/classic/_normalize-override.scss` if site wide updates must be made to `_normalize.scss`.
+- `_data/setup.yml` for configuration.
+- `_data/text-for.yml` for configuration.
+- `_includes/secondary-column.html` for the secondary column contents.
+- `_includes/tertiary-column.html` for the tertiary column contents.
+- `navbanner.md` for the navigation bar menu. This is mandatory if the `useSeparateNavBanner` setting is used, optional when not. Hence its easier to always copy this file.
 
 These files can be found in the gem directory. On macOS this directory is located at: `Library/Ruby/Gems/<version>/gems/classic-jekyll-theme-<version>`. When you copy these files, make sure they are in the same relative directory as in the gem itself.
 
-Besides the above mentioned files you should avoid making changes to the files provided in the gem. The more changes you make, the more difficult it will become to upgrade. Instead of chaning a file, include a new file that contains the stuff you want and include that file.
+Besides the above mentioned files you should avoid making changes to the files provided in the gem. The more changes you make, the more difficult it will become to upgrade. Instead of changing a file, include a new file that contains the stuff you want and include that file.
 
 For example, if you need to add to the SASS files, create a new file and include that at the end of `_sass/classic-jekyll-theme.scss`.
 
@@ -396,6 +408,11 @@ Release 1.8.3
 
 - Bugfix: corrected a liquid error in `/_layout/default.html`
 
+Release 1.9.0
+
+- Bugfix: Fixed the sometimes horizontal scrollbar bug
+- Feature: Added option to generate a separately loaded navbanner file.
+
 ## Upgrade information
 
 ### from 0.2.6 to 1.0.0
@@ -599,6 +616,23 @@ The index for a menu item. If not present, the menu ordering is undetermined. If
 - The configuration file `_config.yml` updated to Jekyll 3.5 standard
 - Updated the file `_layouts/default.html` again (3rd line)
 
+### from 1.8.4 to 1.9.0
+
+- The setup file in `_data/setup.yml` (added option to enable/disable separate navbanner file generation)
+- The following files have been updated or added:
+
+~~~~
+	_data/setup.yml
+	_includes/head.html
+	_includes/navbanner.html
+	_layouts/default.html
+	_layouts/navbanner-layout.html
+	_sass/classic/_formatting.scss
+	navbanner.md
+~~~~
+
+- To use the separate navbanner file, copy the "navbanner.md" file from the theme folder to the project folder (at the same relative level)
+
 ## Feedback
 
 Comments, bug reports, feature requests and improvements are eagerly anticipated via email: rien@balancingrock.nl.

data/_data/setup.yml

@@ -54,4 +54,14 @@ enable-cookies-policy: yes
 #
 navbanner-position: top
 
+# Create a separate file containing the Navigation & Banner
+# Values: yes | no
+#
+# Using a separate navbanner file will speed up jekyll compilation a lot. However it also means that the browser has to make two additional fetches: the navbanner file and the JQuery library (the later from google). However this is mitigated by the fact that both files can be cached by the browser.
+# If another JQuery library has to be used, edit the _includes/head.html file accordingly.
+#
+# Note: If this option is set to 'yes', then make sure the file 'navbanner.md' is present (can be found in the theme folder) in the same project folder as the index.md file.
+
+use-separate-navbanner: yes
+
 # End of file

data/_includes/head.html

@@ -12,6 +12,11 @@
   <link rel="canonical" href="{{ page.url | replace:'index.html','' | absolute_url }}">
   <link rel="alternate" type="application/rss+xml" title="{{ site.title | escape }}" href="{{ "/feed.xml" | relative_url }}">
   
+  <!-- Include JQuery from google -->
+  {% if site.data.setup.use-separate-navbanner %}
+  	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
+  {% endif %}
+  
   <!-- Include google analytics for production build and if necessary -->
   {% if jekyll.environment == 'production' and site.google_analytics %}
 	{% include google-analytics.html %}

data/_includes/navbanner.html

@@ -1,6 +1,6 @@
 <!-- Title of the site is always visible -->
 <div class="navbanner-title">
-	<div class="banner-icon"></div>
+	<div class="banner-icon-container"><div class="banner-icon"></div></div>
 	<p class="site-title-text">{{ site.title }}</p>
 </div>
 

data/_layouts/default.html

@@ -11,7 +11,11 @@
   	<body class="body-panel">
   	
   		{% if navbanner-position == 'top' %}
-  		<div class="navbanner-panel">{% include navbanner.html %}</div>
+  			{% if site.data.setup.use-separate-navbanner %}
+  				<div id="navFrame" class="navbanner-panel"><script>$("#navFrame").load("/navbanner.html");</script></div>
+  			{% else %}
+  				<div class="navbanner-panel">{% include navbanner.html %}</div>
+  			{% endif %}
   		{% endif %}
 
 		<div class="column-panel">
@@ -36,7 +40,11 @@
 
 			<div class="primary-column">
 			  	{% if navbanner-position == 'main' %}
-  				<div class="navbanner-panel">{% include navbanner.html %}</div>
+  					{% if site.data.setup.use-separate-navbanner %}
+  						<div id="navFrame" class="navbanner-panel"><script>$("#navFrame").load("/navbanner.html");</script></div>
+  					{% else %}
+  						<div class="navbanner-panel">{% include navbanner.html %}</div>
+  					{% endif %}
   				{% endif %}
 				<main>{{ content }}</main>
 			</div>

data/_layouts/navbanner-layout.html

@@ -0,0 +1 @@
+{% include navbanner.html %}

data/_sass/classic/_formatting.scss

@@ -32,19 +32,39 @@ body {
 				margin-top: $narrow-vertical-title-shift;
 			}
 		}
-		.banner-icon {
+		.banner-icon-container {
 			position: absolute;
+			top: 0px;
+			left: 0px;
 			width: 100%;
 			height: 100%;
+			display: flex;
+			overflow: hidden;
 		}
 		@include wide-layout {
 			height: $wide-banner-height;
-			background: $wide-banner-background;
+			background-color: $wide-banner-background;
 			@if $wide-icon-url != none {
 				.banner-icon {
-					top: $wide-icon-voffset;
-					left: $wide-icon-hoffset;
-					background: $wide-icon-url $wide-icon-hposition $wide-icon-vposition no-repeat;
+					margin-top: $wide-icon-voffset;
+					margin-left: $wide-icon-hoffset;
+					content: $wide-icon-url;
+				}
+				.banner-icon-container {
+					@if $wide-icon-vposition == top {
+						align-items: flex-start;
+					} @else if $wide-icon-vposition == bottom {
+						align-items: flex-end;
+					} @else {
+						align-items: $wide-icon-vposition;
+					}
+					@if $wide-icon-hposition == left {
+						justify-content: flex-start;
+					} @else if $wide-icon-hposition == right {
+						justify-content: flex-end;
+					} @else {
+						justify-content: $wide-icon-hposition;
+					}
 				}
 			}
 		}
@@ -53,9 +73,25 @@ body {
 			background: $medium-banner-background;
 			@if $medium-icon-url != none {
 				.banner-icon {
-					top: $medium-icon-voffset;
-					left: $medium-icon-hoffset;
-					background: $medium-icon-url $medium-icon-hposition $medium-icon-vposition no-repeat;
+					margin-top: $medium-icon-voffset;
+					margin-left: $medium-icon-hoffset;
+					content: $medium-icon-url;
+				}
+				.banner-icon-container {
+					@if $medium-icon-vposition == top {
+						align-items: flex-start;
+					} @else if $medium-icon-vposition == bottom {
+						align-items: flex-end;
+					} @else {
+						align-items: $medium-icon-vposition;
+					}
+					@if $medium-icon-hposition == left {
+						justify-content: flex-start;
+					} @else if $medium-icon-hposition == right {
+						justify-content: flex-end;
+					} @else {
+						justify-content: $medium-icon-hposition;
+					}
 				}
 			}
 		}
@@ -64,9 +100,25 @@ body {
 			background: $narrow-banner-background;
 			@if $narrow-icon-url != none {
 				.banner-icon {
-					top: $narrow-icon-voffset;
-					left: $narrow-icon-hoffset;
-					background: $narrow-icon-url $narrow-icon-hposition $narrow-icon-vposition no-repeat;
+					margin-top: $narrow-icon-voffset;
+					margin-left: $narrow-icon-hoffset;
+					content: $narrow-icon-url;
+				}
+				.banner-icon-container {
+					@if $narrow-icon-vposition == top {
+						align-items: flex-start;
+					} @else if $narrow-icon-vposition == bottom {
+						align-items: flex-end;
+					} @else {
+						align-items: $narrow-icon-vposition;
+					}
+					@if $narrow-icon-hposition == left {
+						justify-content: flex-start;
+					} @else if $narrow-icon-hposition == right {
+						justify-content: flex-end;
+					} @else {
+						justify-content: $narrow-icon-hposition;
+					}
 				}
 			}
 		}
@@ -220,6 +272,7 @@ body {
 	}
 }
 
+
 // Defines the insets used in the columns and footer-panel. I.e the empty spaces between text and separators lines.
 .insets {
 	padding-top: $vspacing-unit;

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: classic-jekyll-theme
 version: !ruby/object:Gem::Version
-  version: 1.8.4
+  version: 1.9.0
 platform: ruby
 authors:
 - Rien
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2017-07-02 00:00:00.000000000 Z
+date: 2017-07-20 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll-feed
@@ -121,6 +121,7 @@ files:
 - _layouts/content-blocks.html
 - _layouts/default.html
 - _layouts/home.html
+- _layouts/navbanner-layout.html
 - _layouts/page.html
 - _layouts/post.html
 - _sass/classic-jekyll-theme.scss