Updated the theme to last the version of Ghost's Casper.

jekyllt · Oct 30, 2015 · 554be04 · 554be04
1 parent 42688db
commit 554be04
Show file tree

Hide file tree

Showing 100 changed files with 3,370 additions and 14,595 deletions.
diff --git a/404.html b/404.html
@@ -4,17 +4,50 @@
 permalink: 404.html
 ---
 
-		<section class="error-content error-404 js-error-container">
-          <section class="error-details">
-            <figure class="error-image">
-              <img
-                class="error-ghost"
-                src="{{ site.baseurl }}assets/images/404.png"/>
-            </figure>
-            <section class="error-message">
-              <h1 class="error-code">404</h1>
-              <h2 class="error-description">Page Not Found</h2>
-              <a class="error-link" href="{{ site.baseurl }}">Go to the front page →</a>
-            </section>
-          </section>
-        </section>
+<!doctype html>
+<!--[if (IE 8)&!(IEMobile)]><html class="no-js lt-ie9" lang="en"><![endif]-->
+<!--[if (gte IE 9)| IEMobile |!(IE)]><!--><html class="no-js" lang="en"><!--<![endif]-->
+<head>
+    <meta http-equiv="Content-Type" content="text/html" charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+
+    <title>404 - Page Not Found</title>
+
+    <meta name="HandheldFriendly" content="True">
+    <meta name="MobileOptimized" content="320">
+    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+
+    <link rel="shortcut icon" href="{{ site.baseurl }}assets/images/favicon.ico">
+    <meta http-equiv="cleartype" content="on">
+
+    <link rel="stylesheet" type='text/css' href='//fonts.googleapis.com/css?family=Open+Sans:400,300,700'>
+    <link rel="stylesheet" href="{{ site.baseurl }}assets/css/ghost.min.css" />
+</head>
+<body>
+    <main role="main" id="main">
+        <div class="gh-app">
+            <div class="gh-viewport">
+                <div class="gh-view">
+                    <section class="error-content error-404 js-error-container">
+                        <section class="error-details">
+                            <img
+                                    class="error-ghost"
+                                    src="{{ site.baseurl }}assets/images/404.png"
+                                    srcset="{{ site.baseurl }}assets/images/404.png"/>
+                            <section class="error-message">
+                                <h1 class="error-code">404</h1>
+                                <h2 class="error-description">Page not found</h2>
+                                <a class="error-link" href="{{ site.baseurl }}">Go to the front page →</a>
+                            </section>
+                        </section>
+                    </section>
+                </div>
+            </div>
+        </div>
+    </main>
+
+    <!-- Add Google Analytics  -->
+    {% include analytics.html %}
+</body>
+</html>
diff --git a/README.md b/README.md
@@ -1,11 +1,10 @@
 # Jasper
 
