diff options
| -rw-r--r-- | README.md | 6 | ||||
| -rw-r--r-- | assets/css/style.css | 173 | ||||
| -rw-r--r-- | assets/js/scripts.js | 6 | ||||
| -rw-r--r-- | assets/sass/style.scss | 184 | ||||
| -rw-r--r-- | author.hbs | 34 | ||||
| -rw-r--r-- | changelog.txt | 33 | ||||
| -rw-r--r-- | default.hbs | 5 | ||||
| -rw-r--r-- | index.hbs | 17 | ||||
| -rw-r--r-- | package.json | 2 | ||||
| -rw-r--r-- | page.hbs | 11 | ||||
| -rw-r--r-- | partials/loop.hbs | 13 | ||||
| -rw-r--r-- | partials/navigation.hbs | 3 | ||||
| -rw-r--r-- | partials/post-content.hbs | 6 | ||||
| -rw-r--r-- | post.hbs | 3 | ||||
| -rw-r--r-- | tag.hbs | 14 |
15 files changed, 459 insertions, 51 deletions
@@ -10,7 +10,7 @@ Ghostwriter is a simple AJAX driven theme for the [Ghost](http://github.com/tryg ### Features -* Supports Ghost 0.4 +* Supports Ghost 0.5.x * Clean typography focused design. * Fully responsive (includes fitvid.js for responsive video embeds). * AJAX loading for fast, smooth transitions between posts and pages. @@ -19,10 +19,6 @@ Ghostwriter is a simple AJAX driven theme for the [Ghost](http://github.com/tryg * Featured post support. * A bunch of other bits and bobs. -### Static Pages and Navigation - -Ghost 0.4 introduced static pages which you can use for making pages separate from your list of blog posts. There isn't however a way to output a list of static pages for navigation yet so you'll need to edit the navigation menu in the default.hbs file yourself. The HTML for the menu starts on `line 37` of the default.hbs file and contains an example `About` menu item on `line 40`. - ### Troubleshooting ###### The Browse Posts link isn't working diff --git a/assets/css/style.css b/assets/css/style.css index c2ade71..869b2c3 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -242,6 +242,12 @@ table { font-weight: 600; line-height: 1; margin: 25px 0 0; } + .post-date a, + .blog-description a { + color: #AEADAD; } + .post-date a:hover, + .blog-description a:hover { + color: #f03838; } .post-date:after, .blog-description:after { border-bottom: 1px dotted #303030; @@ -363,6 +369,62 @@ table { padding: 8px 11px; } /* ============================================================ */ +/* Author */ +/* ============================================================ */ +.author-profile { + margin: 0 40px; } + .author-profile:after { + border-bottom: 1px dotted #303030; + content: ""; + display: block; + margin: 40px auto 0; + width: 100px; } + +.author-heading { + margin: 15px auto; + text-align: center; + width: 100%; } + +.author-avatar { + border-radius: 50px; + display: inline; + height: 50px; + margin: 5px 10px 0 0; + width: 50px; + vertical-align: middle; } + +.author-name { + display: inline; + font-size: 52px; + font-weight: 700; + text-align: center; + text-transform: uppercase; + vertical-align: middle; } + +.author-meta { + color: #AEADAD; + font-size: 14px; + font-weight: 600; + line-height: 1; + margin: 25px 0 0; + text-align: center; + text-transform: uppercase; } + .author-meta span { + display: inline-block; + margin: 0 10px 8px; } + .author-meta i { + margin-right: 8px; } + .author-meta a { + color: #AEADAD; } + .author-meta a:hover { + color: #f03838; } + +.author-bio { + margin: 20px auto 0; + text-align: center; + max-width: 700px; } + +/* ============================================================ */ /* Footer */ /* ============================================================ */ .footer { @@ -413,10 +475,59 @@ table { .post-stub-tag { display: none; } } @media only screen and (max-width: 600px) { + h1, h2 { + margin-bottom: 20px; } + + p { + margin-bottom: 20px; } + + ul, ol { + margin-bottom: 20px; } + + img { + margin: 30px 0; } + + blockquote { + margin: 30px 0; } + + pre { + margin: 30px 0; } + + hr { + margin: 35px 0; } + + .site-header { + padding-top: 60px; } + .site-nav-item { display: block; margin: 15px 0; } + .post-header { + margin-bottom: 35px; + padding-bottom: 45px; } + + .post-title, + .page-title, + .author-name, + .author-heading { + font-size: 42px; + margin-top: 5px; } + + .post-date, + .blog-description, + .author-meta { + margin-top: 20px; } + .post-date:after, .post-date:before, + .blog-description:after, + .blog-description:before, + .author-meta:after, + .author-meta:before { + margin-top: 30px; } + + .author-profile:after, .author-profile:before { + margin-top: 20px; } + .post-stub-title { display: block; } @@ -424,24 +535,74 @@ table { content: ""; display: block; } - .post-container, .post-list { + margin-top: 45px; } + + .post-container, + .post-list, + .author-profile { margin-right: 25px; margin-left: 25px; } .post-tags { width: 100%; } + .post-stub a, + .post-stub a:hover { + padding-top: 12px; + padding-bottom: 12px; } + .share { float: left; margin-top: 20px; } .share a { - margin: 0 5px 0 0; } } + margin: 0 5px 0 0; } + + .footer { + margin-top: 50px; } } @media only screen and (max-width: 400px) { - .post-title { - font-size: 32px; } + .site-header { + padding-top: 40px; } + + .post-title, + .page-title, + .author-name, + .author-heading { + font-size: 30px; + line-height: 1.2; } + + .post-date, + .blog-description, + .author-meta { + line-height: 1.6; } + + .post-date, + .blog-description, + .author-meta { + margin-top: 10px; } + .post-date:after, .post-date:before, + .blog-description:after, + .blog-description:before, + .author-meta:after, + .author-meta:before { + margin-top: 20px; } + + .author-profile:after, .author-profile:before { + margin-top: 10px; } .post-container, - .post-list { + .post-list, + .author-profile { margin-right: 15px; - margin-left: 15px; } } + margin-left: 15px; } + + .author-avatar { + display: block; + margin: 0 auto 18px; } + + .author-meta span { + display: block; + margin: 18px 0; } + + .footer-copyright { + padding: 0 10px; } } diff --git a/assets/js/scripts.js b/assets/js/scripts.js index 01c2148..ee47bc6 100644 --- a/assets/js/scripts.js +++ b/assets/js/scripts.js @@ -79,10 +79,14 @@ jQuery(function($) { loading = false; showIndex = false; }); + }).fail(function() { + // Request fail + NProgress.done(); + location.reload(); }); }); - $('body').on('click', '.js-ajax-link, .pagination a, .post-tags a', function(e) { + $('body').on('click', '.js-ajax-link, .pagination a, .post-tags a, .post-header a', function(e) { e.preventDefault(); if (loading === false) { diff --git a/assets/sass/style.scss b/assets/sass/style.scss index b4beab7..0664a12 100644 --- a/assets/sass/style.scss +++ b/assets/sass/style.scss @@ -274,6 +274,9 @@ table { line-height: 1; margin: 25px 0 0; + a { color: #AEADAD; } + a:hover { color: $primary; } + &:after { border-bottom: 1px dotted $secondary; content: ""; @@ -414,6 +417,72 @@ table { } /* ============================================================ */ +/* Author */ +/* ============================================================ */ + +.author-profile { + margin: 0 40px; + + &:after { + border-bottom: 1px dotted $secondary; + content: ""; + display: block; + margin: 40px auto 0; + width: 100px; + } +} + +.author-heading { + margin: 15px auto; + text-align: center; + width: 100%; +} + +.author-avatar { + border-radius: 50px; + display: inline; + height: 50px; + margin: 5px 10px 0 0; + width: 50px; + vertical-align: middle; +} + +.author-name { + display: inline; + font-size: 52px; + font-weight: 700; + text-align: center; + text-transform: uppercase; + vertical-align: middle; +} + +.author-meta { + color: #AEADAD; + font-size: 14px; + font-weight: 600; + line-height: 1; + margin: 25px 0 0; + text-align: center; + text-transform: uppercase; + + span { + display: inline-block; + margin: 0 10px 8px; + } + + i { margin-right: 8px; } + + a { color: #AEADAD; } + a:hover { color: $primary; } +} + +.author-bio { + margin: 20px auto 0; + text-align: center; + max-width: 700px; +} + +/* ============================================================ */ /* Footer */ /* ============================================================ */ @@ -475,11 +544,58 @@ table { } @media only screen and (max-width: 600px) { + h1, h2 { margin-bottom: 20px; } + + p { margin-bottom: 20px; } + + ul, ol { margin-bottom: 20px; } + + img { margin: 30px 0; } + + blockquote { margin: 30px 0;} + + pre { margin: 30px 0; } + + hr { margin: 35px 0; } + + .site-header { + padding-top: 60px; + } + .site-nav-item { display: block; margin: 15px 0; } + .post-header { + margin-bottom: 35px; + padding-bottom: 45px; + } + + .post-title, + .page-title, + .author-name, + .author-heading { + font-size: 42px; + margin-top: 5px; + } + + .post-date, + .blog-description, + .author-meta { + margin-top: 20px; + + &:after, &:before { + margin-top: 30px; + } + } + + .author-profile { + &:after, &:before { + margin-top: 20px; + } + } + .post-stub-title { display: block; } .post-stub-date:before { @@ -487,14 +603,25 @@ table { display: block; } - .post-container, .post-list { + margin-top: 45px; + } + + .post-container, + .post-list, + .author-profile { margin-right: 25px; margin-left: 25px; } .post-tags { width: 100%; } + .post-stub a, + .post-stub a:hover { + padding-top: 12px; + padding-bottom: 12px; + } + .share { float: left; margin-top: 20px; @@ -503,14 +630,63 @@ table { margin: 0 5px 0 0; } } + + .footer { + margin-top: 50px; + } } @media only screen and (max-width: 400px) { - .post-title { font-size: 32px; } + .site-header { + padding-top: 40px; + } + + .post-title, + .page-title, + .author-name, + .author-heading { + font-size: 30px; + line-height: 1.2; + } + + .post-date, + .blog-description, + .author-meta { + line-height: 1.6; + } + + .post-date, + .blog-description, + .author-meta { + margin-top: 10px; + + &:after, &:before { + margin-top: 20px; + } + } + + .author-profile { + &:after, &:before { + margin-top: 10px; + } + } .post-container, - .post-list { + .post-list, + .author-profile { margin-right: 15px; margin-left: 15px; } -} + + .author-avatar { + display: block; + margin: 0 auto 18px; + } + + .author-meta span { + display: block; + margin: 18px 0; + } + + .footer-copyright { padding: 0 10px; } +}
\ No newline at end of file diff --git a/author.hbs b/author.hbs new file mode 100644 index 0000000..e162159 --- /dev/null +++ b/author.hbs @@ -0,0 +1,34 @@ +{{!< default}} + +<div class="container"> + <section class="author-profile"> + {{#author}} + <div class="author-heading"> + {{#if image}} + <img class="author-avatar" src="{{image}}" width="50" height="50" alt="{{name}}"> + {{/if}} + + <h1 class="author-name">{{name}}</h1> + </div> + + <div class="author-meta"> + <span><i class="fa fa-bar-chart-o"></i> {{plural ../pagination.total empty='No posts' singular='% post' plural='% posts'}}</span> + {{#if location}}<span><i class="fa fa-map-marker"></i>{{location}}</span>{{/if}} + {{#if website}}<span><i class="fa fa-link"></i><a href="{{website}}">{{website}}</a></span>{{/if}} + <span><i class="fa fa-rss-square"></i><a href="{{url}}rss/">{{name}}</a></span> + </div> + + {{#if bio}} + <p class="author-bio">{{bio}}</p> + {{/if}} + {{/author}} + </section> + + <ol class="post-list"> + {{> loop}} + </ol> + + <div class="post-navigation"> + {{pagination}} + </div> +</div>
\ No newline at end of file diff --git a/changelog.txt b/changelog.txt index d93443c..ac4fe55 100644 --- a/changelog.txt +++ b/changelog.txt @@ -1,4 +1,37 @@ ------------------------------ +Ghostwriter Version 1.9.1 +------------------------------ + +- Fixed navigation bug + +------------------------------ +Ghostwriter Version 1.9.0 +------------------------------ + +- Added support for Ghost 0.5.9 navigation feature + +------------------------------ +Ghostwriter Version 1.8.2 +------------------------------ + +- Fixed multiline code block indention + +------------------------------ +Ghostwriter Version 1.8.1 +------------------------------ + +- (postblue) Fixed author bio on smaller screens +- Improved author page display on smaller screens +- Fixed author avatar display + +------------------------------ +Ghostwriter Version 1.8.0 +------------------------------ + +- Added support for author pages +- Moved post loop into "loop" partial + +------------------------------ Ghostwriter Version 1.7.1 ------------------------------ diff --git a/default.hbs b/default.hbs index f61fd4f..b8f2d58 100644 --- a/default.hbs +++ b/default.hbs @@ -41,7 +41,8 @@ <ul class="site-nav"> <li class="site-nav-item"><a class="js-ajax-link" title="{{@blog.title}}" href="{{@blog.url}}">Latest Post</a></li> <li class="site-nav-item"><a class="js-ajax-link js-show-index" title="{{@blog.title}}" href="{{@blog.url}}">Browse Posts</a></li> - <li class="site-nav-item"><a class="js-ajax-link" title="About | {{@blog.title}}" href="{{@blog.url}}/about">About</a></li> + + {{navigation}} {{#if @blog.logo}} <li class="site-nav-item"><a href="{{@blog.url}}/rss">RSS</a></li> @@ -63,7 +64,7 @@ <a class="button-square button-jump-top js-jump-top" href="#"><i class="fa fa-angle-up"></i></a> </div> - <p class="footer-copyright">© {{date format="YYYY"}} / Published with <a href="http://tryghost.org">Ghost</a> / <a href="https://github.com/roryg/ghostwriter">Ghostwriter theme</a> By <a href="http://jollygoodthemes.com">JollyGoodThemes</a></p> + <p class="footer-copyright">© {{date format="YYYY"}} / Published with <a href="https://ghost.org">Ghost</a> / <a href="https://github.com/roryg/ghostwriter">Ghostwriter theme</a> By <a href="http://jollygoodthemes.com">JollyGoodThemes</a></p> </div> </footer> @@ -3,26 +3,15 @@ <div id="latest-post" class="container"> {{#foreach posts}} {{#if @first}} - {{> post-content}} +{{! No indention to prevent handlebars indenting <pre> tag content}} +{{> post-content}} {{/if}} {{/foreach}} </div> <div id="post-index" class="container"> <ol class="post-list"> - {{#foreach posts}} - <li class="post-stub {{post_class}}" > - <a class="js-ajax-link" title="{{title}} | {{@blog.title}}" href="{{url}}"> - <h4 class="post-stub-title">{{title}}</h4> - - <time class="post-stub-date" datetime="{{published_at}}">Published {{date format="MMMM Do YYYY"}}</time> - - {{#if featured}} - <span class="post-stub-tag">Featured</span> - {{/if}} - </a> - </li> - {{/foreach}} + {{> loop}} </ol> <div class="post-navigation"> diff --git a/package.json b/package.json index fca765e..26dd6d9 100644 --- a/package.json +++ b/package.json @@ -1,4 +1,4 @@ { "name": "Ghostwriter", - "version": "1.7.1" + "version": "1.9.1" }
\ No newline at end of file @@ -9,8 +9,13 @@ <p class="blog-description">{{@blog.description}}</p> </header> - <div class="post-content"> - {{{content}}} + <div class="post-content clearfix"> + {{#if image}} + <img class="post-featured-image" src="{{image}}"> + {{/if}} + +{{! No indention to prevent handlebars indenting <pre> tag content}} +{{{content}}} {{#if tags}} <p class="post-tags"><span>Tagged:</span> {{tags}}</p> @@ -18,4 +23,4 @@ </div> </article> {{/post}} -</div>
\ No newline at end of file +</div> diff --git a/partials/loop.hbs b/partials/loop.hbs new file mode 100644 index 0000000..cff6e39 --- /dev/null +++ b/partials/loop.hbs @@ -0,0 +1,13 @@ +{{#foreach posts}} + <li class="post-stub {{post_class}}" > + <a class="js-ajax-link" title="{{title}} | {{@blog.title}}" href="{{url}}"> + <h4 class="post-stub-title">{{title}}</h4> + + <time class="post-stub-date" datetime="{{published_at}}">Published {{date format="MMMM Do YYYY"}}</time> + + {{#if featured}} + <span class="post-stub-tag">Featured</span> + {{/if}} + </a> + </li> +{{/foreach}}
\ No newline at end of file diff --git a/partials/navigation.hbs b/partials/navigation.hbs new file mode 100644 index 0000000..ac8464d --- /dev/null +++ b/partials/navigation.hbs @@ -0,0 +1,3 @@ +{{#foreach navigation}} + <li class="site-nav-item"><a class="js-ajax-link" title="{{label}} | {{@blog.title}}" href="{{url absolute="true"}}">{{label}}</a></li> +{{/foreach}}
\ No newline at end of file diff --git a/partials/post-content.hbs b/partials/post-content.hbs index 6b4fa08..3f1c6ef 100644 --- a/partials/post-content.hbs +++ b/partials/post-content.hbs @@ -2,10 +2,14 @@ <header class="post-header"> <h1 class="post-title">{{title}}</h1> - <p class="post-date"><time datetime="{{published_at}}">Published {{date format="MMMM Do YYYY"}}</time></p> + <p class="post-date">Published <time datetime="{{published_at}}">{{date format="MMMM Do YYYY"}}</time> <strong>by {{author}}</strong></p> </header> <div class="post-content clearfix"> + {{#if image}} + <img class="post-featured-image" src="{{image}}"> + {{/if}} + {{{content}}} </div> @@ -2,6 +2,7 @@ <div class="container"> {{#post}} - {{> post-content}} +{{! No indention to prevent handlebars indenting <pre> tag content}} +{{> post-content}} {{/post}} </div>
\ No newline at end of file @@ -4,19 +4,7 @@ <h1 class="page-title">Posts tagged: {{tag.name}}</h1> <ol class="post-list"> - {{#foreach posts}} - <li class="post-stub {{post_class}}" > - <a class="js-ajax-link" title="{{title}} | {{@blog.title}}" href="{{url}}"> - <h4 class="post-stub-title">{{title}}</h4> - - <time class="post-stub-date" datetime="{{published_at}}">Published {{date format="MMMM Do YYYY"}}</time> - - {{#if featured}} - <span class="post-stub-tag">Featured</span> - {{/if}} - </a> - </li> - {{/foreach}} + {{> loop}} </ol> <div class="post-navigation"> |