diff --git a/CHANGELOG.md b/CHANGELOG.md
index f651cd1..edf0dbb 100644
--- 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
index a534679..d9430ac 100644
--- 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
index b8249fd..48f8588 100644
--- 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 = '',
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
index f453652..d3e720f 100644
--- 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
index 6942aff..00cc578 100644
--- a/assets/stylesheets/components/_icons.scss
+++ b/assets/stylesheets/components/_icons.scss
@@ -4,6 +4,7 @@
fill: currentColor;
height: 1em;
position: relative;
+ stroke: currentColor;
width: 1em;
.nav-toggle & {
@@ -11,15 +12,19 @@
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
index 793331a..a2e9337 100644
--- 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
index 68b0fa6..e218ac7 100644
--- 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;
diff --git a/assets/stylesheets/plugins/_gutenberg.scss b/assets/stylesheets/plugins/_gutenberg.scss
index 0951ed8..35b5521 100644
--- a/assets/stylesheets/plugins/_gutenberg.scss
+++ b/assets/stylesheets/plugins/_gutenberg.scss
@@ -119,6 +119,18 @@ p {
border: 5px solid $color__accent;
padding-left: 1.5em;
padding-right: 1.5em;
+
+ p {
+ font-family: $font__family-main;
+ font-size: 150%;
+ font-weight: $font__weight-normal;
+ }
+
+ footer {
+ font-size: 90%;
+ font-weight: $font__weight-normal;
+ text-transform: none;
+ }
}
/*--------------------------------------------------------------
@@ -126,16 +138,27 @@ p {
--------------------------------------------------------------*/
.wp-block-button {
+ @include site-width;
+
background-color: transparent;
- font-family: inherit;
- font-size: inherit;
+ border-radius: 0;
+ display: block;
+ height: auto;
line-height: 38px;
margin-bottom: 30px;
- max-width: $content__width-large;
- text-align: center;
+ padding: 0;
+ white-space: normal;
+
+ &.alignleft,
+ &.alignright {
+ margin-left: 30px;
+ margin-right: 30px;
+ width: auto;
+ }
&.aligncenter {
display: block;
+ text-align: center;
}
.entry-content & a {
@@ -184,7 +207,6 @@ p {
&.alignwide {
max-width: $content__width-large;
- width: 100%;
}
&.alignfull {
@@ -208,22 +230,24 @@ p {
margin-top: 3em;
&.alignwide {
- max-width: $content__width-large;
- width: 100%;
+ @include site-width($content__width-large);
}
&.alignfull {
max-width: 100%;
width: 100%;
}
-
- .blocks-gallery-image {
- margin: 8px;
- }
}
+// How awful that we have to extend this specificity tomfoolery
.blocks-gallery-image {
- //
+
+ .wp-block-gallery &,
+ .wp-block-gallery.alignleft &,
+ .wp-block-gallery.alignright &,
+ .wp-block-gallery.aligncenter & {
+ margin: 8px;
+ }
}
/*--------------------------------------------------------------
@@ -282,10 +306,10 @@ p {
}
/*--------------------------------------------------------------
-# Embed
+# Video
--------------------------------------------------------------*/
-.wp-block-embed {
+.wp-block-video {
@include site-width($content__width-normal);
margin-bottom: 3em;
@@ -300,44 +324,60 @@ p {
width: 100%;
}
- // Added an extra class here because Gutenberg doesn't add a class when you're embedding a video
- &.responsive {
- display: block;
- overflow: hidden;
- padding: 0;
- position: relative;
- width: 100%;
+ figcaption {
+ @include caption;
+ }
+}
- &:before {
- content: "";
- display: block;
- padding-top: 56.25%;
- }
+/*--------------------------------------------------------------
+# Embed
+--------------------------------------------------------------*/
- iframe {
- border: 0;
- bottom: 0;
- height: 100%;
- left: 0;
- position: absolute;
- top: 0;
- width: 100%;
- }
- }
+.wp-block-embed,
+[class^="wp-block-embed-"] {
+ @include site-width($content__width-normal);
- iframe {
- //
- }
+ margin-bottom: 3em;
+ margin-top: 3em;
- .twitter-tweet {
- //
+ &.alignwide {
+ @include site-width($content__width-large);
}
- .wp-embedded-content {
- //
+ &.alignfull {
+ max-width: 100%;
+ width: 100%;
}
figcaption {
@include caption;
}
}
+
+/*
+ * There is no way to know which embed classes have video,
+ * so we need to declare each one specifically.
+ */
+.wp-block-embed-youtube,
+.wp-block-embed-vimeo,
+.wp-block-embed-videopress {
+ overflow: hidden;
+ position: relative;
+ width: 100%;
+
+ &:before {
+ content: "";
+ display: block;
+ padding-top: 56.25%;
+ }
+
+ iframe {
+ border: 0;
+ bottom: 0;
+ height: 100%;
+ left: 0;
+ position: absolute;
+ top: 0;
+ width: 100%;
+ }
+}
diff --git a/assets/stylesheets/style.scss b/assets/stylesheets/style.scss
index d01e281..f3e64fa 100644
--- a/assets/stylesheets/style.scss
+++ b/assets/stylesheets/style.scss
@@ -4,7 +4,7 @@ Theme URI: http://eichefam.net/projects/cover2
Author: Paul Eiche
Author URI: https://eichefam.net
Description: A content-driven blogging theme for WordPress.
-Version: 1.0.14
+Version: 1.0.15
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: cover2
diff --git a/assets/svg/arrow-left.svg b/assets/svg/arrow-left.svg
new file mode 100644
index 0000000..1175b44
--- /dev/null
+++ b/assets/svg/arrow-left.svg
@@ -0,0 +1,3 @@
+
\ No newline at end of file
diff --git a/assets/svg/arrow-right.svg b/assets/svg/arrow-right.svg
new file mode 100644
index 0000000..151f051
--- /dev/null
+++ b/assets/svg/arrow-right.svg
@@ -0,0 +1,3 @@
+
\ No newline at end of file
diff --git a/assets/svg/category.svg b/assets/svg/category.svg
new file mode 100644
index 0000000..5234de9
--- /dev/null
+++ b/assets/svg/category.svg
@@ -0,0 +1,4 @@
+
\ No newline at end of file
diff --git a/assets/svg/chat.svg b/assets/svg/chat.svg
new file mode 100644
index 0000000..f9b8c84
--- /dev/null
+++ b/assets/svg/chat.svg
@@ -0,0 +1,4 @@
+
\ No newline at end of file
diff --git a/assets/svg/chevron-down-large.svg b/assets/svg/chevron-down-large.svg
new file mode 100644
index 0000000..16bfd8c
--- /dev/null
+++ b/assets/svg/chevron-down-large.svg
@@ -0,0 +1,2 @@
+
\ No newline at end of file
diff --git a/assets/svg/chevron-down-small.svg b/assets/svg/chevron-down-small.svg
new file mode 100644
index 0000000..55d6631
--- /dev/null
+++ b/assets/svg/chevron-down-small.svg
@@ -0,0 +1,2 @@
+
\ No newline at end of file
diff --git a/assets/svg/edit.svg b/assets/svg/edit.svg
new file mode 100644
index 0000000..5a14406
--- /dev/null
+++ b/assets/svg/edit.svg
@@ -0,0 +1,4 @@
+
\ No newline at end of file
diff --git a/assets/svg/gallery.svg b/assets/svg/gallery.svg
new file mode 100644
index 0000000..59a0846
--- /dev/null
+++ b/assets/svg/gallery.svg
@@ -0,0 +1,4 @@
+
\ No newline at end of file
diff --git a/assets/svg/image.svg b/assets/svg/image.svg
new file mode 100644
index 0000000..0bc1443
--- /dev/null
+++ b/assets/svg/image.svg
@@ -0,0 +1,6 @@
+
\ No newline at end of file
diff --git a/assets/svg/link.svg b/assets/svg/link.svg
new file mode 100644
index 0000000..9478781
--- /dev/null
+++ b/assets/svg/link.svg
@@ -0,0 +1,4 @@
+
\ No newline at end of file
diff --git a/assets/svg/music.svg b/assets/svg/music.svg
new file mode 100644
index 0000000..2da426a
--- /dev/null
+++ b/assets/svg/music.svg
@@ -0,0 +1,5 @@
+
\ No newline at end of file
diff --git a/assets/svg/note.svg b/assets/svg/note.svg
new file mode 100644
index 0000000..55a4179
--- /dev/null
+++ b/assets/svg/note.svg
@@ -0,0 +1,3 @@
+
\ No newline at end of file
diff --git a/assets/svg/pin.svg b/assets/svg/pin.svg
new file mode 100644
index 0000000..7384ca3
--- /dev/null
+++ b/assets/svg/pin.svg
@@ -0,0 +1,5 @@
+
\ No newline at end of file
diff --git a/assets/svg/quote.svg b/assets/svg/quote.svg
new file mode 100644
index 0000000..1f92b75
--- /dev/null
+++ b/assets/svg/quote.svg
@@ -0,0 +1,4 @@
+
\ No newline at end of file
diff --git a/assets/svg/status.svg b/assets/svg/status.svg
new file mode 100644
index 0000000..4e32c5d
--- /dev/null
+++ b/assets/svg/status.svg
@@ -0,0 +1,2 @@
+
\ No newline at end of file
diff --git a/assets/svg/tag.svg b/assets/svg/tag.svg
new file mode 100644
index 0000000..6b06e3e
--- /dev/null
+++ b/assets/svg/tag.svg
@@ -0,0 +1,3 @@
+
\ No newline at end of file
diff --git a/assets/svg/video-circle.svg b/assets/svg/video-circle.svg
new file mode 100644
index 0000000..2267bab
--- /dev/null
+++ b/assets/svg/video-circle.svg
@@ -0,0 +1,3 @@
+
\ No newline at end of file
diff --git a/assets/svg/video-square.svg b/assets/svg/video-square.svg
new file mode 100644
index 0000000..e42c654
--- /dev/null
+++ b/assets/svg/video-square.svg
@@ -0,0 +1,3 @@
+
\ No newline at end of file
diff --git a/assets/svg/x.svg b/assets/svg/x.svg
new file mode 100644
index 0000000..9702dee
--- /dev/null
+++ b/assets/svg/x.svg
@@ -0,0 +1,2 @@
+
\ No newline at end of file
diff --git a/components/header/header-nav.php b/components/header/header-nav.php
index 0367266..b6f5c53 100644
--- a/components/header/header-nav.php
+++ b/components/header/header-nav.php
@@ -8,13 +8,17 @@
$has_sidebar = false;
if ( is_active_sidebar( 'sidebar-overlay' ) || has_nav_menu( 'top' ) || has_nav_menu( 'jetpack-social-menu' ) ) :
$has_sidebar = true; ?>
-