-This is a port of Ghost's default theme [Casper](https://github.com/tryghost/casper) for Jekyll inspired by the work of 
-[Kasper](https://github.com/rosario/kasper). 
+This is a port of Ghost's default theme [Casper](https://github.com/tryghost/casper) for Jekyll inspired by [Kasper](https://github.com/rosario/kasper). 
 
 You might well ask at this point why bother making a new Casper's clone? 
-Although this is inspired by Kasper, there are some *additional* features which make this port closer 
-to the original theme. 
+Although this is inspired by Kasper, there are several **additional** features which make this port closer 
+to the original theme. Besides, it was recently updated to match the current version of the theme.
 
 The main difference to the original is still the fact that Jasper expects a single author. With a 
 bit of tweaking it shouldn't be too difficult to enable a per-post author. Feel free to fork and improve on this.
@@ -35,17 +34,26 @@ This is exactly what I have done for the generating the live demo.
 **Tags page**
 ![tag page](https://raw.githubusercontent.com/biomadeira/jasper/master/assets/images/jasper_screen4.png)
 
+**Sidebar page**
+![sidebar page](https://raw.githubusercontent.com/biomadeira/jasper/master/assets/images/jasper_screen5.png)
+
+**Related posts page**
+![related page](https://raw.githubusercontent.com/biomadeira/jasper/master/assets/images/jasper_screen6.png)
+
 ## Jasper theme includes
 
 * Pagination
-* Author page **(New)**
-* Tag page(s) **(New)**
-* 404 page **(New)**
+* Author page **(New 07.02.2015)**
+* Tag page(s) **(New 07.02.2015)**
+* 404 page **(New 07.02.2015)**
+* Toggleable sliding sidebar **(New 07.02.2015)**
+* Related posts view **(New 30.10.2015)**
+* Tag description(s) **(New 30.10.2015)**
 * Rss
-* Google Analytics Tracking code
+* Google Analytics tracking
 * Code Syntax Highlight
 * Author's profile with picture
-* Disqus comments
+* Disqus comments (not Ghost standard)
 
 ## How to use it
 

diff --git a/_config.yml b/_config.yml
@@ -17,8 +17,7 @@ paginate: 5
 language: 'en-uk'
 short_url: 'biomadeira.github.io/jasper/'
 google_analytics: UA-69281367-1
-disqus: biomadeira
-
+disqus: username
 baseurl: /jasper/
 
 # Permalinks

diff --git a/_includes/head.html b/_includes/head.html
@@ -1,3 +1,30 @@
     <link rel="canonical" href="{{ site.baseurl }}" />
-    <meta name="generator" content="Jekyll 2.5.3" />
-    <link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ site.baseurl }}rss.xml" />
+    <meta name="referrer" content="origin" />
+    <link rel="next" href="{{ site.baseurl }}page2/" />
+
+    <meta property="og:site_name" content="{{ site.name }}" />
+    <meta property="og:type" content="website" />
+    <meta property="og:title" content="{{ site.name }}" />
+    <meta property="og:description" content="{{ site.description }}" />
+    <meta property="og:url" content="{{ site.baseurl }}" />
+    <meta property="og:image" content="{{ site.baseurl }}assets/images/cover1.jpg" />
+
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:title" content="{{ site.name }}" />
+    <meta name="twitter:description" content="{{ site.description }}" />
+    <meta name="twitter:url" content="{{ site.baseurl }}" />
+    <meta name="twitter:image:src" content="{{ site.baseurl }}assets/images/cover1.jpg" />
+
+    <script type="application/ld+json">
+{
+    "@context": "http://schema.org",
+    "@type": "Website",
+    "publisher": "Finding The Way Home",
+    "url": "{{ site.baseurl }}",
+    "image": "{{ site.baseurl }}assets/images/cover1.jpg",
+    "description": "{{ site.description }}"
+}
+    </script>
+
+    <meta name="generator" content="Jekyll 3.0.0" />
+    <link rel="alternate" type="application/rss+xml" title="{{ site.name }}" href="{{ site.baseurl }}rss.xml" />
diff --git a/_includes/navigation.html b/_includes/navigation.html
@@ -0,0 +1,16 @@
+<div class="nav">
+    <h3 class="nav-title">Menu</h3>
+    <a href="#" class="nav-close">
+        <span class="hidden">Close</span>
+    </a>
+    <ul>
+        <li class="nav-home {% if page.current == 'home' %} nav-current{% endif %}" role="presentation"><a href="{{ site.baseurl }}">Home</a></li>
+        <li class="nav-about {% if page.current == 'about' %} nav-current{% endif %}" role="presentation"><a href="{{ site.baseurl }}about/">About</a></li>
+        <li class="nav-fables {% if page.url contains 'fables' %} nav-current{% endif %}" role="presentation"><a href="{{ site.baseurl }}tag/fables/">Fables</a></li>
+        <li class="nav-speeches {% if page.url contains 'speeches' %} nav-current{% endif %}" role="presentation"><a href="{{ site.baseurl }}tag/speeches/">Speeches</a></li>
+        <li class="nav-fiction {% if page.url contains 'fiction' %} nav-current{% endif %}" role="presentation"><a href="{{ site.baseurl }}tag/fiction/">Fiction</a></li>
+        <li class="nav-author {% if page.current == 'author' %} nav-current{% endif %}" role="presentation"><a href="{{ site.baseurl }}author/casper/">Author</a></li>
+    </ul>
+    <a class="subscribe-button icon-feed" href="{{ site.baseurl }}rss.xml">Subscribe</a>
+</div>
+<span class="nav-cover"></span>
diff --git a/_layouts/404.html b/_layouts/404.html
diff --git a/_layouts/author.html b/_layouts/author.html
@@ -1,8 +1,12 @@
 ---
 layout: default
 title: Author
-cover: 'assets/images/cover1.jpg'
+cover: 'assets/images/cover4.jpg'
 class: 'author-template'
+navigation: True
+label: Author
+logo: 'assets/images/ghost.png'
+current: author
 ---
 <!-- < default}} -->
 <!-- The tag above means - insert everything in this file into the [body] of the default.hbs template -->
