ghost-manager 0.0.1 → 1.0.0

data/magneto/source/assets/stylesheets/interface/_variables.scss

@@ -0,0 +1,156 @@
+// Colors
+$off-white: #f1f1f1;
+$gray: #ccc;
+$light-blue: #3598dc;
+$light-green: #2ab292;
+$light-gray: #999;
+$medium-gray: #666;
+$dark-gray: #333;
+$dark-blue: #22313F;
+$green: #3FC380;
+$red: #D24D57;
+$yellow: #f1c205;
+$orange: #f08a24;
+
+// Backgrounds
+$body-background-color: white;
+
+
+// Typography
+$base-font-size: 16px;
+$base-small-font-size: 15px;
+$base-line-height: 24px;
+
+$ms-base: $base-font-size;
+$ms-small-base: $base-small-font-size;
+
+$ms-ratio: $augmented-fourth;
+$ms-small-ratio: $major-third;
+
+$ms-up-3: ms(4);
+$ms-up-2: ms(3);
+$ms-up-1: ms(2);
+$ms-up:   ms(1);
+$ms-0: $ms-base;
+$ms-down: ms(-1);
+
+$ms-small-up-3: ms(4, $ms-base, $ms-small-ratio);
+$ms-small-up-2: ms(3, $ms-base, $ms-small-ratio);
+$ms-small-up-1: ms(2, $ms-base, $ms-small-ratio);
+$ms-small-up:   ms(1, $ms-base, $ms-small-ratio);
+$ms-0: $ms-base;
+$ms-small-down:  ms(-1);
+
+$font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
+$font-weight: normal;
+$font-color: $medium-gray;
+$header-font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
+$header-font-weight: normal;
+$header-font-color: $dark-gray;
+
+
+// Buttons
+$button-font-size: rem-calc(14);
+$button-font-weight: $font-weight;
+$button-background-color: $light-green;
+$button-background-color-hover: scale_color($button-background-color, $lightness: -20%);
+$button-border: none;
+$button-border-color: none;
+$button-border-color-hover: none;
+$button-color: white;
+$button-color-hover: white;
+
+
+// Links
+$link-color: $light-blue;
+$link-color-hover: scale_color($link-color, $lightness: -20%);
+$link-color-active: $dark-blue;
+
+
+// Forms
+$label-weight: 200;
+$label-color: $dark-gray;
+$form-color: $medium-gray;
+$form-background-color: white;
+$form-background-color-focus: $off-white;
+$form-box-shadow: none;
+$form-border-color: #ccc;
+$form-border-color-hover: scale_color($form-border-color, $lightness: -20%);
+$placeholder-text-color: $light-gray;
+
+
+// Tables
+$table-header-color: $dark-gray;
+$table-color: $medium-gray;
+$table-odd-background-color: white;
+$table-even-background-color: $light-gray;
+
+
+// Lists
+$list-item-background-color: white;
+$list-item-background-color-odd: scale_color($list-item-background-color, $lightness: -3%);
+
+
+// Borders
+$round-edges: rem-calc(5);
+$border-color: $light-green;
+
+
+// Flashes
+$alert-background-color: $red;
+$alert-border-color: $alert-background-color;
+$success-background-color: $green;
+$success-border-color: $success-background-color;
+$warning-background-color: $orange;
+$warning-border-color: $warning-background-color;
+$close-color: white;
+
+
+// States
+$state-color: white;
+$state-green-background-color: $green;
+$state-yellow-background-color: $yellow;
+$state-red-background-color: $red;
+
+
+// Icons
+$icon-color: $gray;
+$icon-color-hover: scale_color($icon-color, $lightness: -20%);
+
+
+// Navigations
+$use-sidebar: false;
+$use-thin-sidebar: true;
+
+$sidebar-width: rem-calc(260);
+$sidebar-background-color: $dark-blue;
+$sidebar-color: white;
+$sidebar-color-hover: scale_color($sidebar-color, $lightness: -20%);
+$sidebar-color-active: scale_color($sidebar-color, $lightness: -30%);
+
+$thin-icon-font-size: rem-calc(21);
+$thin-sidebar-width: rem-calc(80);
+$thin-sidebar-background-color: $dark-blue;
+$thin-sidebar-color: white;
+$thin-sidebar-color-hover: scale_color($thin-sidebar-color, $lightness: -20%);
+$thin-sidebar-color-active: scale_color($thin-sidebar-color, $lightness: -30%);
+
+$topbar-background-color: $dark-blue;
+$topbar-color: white;
+$topbar-color-hover: scale_color($topbar-color, $lightness: -20%);
+$topbar-color-active: scale_color($thin-sidebar-color, $lightness: -30%);
+
+
+// Plans
+$plan-title-font-size: $ms-up;
+$plan-price-font-size: $ms-up-3;
+$plan-background-color: $dark-blue;
+$plan-title-background-color: $dark-blue;
+$plan-price-background-color: scale_color($plan-background-color, $lightness: 5%);
+$plan-color: white;
+
+
+// Dropdowns
+$dropdown-background-color: $dark-blue;
+$dropdown-color: white;
+$dropdown-color-hover: scale_color($dropdown-color, $lightness: -20%);

