Merge pull request #15 from peiche/v1.0.15

V1.0.15
peiche · Dec 6, 2017 · 4089fb4 · 4089fb4
2 parents c00a552 + 352fed4
commit 4089fb4
Show file tree

Hide file tree

Showing 46 changed files with 8,186 additions and 193 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -2,6 +2,16 @@
 
 All notable changes to this project will be documented in this file. This project adheres to [Semantic Versioning](http://semver.org/).
 
+**1.0.15 - 12/5/2017**
+- Fixed Aesop Story Engine chapter overlay.
+- Fixed header styles on paged archives.
+- Fixed [JavaScript error](https://github.com/peiche/cover2/issues/13).
+- Fixed [error on 404 pages](https://github.com/peiche/cover2/issues/14).
+- Fixed Aesop Story Engine chapter component logic for site header and overlay.
+- Replaced Font Awesome icons with Nucleo icons.
+- Removed Morpheus SVG.
+- Updated Gutenberg styles.
+
 **1.0.14 - 10/27/2017**
 - Fixed Gutenberg full width gallery.
 

diff --git a/README.md b/README.md
@@ -111,11 +111,10 @@ License - http://creativecommons.org/publicdomain/zero/1.0/
 
 All other resources are licensed as follows:
 
-* [Font Awesome SVG PNG](https://github.com/encharm/Font-Awesome-SVG-PNG) - [MIT](https://github.com/encharm/Font-Awesome-SVG-PNG/blob/master/LICENSE)
 * [Headroom](http://wicky.nillia.ms/headroom.js/) - [MIT](https://github.com/WickyNilliams/headroom.js/blob/master/LICENSE)
 * [FlexSlider](http://flexslider.woothemes.com) - [GPL v2.0 or later](https://github.com/woocommerce/FlexSlider/blob/master/LICENSE.md)
 * [Bourbon Neat](http://neat.bourbon.io/) - [MIT](https://github.com/thoughtbot/neat/blob/master/LICENSE.md)
-* [Morpheus SVG](http://alexk111.github.io/SVG-Morpheus/) - [MIT](https://github.com/alexk111/SVG-Morpheus/blob/master/LICENSE)
+* [Nucleo Icons](https://nucleoapp.com/) - [Standard License](https://github.com/NucleoApp/license-standard)
 
 ## Inspiration
 

diff --git a/assets/js/main.js b/assets/js/main.js
@@ -2,6 +2,21 @@
  * Custom js for theme
  */
 
+// CustomEvent polyfill
+( function() {
+	if ( 'function' === typeof window.CustomEvent ) {
+		return false;
+	}
+	function CustomEvent( event, params ) {
+		var evt = document.createEvent( 'CustomEvent' );
+		params = params || { bubbles: false, cancelable: false, detail: undefined };
+		evt.initCustomEvent( event, params.bubbles, params.cancelable, params.detail );
+		return evt;
+	}
+	CustomEvent.prototype = window.Event.prototype;
+	window.CustomEvent = CustomEvent;
+} )();
+
 ( function( $ ) {
 	var $window   = $( window ),
 		$document = $( document ),
@@ -16,13 +31,10 @@
 		chapterToggle = $( '.chapter-toggle' ),
 		button = '<button class="showsub-toggle" aria-expanded="false">' + menuToggleText.icon + '<span class="screen-reader-text">' + menuToggleText.open + '</span></button>',
 		headroom,
-		morpheusConfig = {
-			duration: 200,
-			rotation: 'none'
-		},
-		menuIcon = $( '#svg-icon-menu-icon' ).length > 0 ? new SVGMorpheus( '#svg-icon-menu-icon', morpheusConfig ) : undefined,
-		searchIcon = $( '#svg-icon-search-icon' ).length > 0 ? new SVGMorpheus( '#svg-icon-search-icon', morpheusConfig ) : undefined,
-		bookmarkIcon = $( '#svg-icon-bookmark-icon' ).length > 0 ? new SVGMorpheus( '#svg-icon-bookmark-icon', morpheusConfig ) : undefined;
+		clickEvent = new CustomEvent( 'click' ), // For programmatically firing the click event on SVG icons
+		menuIcon = document.getElementById( 'svg-icon-menu-icon' ),
+		searchIcon = document.getElementById( 'svg-icon-search-icon' ),
+		bookmarkIcon = document.getElementById( 'svg-icon-bookmark-icon' );
 
 	/**
 	 * Header
@@ -64,7 +76,7 @@
 			$this.toggleClass( 'toggle-on' );
 			$this.attr( 'aria-expanded', 'false' == $( this ).attr( 'aria-expanded' ) ? 'true' : 'false' );
 
-			menuIcon.to( $this.hasClass( 'toggle-on' ) ? 'svg-icon-menu-close' : 'svg-icon-menu' );
+			menuIcon.dispatchEvent( clickEvent );
 
 			searchToggle.toggleClass( 'hide' );
 			chapterToggle.toggleClass( 'hide' );
@@ -82,7 +94,7 @@
 			$this.toggleClass( 'toggle-on' );
 			$this.attr( 'aria-expanded', 'false' == $( this ).attr( 'aria-expanded' ) ? 'true' : 'false' );
 
-			searchIcon.to( $this.hasClass( 'toggle-on' ) ? 'svg-icon-search-close' : 'svg-icon-search' );
+			searchIcon.dispatchEvent( clickEvent );
 
 			menuToggle.toggleClass( 'hide' );
 			chapterToggle.toggleClass( 'hide' );
@@ -105,7 +117,7 @@
 			$this.toggleClass( 'toggle-on' );
 			$this.attr( 'aria-expanded', 'false' == $( this ).attr( 'aria-expanded' ) ? 'true' : 'false' );
 
-			bookmarkIcon.to( $this.hasClass( 'toggle-on' ) ? 'svg-icon-bookmark-close' : 'svg-icon-bookmark' );
+			bookmarkIcon.dispatchEvent( clickEvent );
 
 			menuToggle.toggleClass( 'hide' );
 			searchToggle.toggleClass( 'hide' );
@@ -142,7 +154,6 @@
 		 */
 		$document.on( 'click', function( e ) {
 			var $toggle = $( '.mini-menu-container .showsub-toggle.sub-on' );
-			console.log( e );
 			if ( $toggle.length > 0 && (
 					! $( e.target ).is( '.mini-menu-container .showsub-toggle' ) &&
 					! $( e.target ).closest( '.showsub-toggle' ).is( '.mini-menu-container .showsub-toggle' ) ) ) {
@@ -210,7 +221,7 @@
 			chapterOverlay.removeClass( 'show' ).resize();
 			menuToggle.removeClass( 'hide' );
 			searchToggle.removeClass( 'hide' );
-			bookmarkIcon.to( 'svg-icon-bookmark' );
+			bookmarkIcon.dispatchEvent( clickEvent );
 		} );
 	}
 
@@ -225,7 +236,7 @@
 			menuOverlay.removeClass( 'show' ).resize();
 			searchToggle.removeClass( 'hide' );
 			chapterToggle.removeClass( 'hide' );
-			menuIcon.to( 'svg-icon-menu' );
+			menuIcon.dispatchEvent( clickEvent );
 		}
 
 		if ( 27 === e.keyCode && searchOverlay.hasClass( 'show' ) ) {
@@ -235,7 +246,7 @@
 			searchOverlay.removeClass( 'show' ).resize();
 			menuToggle.removeClass( 'hide' );
 			chapterToggle.removeClass( 'hide' );
-			searchIcon.to( 'svg-icon-search' );
+			searchIcon.dispatchEvent( clickEvent );
 		}
 
 		if ( 27 === e.keyCode && chapterOverlay.hasClass( 'show' ) ) {
@@ -245,7 +256,7 @@
 			chapterOverlay.removeClass( 'show' ).resize();
 			menuToggle.removeClass( 'hide' );
 			searchToggle.removeClass( 'hide' );
-			bookmarkIcon.to( 'svg-icon-bookmark' );
+			bookmarkIcon.dispatchEvent( clickEvent );
 		}
 	} );
 

diff --git a/assets/stylesheets/components/_header.scss b/assets/stylesheets/components/_header.scss
@@ -12,7 +12,7 @@
   z-index: $z-index__default + 2;
 
   .has-featured-image &,
-  .has-featured-post &,
+  .has-featured-post:not(.paged) &,
   .archive & {
     background-color: transparent;
   }
@@ -62,7 +62,7 @@
       background-color: $color__accent;
     }
 
-    .blog.has-featured-post & {
+    .blog.has-featured-post:not(.paged) & {
       background-color: transparent;
     }
   }

diff --git a/assets/stylesheets/components/_icons.scss b/assets/stylesheets/components/_icons.scss
@@ -4,22 +4,27 @@
   fill: currentColor;
   height: 1em;
   position: relative;
+  stroke: currentColor;
   width: 1em;
 
   .nav-toggle & {
     height: inherit;
     width: inherit;
   }
 
+  .showsub-toggle & {
+    transition: all 200ms;
+  }
+
   .showsub-toggle.sub-on & {
-    transform: rotate(180deg);
+    transform: rotateX(180deg);
 
     .mini-menu-container & {
-      transform: rotate(0deg);
+      transform: rotateX(0deg);
     }
 
     .mini-menu-container .sub-menu & {
-      transform: rotate(180deg);
+      transform: rotateX(180deg);
     }
   }
 

diff --git a/assets/stylesheets/layout/_pages.scss b/assets/stylesheets/layout/_pages.scss
@@ -31,15 +31,7 @@
 		background-color: $color__background-dark;
 		min-height: 100vh;
 		padding-bottom: 75px;
-		padding-top: 45vh;
-
-		@include min-width($breakpoint__tablet-portrait) {
-			padding-top: 60vh;
-		}
-	}
-
-	.has-featured-video & {
-		padding-top: 44vh; // 60vh - 16vh
+		padding-top: 40vh;
 	}
 
 	hr {

diff --git a/assets/stylesheets/plugins/_aesop.scss b/assets/stylesheets/plugins/_aesop.scss
@@ -239,7 +239,7 @@
 }
 
 .aesop-timeline,
-.scroll-nav {
+.singlepage-scroll-nav .scroll-nav {
   background-color: transparent;
   bottom: auto;
   display: none;