@@ -13,8 +17,10 @@
 <!-- #author  -->
     <header class="main-header author-head {% if page.cover %}" style="background-image: url({{ site.baseurl }}{{ page.cover }}) {% else %}no-cover{% endif %}">
         <nav class="main-nav overlay clearfix">
-                    <a class="back-button icon-arrow-left" href="{{ site.baseurl }}">Home</a>
-        <a class="subscribe-button icon-feed" href="{{ site.baseurl }}author/{{ site.username }}/rss.xml">{{ site.author }}</a>
+            {% if page.logo %}<a class="blog-logo" href="{{ site.baseurl }}"><img src="{{ site.baseurl }}{{ page.logo }}" alt="Blog Logo" /></a>{% endif %}
+            {% if page.navigation %}
+                <a class="menu-button icon-menu" href="#"><span class="word">Menu</span></a>
+            {% endif %}
         </nav>
     </header>
 

diff --git a/_layouts/default.html b/_layouts/default.html
@@ -6,7 +6,7 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
 
     <!-- [[! Page Meta ]] -->
-    <title>{{ site.name }}</title>
+    <title>{% if page.title %}{{ page.title }}{% elsif site.name %}{{ site.name }}{% endif %}</title>
     <meta name="description" content="{{ site.name }} - {{ site.description }}" />
 
     <meta name="HandheldFriendly" content="True" />
@@ -16,28 +16,29 @@
 
     <!-- [[! Styles'n'Scripts ]] -->
     <link rel="stylesheet" type="text/css" href="{{ site.baseurl }}assets/css/screen.css" />
-    <link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Merriweather:300,700,700italic,300italic|Open+Sans:700,400" />
+    <link rel="stylesheet" type="text/css"
+          href="//fonts.googleapis.com/css?family=Merriweather:300,700,700italic,300italic|Open+Sans:700,400" />
 
     <!-- [[! Ghost outputs important style and meta data with this tag ]] -->
     {% include head.html %}
 
-    <!-- Additional Jekyll Customisation  -->
-    <link rel="stylesheet" type="text/css" href="{{ site.baseurl }}assets/css/main.css" />
-
 </head>
-<body class="{% if page.class %}{{ page.class }}{% else %}home-template{% endif %}">
+<body class="{% if page.class %}{{ page.class }}{% else %}home-template{% endif %} nav-closed">
 
-    <!-- [[! Everything else gets inserted here ]] -->
-    {{ content }}
+    {% include navigation.html %}
 
-    <footer class="site-footer clearfix">
-      <section class="copyright"><a href="{{ site.baseurl }}">{{ site.name }}</a> &copy; {{  site.time | date: '%Y' }}</section>
-      <section class="poweredby">Proudly published with <a href="http://jekyllrb.com/">Jekyll</a> using <a href="http://github.com/biomadeira/jasper">Jasper</a></section>
-    </footer>
-
-    <!-- [[! Ghost outputs important scripts and data with this tag ]] -->
-    <script type="text/javascript" src="{{ site.baseurl }}assets/js/jquery-1.11.1.min.js"></script>
+    <div class="site-wrapper">
 
+        <!-- [[! Everything else gets inserted here ]] -->
+        {{ content }}
+
+        <footer class="site-footer clearfix">
+          <section class="copyright"><a href="{{ site.baseurl }}">{{ site.name }}</a> &copy; {{  site.time | date: '%Y' }}</section>
+          <section class="poweredby">Proudly published with <a href="http://jekyllrb.com/">Jekyll</a> using <a href="http://github.com/biomadeira/jasper">Jasper</a></section>
+        </footer>
+    </div>
+    <!-- [[! Ghost outputs important scripts and data with this tag ]] -->
+    <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
     <!-- [[! The main JavaScript file for Casper ]] -->
     <script type="text/javascript" src="{{ site.baseurl }}assets/js/jquery.fitvids.js"></script>
     <script type="text/javascript" src="{{ site.baseurl }}assets/js/index.js"></script>