data/magneto/source/assets/stylesheets/interface/navigations/_navigations.scss

@@ -0,0 +1,16 @@
+@import 'sidebar';
+@import 'thin_sidebar';
+@import 'top_bar';
+
+
+// Remove padding-left when sidebars not visible
+@media only screen and (min-width: 1024px) {
+  main {
+    @if $use-sidebar == true {
+        padding-left: $sidebar-width;
+    }
+    @if $use-thin-sidebar == true {
+        padding-left: $thin-sidebar-width;
+    }
+  }
+}

data/magneto/source/assets/stylesheets/interface/navigations/_sidebar.scss

@@ -0,0 +1,53 @@
+// Sidebar
+%sidebar {
+  position: fixed;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  width: $sidebar-width;
+  background: $sidebar-background-color;
+  overflow-y: auto;
+  z-index: 100;
+}
+
+nav.sidebar-container {
+  @media only screen and (max-width: 1024px) {
+    & {
+      display: none;
+    }
+  }
+}
+
+.sidebar {
+  @extend %sidebar;
+
+  li {
+    font-size: $ms-base;
+    font-family: $font-family;
+    font-weight: $font-weight;
+    color: $font-color;
+
+    &:hover {
+      background-color: scale_color($sidebar-background-color, $lightness: 3%) ;
+    }
+
+    &.active {
+      background-color: scale_color($sidebar-background-color, $lightness: 3%);
+    }
+
+    a {
+      margin: 0;
+      padding: 1.5em 1.5em;
+      display: block;
+      color: $sidebar-color;
+
+      &:hover {
+        color: $sidebar-color-hover;
+      }
+
+      &.active {
+        color: $sidebar-color-active;
+      }
+    }
+  }
+}

data/magneto/source/assets/stylesheets/interface/navigations/_thin_sidebar.scss

@@ -0,0 +1,50 @@
+// Thin Sidebar
+%thin-sidebar  {
+  position: fixed;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  width: $thin-sidebar-width;
+  background: $thin-sidebar-background-color;
+  overflow-y: auto;
+  z-index: 100;
+}
+
+nav.thin-sidebar-container {
+  @media only screen and (max-width: 1024px) {
+    & {
+      display: none;
+    }
+  }
+}
+
+.thin-sidebar {
+  @extend %thin-sidebar;
+
+  li {
+
+    &:hover {
+      background-color: scale_color($thin-sidebar-background-color, $lightness: 5%);
+    }
+
+    &.active {
+      background-color: scale_color($thin-sidebar-background-color, $lightness: 5%);
+    }
+
+    i {
+      padding: 1.2em 1em;
+      display: block;
+      font-size: $thin-icon-font-size;
+      color: $thin-sidebar-color;
+      text-align: center;
+
+      &:hover {
+        color: $thin-sidebar-color-hover;
+      }
+
+      &.active {
+        color: $thin-sidebar-color-active;
+      }
+    }
+  }
+}

data/magneto/source/assets/stylesheets/interface/navigations/_top_bar.scss

@@ -0,0 +1,60 @@
+// Top bar
+nav.top-bar-container {
+  padding: 1.5em;
+  color: $topbar-color;
+  background-color: $topbar-background-color;
+
+  .top-bar {
+    display: inline-block;
+    position: relative;
+    overflow: visible;
+    cursor: pointer;
+    float: right;
+    z-index: 100;
+  }
+}
+
+// Hoverable area for dropdown
+.hover-menu {
+  @extend %drop-down;
+
+  i {
+    padding: 0 0.5em;
+    color: $topbar-color;
+  }
+
+  &:hover {
+    i {
+      color: $topbar-color-hover;
+    }
+
+    .hover-menu-list {
+      padding-top: 2em;
+      display: block;
+      top: 1.25em;
+      right: 0;
+    }
+  }
+
+  li {
+    width: 14rem;
+    color: $topbar-color;
+    background-color: $topbar-background-color;
+
+    &:hover {
+      color: $topbar-color-hover;
+      background-color: scale_color($topbar-background-color, $lightness: 5%);
+    }
+  }
+}
+
+// Dropdown list
+.hover-menu-list {
+  @extend %drop-down-list;
+
+  a {
+    padding: 0.5em;
+    display: block;
+    color: $topbar-color;
+  }
+}