diff --git a/_layouts/error.html b/_layouts/error.html
@@ -1,31 +1 @@
-<!DOCTYPE html>
-<html>
-<head>
-    <!-- [[! Document Settings ]] -->
-    <meta charset="utf-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-
-    <title>{{ page.title }}</title>
-    <meta name="description" content="">
-    <meta name="author" content="">
-    <meta name="HandheldFriendly" content="True">
-    <meta name="MobileOptimized" content="320">
-    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">
-    <meta name="apple-mobile-web-app-capable" content="yes" />
-
-    <link rel="shortcut icon" href="{{ site.baseurl }}/assets/images/favicon.ico">
-    <meta http-equiv="cleartype" content="on">
-
-    <link rel="stylesheet" type='text/css' href='//fonts.googleapis.com/css?family=Open+Sans:400,300,700'>
-    <link rel="stylesheet" href="{{ site.baseurl }}assets/css/ghost.min.css">
-  </head>
-  <body class="">
-    <main role="main" id="main">
-      <div id="container">
-        {{ content }}
-      </div>
-    </main>
-    <!-- Add Google Analytics  -->
-    {% include analytics.html %}   
-  </body>
-</html>
+{{ content }}
diff --git a/_layouts/page.html b/_layouts/page.html
@@ -12,8 +12,11 @@
 
 <header class="main-header post-head {% if page.cover %}" style="background-image: url({{ site.baseurl }}{{ page.cover }}){% else %}no-cover{% endif %}">
     <nav class="main-nav {% if page.cover %}overlay{% endif %} clearfix">
-        <a class="back-button icon-arrow-left" href="{{ site.baseurl }}">Home</a>
-        <a class="subscribe-button icon-feed" href="{{ site.baseurl }}rss.xml">Subscribe</a>
+        {% if page.logo %}<a class="blog-logo" href="{{ site.baseurl }}"><img src="{{ site.baseurl }}{{ page.logo }}" alt="Blog Logo" /></a>{% endif %}
+        {% if page.navigation %}
+            <a class="menu-button icon-menu" href="#"><span class="word">Menu</span></a>
+            {{ include navigation.html }}
+        {% endif %}
     </nav>
 </header>
 

diff --git a/_layouts/post.html b/_layouts/post.html
@@ -13,8 +13,10 @@
 
 <header class="main-header post-head {% if page.cover %}" style="background-image: url({{ site.baseurl }}{{ page.cover }}) {% else %}no-cover{% endif %}">
     <nav class="main-nav {% if page.cover %} overlay {% endif %} clearfix">
-        <a class="back-button icon-arrow-left" href="{{ site.baseurl }}">Home</a>
-        <a class="subscribe-button icon-feed" href="{{ site.baseurl }}rss.xml">Subscribe</a>
+        {% if page.logo %}<a class="blog-logo" href="{{ site.baseurl }}"><img src="{{ site.baseurl }}{{ page.logo }}" alt="Blog Logo" /></a>{% endif %}
+        {% if page.navigation %}
+            <a class="menu-button icon-menu" href="#"><span class="word">Menu</span></a>
+        {% endif %}
     </nav>
 </header>
 
@@ -100,4 +102,29 @@ <h4>Share this post</h4>
     </article>
 
 </main>
+
+<aside class="read-next">
+
+    <!-- [[! next_post ]] -->
+    {% if page.next %}
+        <a class="read-next-story {% if page.next.cover %}" style="background-image: url({{ site.baseurl }}{{ page.next.cover }}){% else %}no-cover{% endif %}" href="{{ site.baseurl }}{{ page.next..url }}">
+            <section class="post">
+                <h2>{{ page.next..title }}</h2>
+                <p>{{ page.next.content | truncatewords:15 }}</p>
+            </section>
+        </a>
+    {% endif %}
+    <!-- [[! /next_post ]] -->
+    <!-- [[! prev_post ]] -->
+    {% if page.previous %}
+        <a class="read-next-story prev {% if page.previous.cover %}" style="background-image: url({{ site.baseurl }}{{ page.previous.cover }}){% else %}no-cover{% endif %}" href="{{ site.baseurl }}{{ page.previous.url }}">
+            <section class="post">
+                <h2>{{ page.previous.title }}</h2>
+                <p>{{ page.previous.content | truncatewords:15 }}</p>
+            </section>
+        </a>
+    {% endif %}
+    <!-- [[! /prev_post ]] -->
+</aside>
+
 <!-- /post -->