data/magneto/source/author.hbs

@@ -0,0 +1,41 @@
+{{!< default}}
+{{! The tag above means - insert everything in this file into the {body} of the default.hbs template }}
+
+{{! The big featured header }}
+
+{{! Everything inside the #author tags pulls data from the author }}
+{{#author}}
+    <header class="main-header author-head {{#if cover}}" style="background-image: url({{cover}}){{else}}no-cover{{/if}}">
+        <nav class="main-nav overlay clearfix">
+            {{#if @blog.logo}}<a class="blog-logo" href="{{@blog.url}}"><img src="{{@blog.logo}}" alt="{{@blog.title}}" /></a>{{/if}}
+            {{#if @blog.navigation}}
+                <a class="menu-button icon-menu" href="#"><span class="word">Menu</span></a>
+            {{/if}}
+        </nav>
+    </header>
+
+    <section class="author-profile inner">
+        {{#if image}}
+        <figure class="author-image">
+            <div class="img" style="background-image: url({{image}})"><span class="hidden">{{name}}'s Picture</span></div>
+        </figure>
+        {{/if}}
+        <h1 class="author-title">{{name}}</h1>
+        {{#if bio}}
+            <h2 class="author-bio">{{bio}}</h2>
+        {{/if}}
+        <div class="author-meta">
+            {{#if location}}<span class="author-location icon-location">{{location}}</span>{{/if}}
+            {{#if website}}<span class="author-link icon-link"><a href="{{website}}">{{website}}</a></span>{{/if}}
+            <span class="author-stats"><i class="icon-stats"></i> {{plural ../pagination.total empty='No posts' singular='% post' plural='% posts'}}</span>
+        </div>
+    </section>
+{{/author}}
+
+{{! The main content area on the homepage }}
+<main class="content" role="main">
+
+    {{! The tag below includes the post loop - partials/loop.hbs }}
+    {{> "loop"}}
+
+</main>

data/magneto/source/default.hbs

@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html>
+  <head>
+      {{! Document Settings }}
+      <meta charset="utf-8" />
+      <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+
+      {{! Page Meta }}
+      <title>{{meta_title}}</title>
+      <meta name="description" content="{{meta_description}}" />
+
+      <meta name="HandheldFriendly" content="True" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
+      <link rel="shortcut icon" href="{{asset "favicon.ico"}}">
+
+      {{! Styles'n'Scripts }}
+      <link rel="stylesheet" type="text/css" href="{{asset "stylesheets/application.css"}}" />
+
+      {{! Ghost outputs important style and meta data with this tag }}
+      {{ghost_head}}
+  </head>
+  <body class="{{body_class}} nav-closed">
+
+      {{navigation}}
+
+      <div class="site-wrapper">
+
+          {{! Everything else gets inserted here }}
+          {{{body}}}
+
+          <footer class="site-footer clearfix">
+              <section class="copyright"><a href="{{@blog.url}}">{{@blog.title}}</a> &copy; {{date format="YYYY"}}</section>
+              <section class="poweredby">Proudly published with <a href="https://ghost.org">Ghost</a></section>
+          </footer>
+
+      </div>
+
+      {{! Ghost outputs important scripts and data with this tag }}
+      {{ghost_foot}}
+
+      
+
+      <script type="text/javascript" src="{{asset "javascripts/application.js"}}"
+  </body>
+</html>

data/magneto/source/index.hbs

@@ -0,0 +1,27 @@
+{{!< default}}
+{{! The tag above means - insert everything in this file into the {body} of the default.hbs template }}
+
+{{! The big featured header }}
+<header class="main-header {{#if @blog.cover}}" style="background-image: url({{@blog.cover}}){{else}}no-cover{{/if}}">
+    <nav class="main-nav overlay clearfix">
+        {{#if @blog.logo}}<a class="blog-logo" href="{{@blog.url}}"><img src="{{@blog.logo}}" alt="{{@blog.title}}" /></a>{{/if}}
+        {{#if @blog.navigation}}
+            <a class="menu-button icon-menu" href="#"><span class="word">Menu</span></a>
+        {{/if}}
+    </nav>
+    <div class="vertical">
+        <div class="main-header-content inner">
+            <h1 class="page-title">{{@blog.title}}</h1>
+            <h2 class="page-description">{{@blog.description}}</h2>
+        </div>
+    </div>
+    <a class="scroll-down icon-arrow-left" href="#content" data-offset="-45"><span class="hidden">Scroll Down</span></a>
+</header>
+
+{{! The main content area on the homepage }}
+<main id="content" class="content" role="main">
+
+    {{! The tag below includes the post loop - partials/loop.hbs }}
+    {{> "loop"}}
+
+</main>

data/magneto/source/page.hbs

@@ -0,0 +1,31 @@
+{{!< default}}
+
+{{! This is a page template. A page outputs content just like any other post, and has all the same
+    attributes by default, but you can also customise it to behave differently if you prefer. }}
+
+{{! Everything inside the #post tags pulls data from the page }}
+{{#post}}
+
+<header class="main-header post-head {{#if image}}" style="background-image: url({{image}}){{else}}no-cover{{/if}}">
+    <nav class="main-nav {{#if image}}overlay{{/if}} clearfix">
+        {{#if @blog.logo}}<a class="blog-logo" href="{{@blog.url}}"><img src="{{@blog.logo}}" alt="{{@blog.title}}" /></a>{{/if}}
+        {{#if @blog.navigation}}
+            <a class="menu-button icon-menu" href="#"><span class="word">Menu</span></a>
+        {{/if}}
+    </nav>
+</header>
+
+<main class="content" role="main">
+    <article class="{{post_class}}">
+
+        <header class="post-header">
+            <h1 class="post-title">{{title}}</h1>
+        </header>
+
+        <section class="post-content">
+            {{content}}
+        </section>
+
+    </article>
+</main>
+{{/post}}

data/magneto/source/partials/loop.hbs

@@ -0,0 +1,25 @@
+{{! Previous/next page links - only displayed on page 2+ }}
+<div class="extra-pagination inner">
+    {{pagination}}
+</div>
+
+{{! This is the post loop - each post will be output using this markup }}
+{{#foreach posts}}
+<article class="{{post_class}}">
+    <header class="post-header">
+        <h2 class="post-title"><a href="{{url}}">{{{title}}}</a></h2>
+    </header>
+    <section class="post-excerpt">
+        <p>{{excerpt words="26"}} <a class="read-more" href="{{url}}">&raquo;</a></p>
+    </section>
+    <footer class="post-meta">
+        {{#if author.image}}<img class="author-thumb" src="{{author.image}}" alt="{{author.name}}" nopin="nopin" />{{/if}}
+        {{author}}
+        {{tags prefix=" on "}}
+        <time class="post-date" datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMMM YYYY"}}</time>
+    </footer>
+</article>
+{{/foreach}}
+
+{{! Previous/next page links - displayed on every page }}
+{{pagination}}

data/magneto/source/partials/navigation.hbs

@@ -0,0 +1,13 @@
+<div class="nav">
+    <h3 class="nav-title">Menu</h3>
+    <a href="#" class="nav-close">
+        <span class="hidden">Close</span>
+    </a>
+    <ul>
+        {{#foreach navigation}}
+            <li class="nav-{{slug}}{{#if current}} nav-current{{/if}}" role="presentation"><a href="{{url absolute="true"}}">{{label}}</a></li>
+        {{/foreach}}
+    </ul>
+    <a class="subscribe-button icon-feed" href="{{@blog.url}}/rss/">Subscribe</a>
+</div>
+<span class="nav-cover"></span>

data/magneto/source/post.hbs

@@ -0,0 +1,99 @@
+{{!< default}}
+
+{{! The comment above "< default" means - insert everything in this file into
+    the {body} of the default.hbs template, which contains our header/footer. }}
+
+{{! Everything inside the #post tags pulls data from the post }}
+{{#post}}
+
+<header class="main-header post-head {{#if image}}" style="background-image: url({{image}}){{else}}no-cover{{/if}}">
+    <nav class="main-nav {{#if image}}overlay{{/if}} clearfix">
+        {{#if @blog.logo}}<a class="blog-logo" href="{{@blog.url}}"><img src="{{@blog.logo}}" alt="{{@blog.title}}" /></a>{{/if}}
+        {{#if @blog.navigation}}
+            <a class="menu-button icon-menu" href="#"><span class="word">Menu</span></a>
+        {{/if}}
+    </nav>
+</header>
+
+<main class="content" role="main">
+    <article class="{{post_class}}">
+
+        <header class="post-header">
+            <h1 class="post-title">{{title}}</h1>
+            <section class="post-meta">
+                <time class="post-date" datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMMM YYYY"}}</time> {{tags prefix=" on "}}
+            </section>
+        </header>
+
+        <section class="post-content">
+            {{content}}
+        </section>
+
+        <footer class="post-footer">
+
+        {{! Everything inside the #author tags pulls data from the author }}
+        {{#author}}
+
+            {{#if image}}
+            <figure class="author-image">
+                <a class="img" href="{{url}}" style="background-image: url({{image}})"><span class="hidden">{{name}}'s Picture</span></a>
+            </figure>
+            {{/if}}
+
+            <section class="author">
+                <h4><a href="{{url}}">{{name}}</a></h4>
+
+                {{#if bio}}
+                    <p>{{bio}}</p>
+                {{else}}
+                    <p>Read <a href="{{url}}">more posts</a> by this author.</p>
+                {{/if}}
+                <div class="author-meta">
+                    {{#if location}}<span class="author-location icon-location">{{location}}</span>{{/if}}
+                    {{#if website}}<span class="author-link icon-link"><a href="{{website}}">{{website}}</a></span>{{/if}}
+                </div>
+            </section>
+
+        {{/author}}
+
+            <section class="share">
+                <h4>Share this post</h4>
+                <a class="icon-twitter" href="https://twitter.com/intent/tweet?text={{encode title}}&amp;url={{url absolute="true"}}"
+                    onclick="window.open(this.href, 'twitter-share', 'width=550,height=235');return false;">
+                    <span class="hidden">Twitter</span>
+                </a>
+                <a class="icon-facebook" href="https://www.facebook.com/sharer/sharer.php?u={{url absolute="true"}}"
+                    onclick="window.open(this.href, 'facebook-share','width=580,height=296');return false;">
+                    <span class="hidden">Facebook</span>
+                </a>
+                <a class="icon-google-plus" href="https://plus.google.com/share?url={{url absolute="true"}}"
+                   onclick="window.open(this.href, 'google-plus-share', 'width=490,height=530');return false;">
+                    <span class="hidden">Google+</span>
+                </a>
+            </section>
+
+        </footer>
+
+    </article>
+</main>
+
+<aside class="read-next">
+    {{#next_post}}
+    <a class="read-next-story {{#if image}}" style="background-image: url({{image}}){{else}}no-cover{{/if}}" href="{{url}}">
+        <section class="post">
+            <h2>{{title}}</h2>
+            <p>{{excerpt words="19"}}&hellip;</p>
+        </section>
+    </a>
+    {{/next_post}}
+    {{#prev_post}}
+    <a class="read-next-story prev {{#if image}}" style="background-image: url({{image}}){{else}}no-cover{{/if}}" href="{{url}}">
+        <section class="post">
+            <h2>{{title}}</h2>
+            <p>{{excerpt words="19"}}&hellip;</p>
+        </section>
+    </a>
+    {{/prev_post}}
+</aside>
+
+{{/post}}

data/magneto/source/tag.hbs

@@ -0,0 +1,32 @@
+{{!< default}}
+{{! The tag above means - insert everything in this file into the {body} of the default.hbs template }}
+
+{{! If we have a tag cover, display that - else blog cover - else nothing }}
+<header class="main-header tag-head {{#if tag.image}}" style="background-image: url({{tag.image}}){{else}}{{#if @blog.cover}}" style="background-image: url({{@blog.cover}}){{else}}no-cover{{/if}}{{/if}}">
+    <nav class="main-nav overlay clearfix">
+        {{#if @blog.logo}}<a class="blog-logo" href="{{@blog.url}}"><img src="{{@blog.logo}}" alt="{{@blog.title}}" /></a>{{/if}}
+        {{#if @blog.navigation}}
+            <a class="menu-button icon-menu" href="#"><span class="word">Menu</span></a>
+        {{/if}}
+    </nav>
+    <div class="vertical">
+        <div class="main-header-content inner">
+            <h1 class="page-title">{{tag.name}}</h1>
+            <h2 class="page-description">
+                {{#if tag.description}}
+                    {{tag.description}}
+                {{else}}
+                    A {{pagination.total}}-post collection
+                {{/if}}
+            </h2>
+        </div>
+    </div>
+</header>
+
+{{! The main content area on the homepage }}
+<main class="content" role="main">
+
+    {{! The tag below includes the post loop - partials/loop.hbs }}
+    {{> "loop"}}
+
+</main>