├── .gitignore
├── README.md
├── img
    ├── screenshots
    │   ├── blank.png
    │   ├── bootstrap-blog.png
    │   ├── bootstrap-starter.png
    │   ├── bulma-basic.png
    │   ├── bulma-blog.png
    │   ├── foundation-blog-simple.png
    │   ├── foundation-blog.png
    │   ├── medium-dark.png
    │   ├── medium-light.png
    │   ├── poole.png
    │   ├── pure-blog.png
    │   └── skeleton.png
    ├── themes.png
    └── white-blocks.png
├── index.html
├── js
    └── cms.js
└── templates
    ├── blank.html
    ├── bootstrap-blog.html
    ├── bootstrap-starter.html
    ├── bulma-basic.html
    ├── bulma-blog.html
    ├── css
        ├── animations.css
        ├── bootstrap-blog.css
        ├── bootstrap-starter.css
        ├── bulma-blog.css
        ├── medium-dark.css
        ├── medium-light.css
        ├── poole.min.css
        ├── poole.overrides.min.css
        └── pure-blog.css
    ├── foundation-blog-simple.html
    ├── foundation-blog.html
    ├── layouts
        ├── blank
        │   ├── error.html
        │   ├── page-list.html
        │   ├── page.html
        │   ├── post-list.html
        │   └── post.html
        ├── bootstrap-blog
        │   ├── error.html
        │   ├── page-list.html
        │   ├── page.html
        │   ├── post-list.html
        │   └── post.html
        ├── bootstrap-starter
        │   ├── error.html
        │   ├── page-list.html
        │   ├── page.html
        │   ├── post-list.html
        │   └── post.html
        ├── bulma-basic
        │   ├── error.html
        │   ├── page-list.html
        │   ├── page.html
        │   ├── post-list.html
        │   └── post.html
        ├── bulma-blog
        │   ├── error.html
        │   ├── page-list.html
        │   ├── page.html
        │   ├── post-list.html
        │   └── post.html
        ├── foundation-blog
        │   ├── error.html
        │   ├── page-list.html
        │   ├── page.html
        │   ├── post-list.html
        │   └── post.html
        ├── medium
        │   ├── error.html
        │   ├── page-list.html
        │   ├── page.html
        │   ├── post-list.html
        │   └── post.html
        ├── poole
        │   ├── error.html
        │   ├── page-list.html
        │   ├── page.html
        │   ├── post-list.html
        │   └── post.html
        ├── pure-blog
        │   ├── error.html
        │   ├── page-list.html
        │   ├── page.html
        │   ├── post-list.html
        │   └── post.html
        └── skeleton
        │   ├── error.html
        │   ├── page-list.html
        │   ├── page.html
        │   ├── post-list.html
        │   └── post.html
    ├── medium-dark.html
    ├── medium-light.html
    ├── pages
        ├── .htaccess
        ├── about.md
        └── links.md
    ├── poole.html
    ├── posts
        ├── .htaccess
        ├── 2015-05-10-new-feature.md
        ├── 2017-08-20-another-example-post.md
        └── 2018-03-01-sample-blog-post.md
    ├── pure-blog.html
    └── skeleton.html


/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | node_modules/*
3 | release/*
4 | *.swp


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | ## CMS.js Themes
 2 | 
 3 | Try out CMS.js with a variety of popular CSS frameworks such as Bootstrap, Foundation, and Bulma. Check out all the themes [available here](https://chrisdiana.github.io/cms.js-themes).
 4 | 
 5 | ![CMS.js Themes](./img/themes.png)
 6 | 
 7 | 
 8 | ## Learn more about CMS.js
 9 | 
10 | * Visit the [CMS.js repo](https://github.com/chrisdiana/cms.js) to learn more
11 | 
12 | ## Contributing
13 | 
14 | All forms of contribution are welcome: new themes, bug fixes, pull requests and simple suggestions. Thanks!
15 | 


--------------------------------------------------------------------------------
/img/screenshots/blank.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chrisdiana/cms.js-themes/1b390c7b98912e9a28f4a7046160ee2fb67a2a77/img/screenshots/blank.png


--------------------------------------------------------------------------------
/img/screenshots/bootstrap-blog.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chrisdiana/cms.js-themes/1b390c7b98912e9a28f4a7046160ee2fb67a2a77/img/screenshots/bootstrap-blog.png


--------------------------------------------------------------------------------
/img/screenshots/bootstrap-starter.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chrisdiana/cms.js-themes/1b390c7b98912e9a28f4a7046160ee2fb67a2a77/img/screenshots/bootstrap-starter.png


--------------------------------------------------------------------------------
/img/screenshots/bulma-basic.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chrisdiana/cms.js-themes/1b390c7b98912e9a28f4a7046160ee2fb67a2a77/img/screenshots/bulma-basic.png


--------------------------------------------------------------------------------
/img/screenshots/bulma-blog.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chrisdiana/cms.js-themes/1b390c7b98912e9a28f4a7046160ee2fb67a2a77/img/screenshots/bulma-blog.png


--------------------------------------------------------------------------------
/img/screenshots/foundation-blog-simple.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chrisdiana/cms.js-themes/1b390c7b98912e9a28f4a7046160ee2fb67a2a77/img/screenshots/foundation-blog-simple.png


--------------------------------------------------------------------------------
/img/screenshots/foundation-blog.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chrisdiana/cms.js-themes/1b390c7b98912e9a28f4a7046160ee2fb67a2a77/img/screenshots/foundation-blog.png


--------------------------------------------------------------------------------
/img/screenshots/medium-dark.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chrisdiana/cms.js-themes/1b390c7b98912e9a28f4a7046160ee2fb67a2a77/img/screenshots/medium-dark.png


--------------------------------------------------------------------------------
/img/screenshots/medium-light.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chrisdiana/cms.js-themes/1b390c7b98912e9a28f4a7046160ee2fb67a2a77/img/screenshots/medium-light.png


--------------------------------------------------------------------------------
/img/screenshots/poole.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chrisdiana/cms.js-themes/1b390c7b98912e9a28f4a7046160ee2fb67a2a77/img/screenshots/poole.png


--------------------------------------------------------------------------------
/img/screenshots/pure-blog.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chrisdiana/cms.js-themes/1b390c7b98912e9a28f4a7046160ee2fb67a2a77/img/screenshots/pure-blog.png


--------------------------------------------------------------------------------
/img/screenshots/skeleton.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chrisdiana/cms.js-themes/1b390c7b98912e9a28f4a7046160ee2fb67a2a77/img/screenshots/skeleton.png


--------------------------------------------------------------------------------
/img/themes.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chrisdiana/cms.js-themes/1b390c7b98912e9a28f4a7046160ee2fb67a2a77/img/themes.png


--------------------------------------------------------------------------------
/img/white-blocks.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chrisdiana/cms.js-themes/1b390c7b98912e9a28f4a7046160ee2fb67a2a77/img/white-blocks.png


--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html>
  3 |   <head>
  4 |     <meta charset="utf-8">
  5 |     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6 |     <meta name="viewport" content="width=device-width, initial-scale=1">
  7 |     <title>Free CMS.js Themes & Templates</title>
  8 |     <link rel="shortcut icon" href="https://raw.githubusercontent.com/chrisdiana/cms.js/gh-pages/img/favicon.ico" type="image/x-icon">
  9 |     <meta name="description" content="Free bulma templates">
 10 |     <link href="//fonts.googleapis.com/css?family=Open+Sans:400,300,700" rel="stylesheet">
 11 |     <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.min.css" />
 12 |     <link rel="stylesheet" href="//use.fontawesome.com/releases/v5.4.1/css/all.css" integrity="sha384-5sAR7xN1Nv6T6+dT2mhtzEpVJvfS3NScPQTrOxhwjIuvcA67KV2R5Jz6kr4abQsz" crossorigin="anonymous">
 13 |     <style>
 14 |     </style>
 15 |   </head>
 16 |   <body>
 17 |     <section class="hero" style="background:#00D0F8">
 18 |       <div class="hero-body">
 19 |         <div class="container has-text-centered">
 20 |           <img class="is-horizontal-center" style="height: 25px;margin-bottom: 5px;" src="img/white-blocks.png"/>
 21 |           <h1 class="title has-text-white-bis has-text-weight-light">
 22 |             Free CMS.js Themes
 23 |           </h1>
 24 |           <h2 class="subtitle has-text-white-ter has-text-weight-light">
 25 |             Themes & templates with popular CSS  <br> frameworks using 
 26 |               <a style="color:#fff;" href="https://github.com/chrisdiana/cms.js">CMS.js</a>
 27 |           </h2>
 28 |           <a class="github-button" href="https://github.com/chrisdiana/cms.js-themes" data-size="large" aria-label="View chrisdiana/cms.js-themes on GitHub">View on Github</a>
 29 |           <a class="github-button" href="https://github.com/chrisdiana/cms.js-themes" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star chrisdiana/cms.js-themes on GitHub">Star</a>
 30 |           <a class="github-button" href="https://github.com/chrisdiana/cms.js-themes/fork" data-size="large" data-show-count="true" aria-label="Fork chrisdiana/cms.js-themes on GitHub">Fork</a>
 31 |         </div>
 32 |       </div>
 33 |       </div>
 34 |     </section>
 35 |     <br />
 36 |     <div id="main" class="container content-wrapper">
 37 |       <div class="columns is-multiline">
 38 | 
 39 |         <!-- Themes -->
 40 |         <div v-for="theme in themes" class="column is-4">
 41 |           <div class="card">
 42 |             <header class="card-header">
 43 |               <p class="card-header-title">
 44 |                 <span>{{ theme.name }}</span>
 45 |               </p>
 46 |             </header>
 47 |             <div class="card-content">
 48 |               <figure class="image">
 49 |                 <img v-bind:src="'./img/screenshots/' + theme.reference + '.png'">
 50 |               </figure>
 51 |             </div>
 52 |             <footer class="card-footer">
 53 |               <a target="_blank" v-bind:href="'./templates/' + theme.reference +'.html'" class="card-footer-item">Preview</a>
 54 |               <a target="_blank" v-bind:href="'https://github.com/chrisdiana/cms.js-themes/blob/master/templates/' + theme.reference +'.html'" class="card-footer-item">Source Code</a>
 55 |             </footer>
 56 |           </div>
 57 |         </div>
 58 | 
 59 |         <!-- coming soon -->
 60 |         <div class="column">
 61 |           <center>
 62 |             <div class="box">
 63 |               <p class="has-text-centered">More themes coming soon!</p>
 64 |             </div>
 65 |           </center>
 66 |         </div>
 67 |       </div>
 68 |     </div>
 69 | 
 70 |     <footer class="footer">
 71 |       <div class="container">
 72 |         <div class="content has-text-centered">
 73 |           <p>
 74 |             <strong>CMS.js Themes</strong> by <a href="https://github.com/chrisdiana">Chris Diana</a> and <a href="https://github.com/chrisdiana/cms.js-themes/graphs/contributors">many</a> contributors.
 75 |             Source code is licensed
 76 |             <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.<br>
 77 |             This theme inspired by <a href="https://github.com/dansup/bulma-templates">Bulma Templates</a>. 
 78 |             Thanks <a href="https://github.com/dansup">dansup</a>! 
 79 |           </p>
 80 |           <p>
 81 |             <a class="icon" href="https://github.com/chrisdiana/cms.js-themes">
 82 |               <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0 0 16 8c0-4.42-3.58-8-8-8z"/></svg>
 83 |             </a>
 84 |           </p>
 85 |         </div>
 86 |       </div>
 87 |     </footer>
 88 |     <script async defer src="https://buttons.github.io/buttons.js"></script>
 89 |     <script src="https://cdn.jsdelivr.net/npm/vue"></script>
 90 |     <script>
 91 |       new Vue({
 92 |         el: '#main',
 93 |         data: {
 94 |           themes: [
 95 |             { name: 'Blank', reference: 'blank' },
 96 |             { name: 'Bootstrap Blog', reference: 'bootstrap-blog' },
 97 |             { name: 'Bootstrap Starter', reference: 'bootstrap-starter' },
 98 |             { name: 'Bulma Basic', reference: 'bulma-basic' },
 99 |             { name: 'Bulma Blog', reference: 'bulma-blog' },
100 |             { name: 'Foundation Blog Simple', reference: 'foundation-blog-simple' },
101 |             { name: 'Foundation Blog Sidebar', reference: 'foundation-blog' },
102 |             { name: 'Medium Dark', reference: 'medium-dark' },
103 |             { name: 'Medium Light', reference: 'medium-light' },
104 |             { name: 'Poole', reference: 'poole' },
105 |             { name: 'Pure CSS Blog', reference: 'pure-blog' },
106 |             { name: 'Skeleton CSS', reference: 'skeleton' },
107 |           ],
108 |         }
109 |       });
110 |     </script>
111 |   </body>
112 | </html>


--------------------------------------------------------------------------------
/js/cms.js:
--------------------------------------------------------------------------------
1 | /*! CMS.js v2.0.0 | MIT (c) 2018 Chris Diana | https://github.com/chrisdiana/cms.js */
2 | var CMS=function(o){"use strict";var n,e;this.ready=!1,this.routes={},this.collections={};var i={elementId:null,layoutDirectory:null,defaultView:null,errorLayout:null,mode:"SERVER",github:null,types:[],plugins:[],frontMatterSeperator:"---",listAttributes:["tags"],dateParser:/\d{4}-\d{2}(?:-\d{2})?/,extension:".md",sort:void 0,markdownEngine:null,debug:!(this.filteredCollections={}),messageClassName:"cms-messages",onload:function(){},onroute:function(){}},r='ERROR: No element ID or ID incorrect. Check "elementId" parameter in config.',s="ERROR: Error getting files. Make sure there is a directory for each type in config with files in it.",l="ERROR: Error getting the file",a="ERROR: Error loading layout. Check the layout file to make sure it exists.",c="WARNING: Not ready to perform action";function u(){this.rules=[{regex:/(#+)(.*)/g,replacement:function(t,e,n){var i=e.length;return"<h"+i+">"+n.trim()+"</h"+i+">"}},{regex:/!\[([^[]+)\]\(([^)]+)\)/g,replacement:"<img src='$2' alt='$1'>"},{regex:/\[([^[]+)\]\(([^)]+)\)/g,replacement:"<a href='$2'>$1</a>"},{regex:/(\*\*|__)(.*?)\1/g,replacement:"<strong>$2</strong>"},{regex:/(\*|_)(.*?)\1/g,replacement:"<em>$2</em>"},{regex:/~~(.*?)~~/g,replacement:"<del>$1</del>"},{regex:/:"(.*?)":/g,replacement:"<q>$1</q>"},{regex:/```[a-z]*\n[\s\S]*?\n```/g,replacement:function(t){return"<pre>"+(t=t.replace(/```/gm,"")).trim()+"</pre>"}},{regex:/&&&[a-z]*\n[\s\S]*?\n&&&/g,replacement:function(t){return'<script type="text/javascript">'+(t=t.replace(/```/gm,"")).trim()+"<\/script>"}},{regex:/`(.*?)`/g,replacement:"<code>$1</code>"},{regex:/\n\*(.*)/g,replacement:function(t,e){return"\n<ul>\n\t<li>"+e.trim()+"</li>\n</ul>"}},{regex:/\n[0-9]+\.(.*)/g,replacement:function(t,e){return"\n<ol>\n\t<li>"+e.trim()+"</li>\n</ol>"}},{regex:/\n(&gt;|>)(.*)/g,replacement:function(t,e,n){return"\n<blockquote>"+n.trim()+"</blockquote>"}},{regex:/\n-{5,}/g,replacement:"\n<hr />"},{regex:/\n([^\n]+)\n/g,replacement:function(t,e){var n=e.trim();if(/^<\/?(ul|ol|li|h|p|bl)/i.test(n))return"\n"+e+"\n";return"\n<p>"+n+"</p>\n"}},{regex:/<\/ul>\s?<ul>/g,replacement:""},{regex:/<\/ol>\s?<ol>/g,replacement:""},{regex:/<\/blockquote><blockquote>/g,replacement:"\n"}],this.render=function(e){return e="\n"+e+"\n",this.rules.forEach(function(t){e=e.replace(t.regex,t.replacement)}),e.trim()}}function h(t,e){var n=new XMLHttpRequest;n.open("GET",t,!0),n.onreadystatechange=function(){4===n.readyState&&(200===n.status?e(n.response,!1):e(n,n.statusText))},n.send()}function f(t,e){e||(e=window.location.href),t=t.replace(/[[]]/g,"\\$&");var n=new RegExp("[?&]"+t+"(=([^&#]*)|&|#|$)").exec(e);return n?n[2]?decodeURIComponent(n[2].replace(/\+/g," ")):"":null}function g(t,i,r){h(t,function(t,e){var n;e&&r(t,e),r((n=t,new Function("data","var output="+JSON.stringify(n).replace(/<%=(.+?)%>/g,'"+($1)+"').replace(/<%(.+?)%>/g,'";$1\noutput+="')+";return output;")(i)),e)})}function d(t,e){n.innerHTML="",g([o.layoutDirectory,"/",t,".html"].join(""),e,function(t,e){e?m(a):n.innerHTML=t})}function p(t){var e=new Date(t);return e.setDate(e.getDate()+1),[e.getDate(),e.getMonth()+1,e.getFullYear()].join("/")}function m(t){return o.debug&&(e.innerHTML=t),t}var y=function(t,e){this.type=t,this.layout=e,this.files=[],this[t]=this.files};y.prototype={init:function(n){this.getFiles(function(t,e){e&&m(s),this.loadFiles(function(t,e){e&&m(l),n()}.bind(this))}.bind(this))},getFileListUrl:function(t,e){return"GITHUB"===e.mode?(n=t,i=e.github,r=[i.host,"repos",i.username,i.repo,"contents",n+"?ref="+o.github.branch],i.prefix&&r.splice(5,0,i.prefix),r.join("/")):t;var n,i,r},getFileUrl:function(t,e){return"GITHUB"===e?t.download_url:t.getAttribute("href")},getFileElements:function(t){var e;if("GITHUB"===o.mode)e=JSON.parse(t);else{var n=document.createElement("div");n.innerHTML=t,e=[].slice.call(n.getElementsByTagName("a"))}return e},getFiles:function(n){h(this.getFileListUrl(this.type,o),function(t,e){e&&n(t,e),this.getFileElements(t).forEach(function(t){var e,n,i,r=this.getFileUrl(t,o.mode);e=r,n=o.extension,((i=e.split(".").pop())===n.replace(".","")||"html"===i)&&this.files.push(new b(r,this.type,this.layout.single))}.bind(this)),n(t,e)}.bind(this))},loadFiles:function(r){var s=[];this.files.forEach(function(n,i){n.getContent(function(t,e){e&&r(t,e),s.push(i),n.parseContent(),this.files.length==s.length&&r(t,e)}.bind(this))}.bind(this))},search:function(e,n){this[this.type]=this.files.filter(function(t){return 0<=t[e].toLowerCase().trim().indexOf(n.toLowerCase().trim())})},resetSearch:function(){this[this.type]=this.files},getByTag:function(e){this[this.type]=this.files.filter(function(t){if(e&&t.tags)return t.tags.some(function(t){return t===e})})},getFileByPermalink:function(e){return this.files.filter(function(t){return t.permalink===e})[0]},render:function(){return d(this.layout.list,this)}};var b=function(t,e,n){this.url=t,this.type=e,this.layout=n,this.html=!1,this.content,this.name,this.extension,this.title,this.excerpt,this.date,this.datetime,this.author,this.body,this.permalink,this.tags};b.prototype={getContent:function(n){h(this.url,function(t,e){e&&n(t,e),this.content=t,"string"==typeof this.content&&n(t,e)}.bind(this))},parseFrontMatter:function(){var t=this.content.split(o.frontMatterSeperator)[1];if(t){var n={};t.split(/\n/g).forEach(function(t){var e=t.split(":");e[1]&&(n[e[0].trim()]=e[1].trim())}),function(t,e,n){var i;for(i in void 0===e&&(e=t),e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);n&&n()}(this,n,null)}},setListAttributes:function(){o.listAttributes.forEach(function(t){this.hasOwnProperty(t)&&this[t]&&(this[t]=this[t].split(",").map(function(t){return t.trim()}))}.bind(this))},setFilename:function(){this.name=this.url.substr(this.url.lastIndexOf("/")).replace("/","").replace(o.extension,"")},setPermalink:function(){this.permalink=["#",this.type,this.name].join("/")},setDate:function(){var t=new RegExp(o.dateParser);this.date?(this.datetime=new Date(this.date),this.date=p(this.date)):t.test(this.url)&&(this.date=t.exec(this.url),this.datetime=new Date(this.date),this.date=p(this.date))},setBody:function(){var t=this.content.split(o.frontMatterSeperator).splice(2).join(o.frontMatterSeperator);if(this.html)this.body=t;else if(o.markdownEngine)this.body=o.markdownEngine(t);else{var e=new u;this.body=e.render(t)}},parseContent:function(){this.setFilename(),this.setPermalink(),this.parseFrontMatter(),this.setListAttributes(),this.setDate(),this.setBody()},render:function(){return d(this.layout,this)}},this.sort=function(t,e){this.ready?(this.collections[t][t].sort(e),this.collections[t].render()):m(c)},this.search=function(t,e,n){this.ready?(this.collections[t].search(e,n),this.collections[t].render()):m(c)},this.route=function(){var t=window.location.hash.split("/").map(function(t){return 0<=t.indexOf("?")&&(t=t.substring(0,t.indexOf("?"))),t}).filter(function(t){return"#"!==t}),e=t[0],n=t[1],i=this.collections[e],r=f("query")||"",s=f("tag")||"";return this.routes[e]=function(){if(e)if(n){var t=["#",e,n.trim()].join("/");i.getFileByPermalink(t).render()}else i?(r?i.search("title",r):s?i.getByTag(s):i.resetSearch(),i.render()):d(o.errorLayout,{});else window.location=["#",o.defaultView].join("/");o.onroute()},this.routes[e]()},this.registerPlugins=function(){o.plugins.forEach(function(t){var e,n=e=(e=(e=t.toString()).substr("function ".length)).substr(0,e.indexOf("("));this[n]||(this[n]=t)}.bind(this))},this.initFileCollections=function(n){var i=[],r=[];o.types.forEach(function(t){this.collections[t.name]=new y(t.name,t.layout),r.push(t.name)}.bind(this)),r.forEach(function(t,e){this.collections[t].init(function(){i.push(e),0===t.indexOf("post")&&this.collections[t][t].reverse(),r.length==i.length&&n()}.bind(this))}.bind(this))},this.init=function(){var t;(o=Object.assign({},i,o)).debug&&(t=o.messageClassName,(e=document.createElement("div")).className=t,e.innerHTML="DEBUG",e.style.background="yellow",e.style.position="absolute",e.style.top="0px",document.body.appendChild(e)),window.addEventListener("hashchange",this.route.bind(this)),o.elementId&&(n=document.getElementById(o.elementId))?this.initFileCollections(function(){window.dispatchEvent(new HashChangeEvent("hashchange")),this.ready=!0,this.registerPlugins(),o.onload()}.bind(this)):m(r)},this.init()};
3 | 
4 | 


--------------------------------------------------------------------------------
/templates/blank.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 |   <head>
 4 |     <meta charset="utf-8">
 5 |     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 6 |     <title>CMS.js</title>
 7 |     <meta name="description" content="The JavaScript Site Generator">
 8 |     <meta name="author" content="">
 9 |     <meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
10 |     <!--[if lt IE 9]>
11 |     <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
12 |     <![endif]-->
13 |     <noscript>Please enable JavaScript to view this site.</noscript>
14 |   </head>
15 |   <body>
16 |     <div>
17 |       <header>
18 |         <h3>
19 |         <a href="#" title="Home">CMS.js</a>
20 |         <small>The Javascript Site Generator</small>
21 |         </h3>
22 |         <nav>
23 |           <ul>
24 |             <li><a href="#/posts">Posts</a></li>
25 |             <li><a href="//github.com/chrisdiana/cms.js" target="_blank">Github</a></li>
26 |             <li><a href="#/pages/about">About</a></li>
27 |             <li><a href="#/pages/links">Links</a></li>
28 |           </ul>
29 |         </nav>
30 |       </header>
31 |       
32 |       <!-- CMS.js -->
33 |       <div id="cms"></div>
34 |       
35 |       <footer>
36 |         <small>© 2018 All Rights Reserved.</small>
37 |       </footer>
38 |     </div>
39 |     <script src="//cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.12/es5-shim.min.js"></script>
40 |     <script src="../js/cms.js"></script>
41 |     <script>
42 |     var blog = new CMS({
43 |       elementId: 'cms',
44 |       mode: 'GITHUB',
45 |       github: {
46 |         username: 'chrisdiana',
47 |         repo: 'cms.js-themes',
48 |         branch: 'master',
49 |         host: 'https://api.github.com',
50 |         prefix: 'templates',
51 |       },
52 |       layoutDirectory: 'layouts/blank',
53 |       errorLayout: 'error',
54 |       defaultView: 'posts',
55 |       types: [
56 |         { name: 'posts', layout: { list: 'post-list', single: 'post' }},
57 |         { name: 'pages',layout: { list: 'page-list', single: 'page' }},
58 |       ],
59 |     });
60 |     </script>
61 |   </body>
62 | </html>


--------------------------------------------------------------------------------
/templates/bootstrap-blog.html:
--------------------------------------------------------------------------------
  1 | <!doctype html>
  2 | <html lang="en">
  3 |   <head>
  4 |     <meta charset="utf-8">
  5 |     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  6 |     <meta name="description" content="">
  7 |     <meta name="author" content="">
  8 |     <link rel="icon" href="favicon.ico">
  9 |     <title>Blog Template for Bootstrap + CMS.js</title>
 10 |     <!-- Bootstrap core CSS -->
 11 |     <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet">
 12 |     <!-- Custom styles for this template -->
 13 |     <link href="//fonts.googleapis.com/css?family=Playfair+Display:700,900" rel="stylesheet">
 14 |     <link href="./css/bootstrap-blog.css" rel="stylesheet">
 15 |     <link href="./css/animations.css" rel="stylesheet">
 16 |     <noscript>Please enable JavaScript to view this site.</noscript>
 17 |   </head>
 18 |   <body>
 19 |     <div class="container">
 20 |       <header class="blog-header py-3">
 21 |         <div class="row flex-nowrap justify-content-between align-items-center">
 22 |           <div class="col-4 pt-1">
 23 |             <a class="text-muted" href="#">Subscribe</a>
 24 |           </div>
 25 |           <div class="col-4 text-center">
 26 |             <a class="blog-header-logo text-dark" href="#">Bootstrap + CMS.js</a>
 27 |           </div>
 28 |           <div class="col-4 d-flex justify-content-end align-items-center">
 29 |             <a class="text-muted" href="#">
 30 |             <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mx-3"><circle cx="10.5" cy="10.5" r="7.5"></circle><line x1="21" y1="21" x2="15.8" y2="15.8"></line></svg>
 31 |           </a>
 32 |           <a class="btn btn-sm btn-outline-secondary" href="#">Sign up</a>
 33 |         </div>
 34 |       </header>
 35 |       <div class="nav-scroller py-1 mb-2">
 36 |         <nav class="nav d-flex justify-content-between">
 37 |           <a class="p-2 text-muted" href="#/posts">Posts</a>
 38 |           <a class="p-2 text-muted" href="#/pages">Pages</a>
 39 |           <a class="p-2 text-muted" href="#/pages/about">About</a>
 40 |           <a class="p-2 text-muted" href="#/pages/links">Links</a>
 41 |           <a class="p-2 text-muted" href="#/posts?tag=sampletag">Tags Link</a>
 42 |         </nav>
 43 |       </div>
 44 |     </div>
 45 |     <main role="main" class="container">
 46 |       <div class="row">
 47 |         <div class="col-md-8 blog-main">
 48 | 
 49 |           <!-- CMS.js -->
 50 |           <div id="cms"></div>
 51 | 
 52 |         </div><!-- /.blog-main -->
 53 |         <aside class="col-md-4 blog-sidebar">
 54 |           <div class="p-3 mb-3 bg-light rounded">
 55 |             <h4 class="font-italic">About</h4>
 56 |             <p class="mb-0">Etiam porta <em>sem malesuada magna</em> mollis euismod. Cras mattis consectetur purus sit amet fermentum. Aenean lacinia bibendum nulla sed consectetur.</p>
 57 |           </div>
 58 |           <div class="p-3">
 59 |             <h4 class="font-italic">Tags</h4>
 60 |             <ol class="list-unstyled mb-0">
 61 |               <li><a href="#/posts?tag=sampletag">Sample Tag</a></li>
 62 |             </ol>
 63 |           </div>
 64 |           <div class="p-3">
 65 |             <h4 class="font-italic">Archives</h4>
 66 |             <ol class="list-unstyled mb-0">
 67 |               <li><a href="#">March 2014</a></li>
 68 |               <li><a href="#">February 2014</a></li>
 69 |               <li><a href="#">January 2014</a></li>
 70 |               <li><a href="#">December 2013</a></li>
 71 |               <li><a href="#">November 2013</a></li>
 72 |               <li><a href="#">October 2013</a></li>
 73 |               <li><a href="#">September 2013</a></li>
 74 |               <li><a href="#">August 2013</a></li>
 75 |               <li><a href="#">July 2013</a></li>
 76 |               <li><a href="#">June 2013</a></li>
 77 |               <li><a href="#">May 2013</a></li>
 78 |               <li><a href="#">April 2013</a></li>
 79 |             </ol>
 80 |           </div>
 81 |           <div class="p-3">
 82 |             <h4 class="font-italic">Elsewhere</h4>
 83 |             <ol class="list-unstyled">
 84 |               <li><a href="#">GitHub</a></li>
 85 |               <li><a href="#">Twitter</a></li>
 86 |               <li><a href="#">Facebook</a></li>
 87 |             </ol>
 88 |           </div>
 89 |         </aside><!-- /.blog-sidebar -->
 90 |       </div><!-- /.row -->
 91 |     </main><!-- /.container -->
 92 | 
 93 |     <footer class="blog-footer">
 94 |       <p>Blog template built for <a href="https://getbootstrap.com/">Bootstrap</a> by <a href="https://twitter.com/mdo">@mdo</a>.</p>
 95 |       <p>
 96 |         <a href="#">Back to top</a>
 97 |       </p>
 98 |     </footer>
 99 |     
100 |     <!-- Bootstrap core JavaScript
101 |     ================================================== -->
102 |     <!-- Placed at the end of the document so the pages load faster -->
103 |     <script src="//code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
104 |     <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/js/bootstrap.min.js"></script>
105 |     
106 |     <!-- CMS.js -->
107 |     <script src="//cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.12/es5-shim.min.js"></script>
108 |     <script src="../js/cms.js"></script>
109 |     <script>
110 |     var blog = new CMS({
111 |       elementId: 'cms',
112 |       mode: 'GITHUB',
113 |       github: {
114 |         username: 'chrisdiana',
115 |         repo: 'cms.js-themes',
116 |         branch: 'master',
117 |         host: 'https://api.github.com',
118 |         prefix: 'templates',
119 |       },
120 |       layoutDirectory: 'layouts/bootstrap-blog',
121 |       errorLayout: 'error',
122 |       defaultView: 'posts',
123 |       types: [
124 |         { name: 'posts', layout: { list: 'post-list', single: 'post' }},
125 |         { name: 'pages', layout: { list: 'page-list', single: 'page' }},
126 |       ],
127 |     });
128 |     </script>
129 |   </body>
130 | </html>


--------------------------------------------------------------------------------
/templates/bootstrap-starter.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html lang="en">
 3 |   <head>
 4 |     <meta charset="utf-8">
 5 |     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 6 |     <meta name="description" content="">
 7 |     <meta name="author" content="">
 8 |     <link rel="icon" href="favicon.ico">
 9 |     <title>Starter Template for Bootstrap + CMS.js</title>
10 |     <!-- Bootstrap core CSS -->
11 |     <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet">
12 |     <!-- Custom styles for this template -->
13 |     <link href="./css/bootstrap-starter.css" rel="stylesheet">
14 |     <link href="./css/animations.css" rel="stylesheet">
15 |     <noscript>Please enable JavaScript to view this site.</noscript>
16 |   </head>
17 |   <body>
18 |     <nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
19 |       <a class="navbar-brand" href="#">Bootstrap + CMS.js</a>
20 |       <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
21 |         <span class="navbar-toggler-icon"></span>
22 |       </button>
23 |       <div class="collapse navbar-collapse" id="navbarsExampleDefault">
24 |         <ul class="navbar-nav mr-auto">
25 |           <li class="nav-item active">
26 |             <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
27 |           </li>
28 |           <li class="nav-item">
29 |             <a class="nav-link" href="#/posts">Posts</a>
30 |           </li>
31 |           <li class="nav-item">
32 |             <a class="nav-link disabled" href="#/pages/about">About</a>
33 |           </li>
34 |           <li class="nav-item dropdown">
35 |             <a class="nav-link dropdown-toggle" href="https://example.com" id="dropdown01" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
36 |             <div class="dropdown-menu" aria-labelledby="dropdown01">
37 |               <a class="dropdown-item" href="#/pages">Pages</a>
38 |               <a class="dropdown-item" href="#/pages/links">Links</a>
39 |             </div>
40 |           </li>
41 |         </ul>
42 |         <form class="form-inline my-2 my-lg-0">
43 |           <input class="form-control mr-sm-2" id="search" type="text" placeholder="Search" aria-label="Search">
44 |           <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
45 |         </form>
46 |       </div>
47 |     </nav>
48 |     <main role="main" class="container">
49 |       <div class="starter-template">
50 | 
51 |         <!-- CMS.js -->
52 |         <div id="cms"></div>
53 | 
54 |       </div>
55 |     </main><!-- /.container -->
56 |       
57 |     <!-- Bootstrap core JavaScript
58 |     ================================================== -->
59 |     <!-- Placed at the end of the document so the pages load faster -->
60 |     <script src="//code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
61 |     <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/js/bootstrap.min.js"></script>
62 |     
63 |     <!-- CMS.js -->
64 |     <script src="//cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.12/es5-shim.min.js"></script>
65 |     <script src="../js/cms.js"></script>
66 |     <script>
67 |     var blog = new CMS({
68 |       elementId: 'cms',
69 |       mode: 'GITHUB',
70 |       github: {
71 |         username: 'chrisdiana',
72 |         repo: 'cms.js-themes',
73 |         branch: 'master',
74 |         host: 'https://api.github.com',
75 |         prefix: 'templates',
76 |       },
77 |       layoutDirectory: 'layouts/bootstrap-starter',
78 |       errorLayout: 'error',
79 |       defaultView: 'posts',
80 |       types: [
81 |         { name: 'posts', layout: { list: 'post-list', single: 'post' }},
82 |         { name: 'pages', layout: { list: 'page-list', single: 'page' }},
83 |       ],
84 |       onload: function() {
85 |         document.getElementById('search').addEventListener('input', function(e) {
86 |           blog.search('posts', 'title', e.target.value);
87 |         });
88 |       },
89 |     });
90 |     </script>
91 |   </body>
92 | </html>


--------------------------------------------------------------------------------
/templates/bulma-basic.html:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html>
  3 |   <head>
  4 |     <meta charset="utf-8">
  5 |     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6 |     <meta name="viewport" content="width=device-width, initial-scale=1">
  7 |     <title>Bulma + CMS.js Basic Theme</title>
  8 |     <link rel="icon" type="image/png" sizes="32x32" href="favicon.png">
  9 |     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
 10 |     <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
 11 |     <!-- Bulma Version 0.7.2-->
 12 |     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.min.css" />
 13 |     <link href="./css/animations.css" rel="stylesheet">
 14 |     <noscript>Please enable JavaScript to view this site.</noscript>
 15 |   </head>
 16 |   <body>
 17 |     <nav class="navbar" role="navigation" aria-label="main navigation">
 18 |       <div class="navbar-brand">
 19 |         <a class="navbar-item" href="https://bulma.io">
 20 |           <img src="https://bulma.io/images/bulma-logo.png" width="112" height="28">
 21 |         </a>
 22 |         <a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false" data-target="navbarBasicExample">
 23 |           <span aria-hidden="true"></span>
 24 |           <span aria-hidden="true"></span>
 25 |           <span aria-hidden="true"></span>
 26 |         </a>
 27 |       </div>
 28 |       <div id="navbarBasicExample" class="navbar-menu">
 29 |         <div class="navbar-start">
 30 |           <a class="navbar-item" href="#">
 31 |             Home
 32 |           </a>
 33 |           <a class="navbar-item" href="#/posts">
 34 |             Posts
 35 |           </a>
 36 |           <a class="navbar-item" href="#/pages/about">
 37 |             About
 38 |           </a>
 39 |           <div class="navbar-item has-dropdown is-hoverable">
 40 |             <a class="navbar-link">
 41 |               More
 42 |             </a>
 43 |             <div class="navbar-dropdown">
 44 |               <a class="navbar-item" href="#/pages/links">
 45 |                 Links
 46 |               </a>
 47 |               <hr class="navbar-divider">
 48 |               <a class="navbar-item" href="#/pages">
 49 |                 Pages
 50 |               </a>
 51 |             </div>
 52 |           </div>
 53 |         </div>
 54 |         <div class="navbar-end">
 55 |           <div class="navbar-item">
 56 |             <div class="buttons">
 57 |               <a class="button is-primary">
 58 |                 <strong>Sign up</strong>
 59 |               </a>
 60 |               <a class="button is-light">
 61 |                 Log in
 62 |               </a>
 63 |             </div>
 64 |           </div>
 65 |         </div>
 66 |       </div>
 67 |     </nav>
 68 |     
 69 |     <div class="container">
 70 |       <!-- START ARTICLE FEED -->
 71 |       <section class="articles">
 72 |         <div class="column is-8 is-offset-2">
 73 | 
 74 |           <!-- CMS.js -->
 75 |           <div id="cms"></div>
 76 | 
 77 |         </div>
 78 |       </section>
 79 |       <!-- END ARTICLE FEED -->
 80 |     </div>
 81 | 
 82 |     <!-- CMS.js -->
 83 |     <script src="//cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.12/es5-shim.min.js"></script>
 84 |     <script src="../js/cms.js"></script>
 85 |     <script>
 86 |     var blog = new CMS({
 87 |       elementId: 'cms',
 88 |       mode: 'GITHUB',
 89 |       github: {
 90 |         username: 'chrisdiana',
 91 |         repo: 'cms.js-themes',
 92 |         branch: 'master',
 93 |         host: 'https://api.github.com',
 94 |         prefix: 'templates',
 95 |       },
 96 |       layoutDirectory: 'layouts/bulma-basic',
 97 |       errorLayout: 'error',
 98 |       defaultView: 'posts',
 99 |       types: [
100 |         { name: 'posts', layout: { list: 'post-list', single: 'post' }},
101 |         { name: 'pages', layout: { list: 'page-list', single: 'page' }},
102 |       ],
103 |     });
104 |     </script>
105 |   </body>
106 | </html>


--------------------------------------------------------------------------------
/templates/bulma-blog.html:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html>
  3 |   <head>
  4 |     <meta charset="utf-8">
  5 |     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6 |     <meta name="viewport" content="width=device-width, initial-scale=1">
  7 |     <title>Bulma + CMS.js Blog Theme</title>
  8 |     <link rel="icon" type="image/png" sizes="32x32" href="favicon.png">
  9 |     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
 10 |     <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
 11 |     <!-- Bulma Version 0.7.2-->
 12 |     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.min.css" />
 13 |     <link rel="stylesheet" type="text/css" href="./css/bulma-blog.css">
 14 |     <link href="./css/animations.css" rel="stylesheet">
 15 |     <noscript>Please enable JavaScript to view this site.</noscript>
 16 |   </head>
 17 |   <body>
 18 |     <!-- START NAV -->
 19 |     <nav class="navbar">
 20 |       <div class="container">
 21 |         <div class="navbar-brand">
 22 |           <a class="navbar-item" href="#">
 23 |             Blog
 24 |           </a>
 25 |           <span class="navbar-burger burger" data-target="navbarMenu">
 26 |             <span></span>
 27 |             <span></span>
 28 |             <span></span>
 29 |           </span>
 30 |         </div>
 31 |         <div id="navbarMenu" class="navbar-menu">
 32 |           <div class="navbar-end">
 33 |             <a class="navbar-item is-active" href="#">
 34 |               Home
 35 |             </a>
 36 |             <a class="navbar-item" href="#/posts">
 37 |               Posts
 38 |             </a>
 39 |             <a class="navbar-item" href="#/pages/about">
 40 |               About
 41 |             </a>
 42 |             <a class="navbar-item" href="#/pages/links">
 43 |               Links
 44 |             </a>
 45 |             <div class="navbar-item has-dropdown is-hoverable">
 46 |               <a class="navbar-link">
 47 |                 Dropdown
 48 |               </a>
 49 |               <div class="navbar-dropdown">
 50 |                 <a class="navbar-item" href="#/pages">
 51 |                   Pages
 52 |                 </a>
 53 |               </div>
 54 |             </div>
 55 |           </div>
 56 |         </div>
 57 |       </div>
 58 |     </nav>
 59 |     <!-- END NAV -->
 60 |     <section class="hero is-info is-medium is-bold">
 61 |       <div class="hero-body">
 62 |         <div class="container has-text-centered">
 63 |           <h1 class="title is-size-1">
 64 |           Bulma + CMS.js
 65 |           </h1>
 66 |         </div>
 67 |       </div>
 68 |     </section>
 69 |     <div class="container">
 70 |       <!-- START ARTICLE FEED -->
 71 |       <section class="articles">
 72 |         <div class="column is-8 is-offset-2">
 73 | 
 74 |           <!-- CMS.js -->
 75 |           <div id="cms"></div>
 76 | 
 77 |         </div>
 78 |       </section>
 79 |       <!-- END ARTICLE FEED -->
 80 |     </div>
 81 | 
 82 |     <!-- CMS.js -->
 83 |     <script src="//cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.12/es5-shim.min.js"></script>
 84 |     <script src="../js/cms.js"></script>
 85 |     <script>
 86 |     var blog = new CMS({
 87 |       elementId: 'cms',
 88 |       mode: 'GITHUB',
 89 |       github: {
 90 |         username: 'chrisdiana',
 91 |         repo: 'cms.js-themes',
 92 |         branch: 'master',
 93 |         host: 'https://api.github.com',
 94 |         prefix: 'templates',
 95 |       },
 96 |       layoutDirectory: 'layouts/bulma-blog',
 97 |       errorLayout: 'error',
 98 |       defaultView: 'posts',
 99 |       types: [
100 |         { name: 'posts', layout: { list: 'post-list', single: 'post' }},
101 |         { name: 'pages', layout: { list: 'page-list', single: 'page' }},
102 |       ],
103 |     });
104 |     </script>
105 |   </body>
106 | </html>


--------------------------------------------------------------------------------
/templates/css/animations.css:
--------------------------------------------------------------------------------
 1 | /* Animations Styles */
 2 | 
 3 | .fade-in {
 4 |   -webkit-animation: fadein 1s;
 5 |   -moz-animation: fadein 1s;
 6 |   -ms-animation: fadein 1s;
 7 |   -o-animation: fadein 1s;
 8 |   animation: fadein 1s;
 9 | }
10 | 
11 | @keyframes fadein {
12 |   from { opacity: 0; }
13 |   to   { opacity: 1; }
14 | }
15 | 
16 | @-moz-keyframes fadein {
17 |   from { opacity: 0; }
18 |   to   { opacity: 1; }
19 | }
20 | 
21 | @-webkit-keyframes fadein {
22 |   from { opacity: 0; }
23 |   to   { opacity: 1; }
24 | }
25 | 
26 | @-ms-keyframes fadein {
27 |   from { opacity: 0; }
28 |   to   { opacity: 1; }
29 | }
30 | 


--------------------------------------------------------------------------------
/templates/css/bootstrap-blog.css:
--------------------------------------------------------------------------------
  1 | /* stylelint-disable selector-list-comma-newline-after */
  2 | 
  3 | .blog-header {
  4 |   line-height: 1;
  5 |   border-bottom: 1px solid #e5e5e5;
  6 | }
  7 | 
  8 | .blog-header-logo {
  9 |   font-family: "Playfair Display", Georgia, "Times New Roman", serif;
 10 |   font-size: 2.25rem;
 11 | }
 12 | 
 13 | .blog-header-logo:hover {
 14 |   text-decoration: none;
 15 | }
 16 | 
 17 | h1, h2, h3, h4, h5, h6 {
 18 |   font-family: "Playfair Display", Georgia, "Times New Roman", serif;
 19 | }
 20 | 
 21 | .display-4 {
 22 |   font-size: 2.5rem;
 23 | }
 24 | @media (min-width: 768px) {
 25 |   .display-4 {
 26 |     font-size: 3rem;
 27 |   }
 28 | }
 29 | 
 30 | .nav-scroller {
 31 |   position: relative;
 32 |   z-index: 2;
 33 |   height: 2.75rem;
 34 |   overflow-y: hidden;
 35 | }
 36 | 
 37 | .nav-scroller .nav {
 38 |   display: -ms-flexbox;
 39 |   display: flex;
 40 |   -ms-flex-wrap: nowrap;
 41 |   flex-wrap: nowrap;
 42 |   padding-bottom: 1rem;
 43 |   margin-top: -1px;
 44 |   overflow-x: auto;
 45 |   text-align: center;
 46 |   white-space: nowrap;
 47 |   -webkit-overflow-scrolling: touch;
 48 | }
 49 | 
 50 | .nav-scroller .nav-link {
 51 |   padding-top: .75rem;
 52 |   padding-bottom: .75rem;
 53 |   font-size: .875rem;
 54 | }
 55 | 
 56 | .card-img-right {
 57 |   height: 100%;
 58 |   border-radius: 0 3px 3px 0;
 59 | }
 60 | 
 61 | .flex-auto {
 62 |   -ms-flex: 0 0 auto;
 63 |   flex: 0 0 auto;
 64 | }
 65 | 
 66 | .h-250 { height: 250px; }
 67 | @media (min-width: 768px) {
 68 |   .h-md-250 { height: 250px; }
 69 | }
 70 | 
 71 | /*
 72 |  * Blog name and description
 73 |  */
 74 | .blog-title {
 75 |   margin-bottom: 0;
 76 |   font-size: 2rem;
 77 |   font-weight: 400;
 78 | }
 79 | .blog-description {
 80 |   font-size: 1.1rem;
 81 |   color: #999;
 82 | }
 83 | 
 84 | @media (min-width: 40em) {
 85 |   .blog-title {
 86 |     font-size: 3.5rem;
 87 |   }
 88 | }
 89 | 
 90 | /* Pagination */
 91 | .blog-pagination {
 92 |   margin-bottom: 4rem;
 93 | }
 94 | .blog-pagination > .btn {
 95 |   border-radius: 2rem;
 96 | }
 97 | 
 98 | /*
 99 |  * Blog posts
100 |  */
101 | .blog-post {
102 |   margin-bottom: 4rem;
103 | }
104 | .blog-post-title {
105 |   margin-bottom: .25rem;
106 |   font-size: 2.5rem;
107 | }
108 | .blog-post-meta {
109 |   margin-bottom: 1.25rem;
110 |   color: #999;
111 | }
112 | 
113 | /*
114 |  * Footer
115 |  */
116 | .blog-footer {
117 |   padding: 2.5rem 0;
118 |   color: #999;
119 |   text-align: center;
120 |   background-color: #f9f9f9;
121 |   border-top: .05rem solid #e5e5e5;
122 | }
123 | .blog-footer p:last-child {
124 |   margin-bottom: 0;
125 | }


--------------------------------------------------------------------------------
/templates/css/bootstrap-starter.css:
--------------------------------------------------------------------------------
1 | body {
2 |   padding-top: 2rem;
3 | }
4 | .starter-template {
5 |   padding: 3rem 1.5rem;
6 | }


--------------------------------------------------------------------------------
/templates/css/bulma-blog.css:
--------------------------------------------------------------------------------
 1 | html,body {
 2 |   font-family: 'Open Sans', sans-serif;
 3 |   font-size: 14px;
 4 |   background: #F0F2F4;
 5 | }
 6 | .navbar.is-white {
 7 |   background: #F0F2F4;
 8 | }
 9 | .navbar-brand .brand-text {
10 |   font-size: 1.11rem;
11 |   font-weight: bold;
12 | }
13 | .hero-body
14 | {
15 | background-position: center;
16 | background-size: cover;
17 | background-repeat: no-repeat;
18 | height: 400px;
19 | }
20 | .articles {
21 |   margin: 5rem 0;
22 |   margin-top: -200px;
23 | }
24 | .articles .content p {
25 |     line-height: 1.9;
26 |     margin: 15px 0;
27 | }
28 | .author-image {
29 |     position: absolute;
30 |     top: -30px;
31 |     left: 50%;
32 |     width: 60px;
33 |     height: 60px;
34 |     margin-left: -30px;
35 |     border: 3px solid #ccc;
36 |     border-radius: 50%;
37 | }
38 | .media-center {
39 |   display: block;
40 |   margin-bottom: 1rem;
41 | }
42 | .media-content {
43 |   margin-top: 3rem;
44 | }
45 | .article, .promo-block {
46 |   margin-top: 6rem;
47 | }
48 | div.column.is-8:first-child {
49 |   padding-top: 0;
50 |   margin-top: 0;
51 | }
52 | .article-title {
53 |   font-size: 2rem;
54 |   font-weight: lighter;
55 |   line-height: 2;
56 | }
57 | .article-subtitle {
58 |   color: #909AA0;
59 |   margin-bottom: 3rem;
60 | }
61 | .article-body {
62 |   line-height: 1.4;
63 |   margin: 0 6rem;
64 | }
65 | .promo-block .container {
66 |   margin: 1rem 5rem;
67 | }


--------------------------------------------------------------------------------
/templates/css/medium-dark.css:
--------------------------------------------------------------------------------
 1 | html, body {
 2 | 	font-family: Georgia,Cambria,"Times New Roman",Times,serif;
 3 |     letter-spacing: 0;
 4 |     font-weight: 400;
 5 |     font-style: normal;
 6 |     text-rendering: optimizeLegibility;
 7 |     -webkit-font-smoothing: antialiased;
 8 |     -moz-osx-font-smoothing: grayscale;
 9 |     -moz-font-feature-settings: "liga" on;
10 |     color: rgba(255,255,255,.84);
11 |     font-size: 20px;
12 |     line-height: 1.4;
13 |     background: rgba(0,0,0,.95);
14 | }
15 | 
16 | a {
17 | 	color: rgba(255,255,255,.84);
18 | }
19 | 
20 | a:hover {
21 | 	color: rgba(255,255,255,.7);
22 | }
23 | 
24 | p {
25 |     --x-height-multiplier: 0.375;
26 |     --baseline-multiplier: 0.17;
27 |     letter-spacing: .01rem;
28 |     font-weight: 400;
29 |     font-style: normal;
30 |     font-size: 21px;
31 |     line-height: 1.58;
32 |     letter-spacing: -.003em;
33 | }
34 | 
35 | li {
36 |     --x-height-multiplier: 0.375;
37 |     --baseline-multiplier: 0.17;
38 |     letter-spacing: .01rem;
39 |     font-weight: 400;
40 |     font-style: normal;
41 |     font-size: 21px;
42 |     line-height: 1.58;
43 |     letter-spacing: -.003em;
44 | }
45 | 
46 | .content {
47 |     margin-left: auto;
48 |     margin-right: auto;
49 |     padding-left: 1em;
50 |     padding-right: 1em;
51 |     max-width: 768px;
52 | }
53 | 
54 | .post-meta {
55 | 	color: #aaa;
56 | }
57 | .post-tag {
58 | 	    background: #aaa;
59 |     color: #fff;
60 |     text-decoration: none;
61 |     padding: 5px 8px;
62 |     font-size: 14px;
63 |     margin: 5px 5px 5px 0px;
64 | }


--------------------------------------------------------------------------------
/templates/css/medium-light.css:
--------------------------------------------------------------------------------
 1 | html, body {
 2 | 	font-family: Georgia,Cambria,"Times New Roman",Times,serif;
 3 |     letter-spacing: 0;
 4 |     font-weight: 400;
 5 |     font-style: normal;
 6 |     text-rendering: optimizeLegibility;
 7 |     -webkit-font-smoothing: antialiased;
 8 |     -moz-osx-font-smoothing: grayscale;
 9 |     -moz-font-feature-settings: "liga" on;
10 |     color: rgba(0,0,0,.84);
11 |     font-size: 20px;
12 |     line-height: 1.4;
13 | }
14 | 
15 | a {
16 | 	color: rgba(0,0,0,.84);
17 | }
18 | 
19 | a:hover {
20 | 	color: rgba(0,0,0,.70);
21 | }
22 | 
23 | p {
24 |     --x-height-multiplier: 0.375;
25 |     --baseline-multiplier: 0.17;
26 |     letter-spacing: .01rem;
27 |     font-weight: 400;
28 |     font-style: normal;
29 |     font-size: 21px;
30 |     line-height: 1.58;
31 |     letter-spacing: -.003em;
32 | }
33 | 
34 | li {
35 |     --x-height-multiplier: 0.375;
36 |     --baseline-multiplier: 0.17;
37 |     letter-spacing: .01rem;
38 |     font-weight: 400;
39 |     font-style: normal;
40 |     font-size: 21px;
41 |     line-height: 1.58;
42 |     letter-spacing: -.003em;
43 | }
44 | 
45 | .content {
46 |     margin-left: auto;
47 |     margin-right: auto;
48 |     padding-left: 1em;
49 |     padding-right: 1em;
50 |     max-width: 768px;
51 | }
52 | 
53 | .post-meta {
54 | 	color: #aaa;
55 | }
56 | .post-tag {
57 | 	    background: #aaa;
58 |     color: #fff;
59 |     text-decoration: none;
60 |     padding: 5px 8px;
61 |     font-size: 14px;
62 |     margin: 5px 5px 5px 0px;
63 | }


--------------------------------------------------------------------------------
/templates/css/poole.min.css:
--------------------------------------------------------------------------------
1 | /* Poole - Designed, built, and released under MIT license by @mdo. https://github.com/poole/poole. */
2 | *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}html,body{margin:0;padding:0}html{font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;font-size:16px;line-height:1.5}@media (min-width: 38em){html{font-size:20px}}body{color:#515151;background-color:#fff;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}a{color:#268bd2;text-decoration:none}a strong{color:inherit}a:hover,a:focus{text-decoration:underline}h1,h2,h3,h4,h5,h6{margin-bottom:.5rem;font-weight:bold;line-height:1.25;color:#313131;text-rendering:optimizeLegibility}h1{font-size:2rem}h2{margin-top:1rem;font-size:1.5rem}h3{margin-top:1.5rem;font-size:1.25rem}h4,h5,h6{margin-top:1rem;font-size:1rem}p{margin-top:0;margin-bottom:1rem}strong{color:#303030}ul,ol,dl{margin-top:0;margin-bottom:1rem}dt{font-weight:bold}dd{margin-bottom:.5rem}hr{position:relative;margin:1.5rem 0;border:0;border-top:1px solid #eee;border-bottom:1px solid #fff}abbr{font-size:85%;font-weight:bold;color:#555;text-transform:uppercase}abbr[title]{cursor:help;border-bottom:1px dotted #e5e5e5}code,pre{font-family:Menlo, Monaco, "Courier New", monospace}code{padding:.25em .5em;font-size:85%;color:#bf616a;background-color:#f9f9f9;border-radius:3px}pre{display:block;margin-top:0;margin-bottom:1rem;padding:1rem;font-size:.8rem;line-height:1.4;white-space:pre;white-space:pre-wrap;word-break:break-all;word-wrap:break-word;background-color:#f9f9f9}pre code{padding:0;font-size:100%;color:inherit;background-color:transparent}.highlight{margin-bottom:1rem;border-radius:4px}.highlight pre{margin-bottom:0}.gist .gist-file{font-family:Menlo, Monaco, "Courier New", monospace !important}.gist .markdown-body{padding:15px}.gist pre{padding:0;background-color:transparent}.gist .gist-file .gist-data{font-size:.8rem !important;line-height:1.4}.gist code{padding:0;color:inherit;background-color:transparent;border-radius:0}blockquote{padding:.5rem 1rem;margin:.8rem 0;color:#7a7a7a;border-left:.25rem solid #e5e5e5}blockquote p:last-child{margin-bottom:0}@media (min-width: 30em){blockquote{padding-right:5rem;padding-left:1.25rem}}img{display:block;max-width:100%;margin:0 0 1rem;border-radius:5px}table{margin-bottom:1rem;width:100%;border:1px solid #e5e5e5;border-collapse:collapse}td,th{padding:.25rem .5rem;border:1px solid #e5e5e5}tbody tr:nth-child(odd) td,tbody tr:nth-child(odd) th{background-color:#f9f9f9}.lead{font-size:1.25rem;font-weight:300}.message{margin-bottom:1rem;padding:1rem;color:#717171;background-color:#f9f9f9}.container{max-width:38rem;padding-left:1rem;padding-right:1rem;margin-left:auto;margin-right:auto}.masthead{padding-top:1rem;padding-bottom:1rem;margin-bottom:3rem}.masthead-title{margin-top:0;margin-bottom:0;color:#505050}.masthead-title a{color:#505050}.masthead-title small{font-size:75%;font-weight:400;color:#c0c0c0;letter-spacing:0}.page,.post{margin-bottom:4em}.page-title,.post-title,.post-title a{color:#303030}.page-title,.post-title{margin-top:0}.post-date{display:block;margin-top:-.5rem;margin-bottom:1rem;color:#9a9a9a}.related{padding-top:2rem;padding-bottom:2rem;border-top:1px solid #eee}.related-posts{padding-left:0;list-style:none}.related-posts h3{margin-top:0}.related-posts li small{font-size:75%;color:#999}.related-posts li a:hover{color:#268bd2;text-decoration:none}.related-posts li a:hover small{color:inherit}.pagination{overflow:hidden;margin-left:-1rem;margin-right:-1rem;font-family:"PT Sans", Helvetica, Arial, sans-serif;color:#ccc;text-align:center}.pagination-item{display:block;padding:1rem;border:1px solid #eee}.pagination-item:first-child{margin-bottom:-1px}a.pagination-item:hover{background-color:#f5f5f5}@media (min-width: 30em){.pagination{margin:3rem 0}.pagination-item{float:left;width:50%}.pagination-item:first-child{margin-bottom:0;border-top-left-radius:4px;border-bottom-left-radius:4px}.pagination-item:last-child{margin-left:-1px;border-top-right-radius:4px;border-bottom-right-radius:4px}}


--------------------------------------------------------------------------------
/templates/css/poole.overrides.min.css:
--------------------------------------------------------------------------------
1 | /* CMS.js overrides */
2 | nav{display:block;float:right}nav ul{list-style:none;padding:0}nav ul li{display:inline;padding-left:10px}nav ul li a{font-size:18px}.footer{padding-bottom:15px}.sitename img{max-height:32px}.masthead-title{display:block;float:left}.masthead-title a{float:left}.masthead-title small{padding-left:8px}.post-tag,input{padding:5px 10px}.post-tags{margin-bottom:14px}.post-tag{background:#1b89d5;color:#fff;text-transform:uppercase;font-size:15px;margin-right:8px}.post-tag:hover{text-decoration:none;background:#0a74b9}input{font-size:18px}@media (max-width:480px){nav{float:right;width:100%;margin-top:.5rem}nav ul li{padding-left:.5rem}nav ul li:first-child{padding-left:0}nav ul li a{font-size:1rem}}
3 | 


--------------------------------------------------------------------------------
/templates/css/pure-blog.css:
--------------------------------------------------------------------------------
  1 | * {
  2 |     -webkit-box-sizing: border-box;
  3 |     -moz-box-sizing: border-box;
  4 |     box-sizing: border-box;
  5 | }
  6 | 
  7 | a {
  8 |     text-decoration: none;
  9 |     color: rgb(61, 146, 201);
 10 | }
 11 | a:hover,
 12 | a:focus {
 13 |     text-decoration: underline;
 14 | }
 15 | 
 16 | h3 {
 17 |     font-weight: 100;
 18 | }
 19 | 
 20 | /* LAYOUT CSS */
 21 | .pure-img-responsive {
 22 |     max-width: 100%;
 23 |     height: auto;
 24 | }
 25 | 
 26 | #layout {
 27 |     padding: 0;
 28 | }
 29 | 
 30 | .header {
 31 |     text-align: center;
 32 |     top: auto;
 33 |     margin: 3em auto;
 34 | }
 35 | 
 36 | .sidebar {
 37 |     background: rgb(61, 79, 93);
 38 |     color: #fff;
 39 | }
 40 | 
 41 | .brand-title,
 42 | .brand-tagline {
 43 |     margin: 0;
 44 | }
 45 | .brand-title {
 46 |     text-transform: uppercase;
 47 | }
 48 | .brand-tagline {
 49 |     font-weight: 300;
 50 |     color: rgb(176, 202, 219);
 51 | }
 52 | 
 53 | .nav-list {
 54 |     margin: 0;
 55 |     padding: 0;
 56 |     list-style: none;
 57 | }
 58 | .nav-item {
 59 |     display: inline-block;
 60 |     *display: inline;
 61 |     zoom: 1;
 62 | }
 63 | .nav-item a {
 64 |     background: transparent;
 65 |     border: 2px solid rgb(176, 202, 219);
 66 |     color: #fff;
 67 |     margin-top: 1em;
 68 |     letter-spacing: 0.05em;
 69 |     text-transform: uppercase;
 70 |     font-size: 85%;
 71 | }
 72 | .nav-item a:hover,
 73 | .nav-item a:focus {
 74 |     border: 2px solid rgb(61, 146, 201);
 75 |     text-decoration: none;
 76 | }
 77 | 
 78 | .content-subhead {
 79 |     text-transform: uppercase;
 80 |     color: #aaa;
 81 |     border-bottom: 1px solid #eee;
 82 |     padding: 0.4em 0;
 83 |     font-size: 80%;
 84 |     font-weight: 500;
 85 |     letter-spacing: 0.1em;
 86 | }
 87 | 
 88 | .content {
 89 |     padding: 2em 1em 0;
 90 | }
 91 | 
 92 | .post {
 93 |     padding-bottom: 2em;
 94 | }
 95 | .post-title {
 96 |     font-size: 2em;
 97 |     color: #222;
 98 |     margin-bottom: 0.2em;
 99 | }
100 | .post-avatar {
101 |     border-radius: 50px;
102 |     float: right;
103 |     margin-left: 1em;
104 | }
105 | .post-description {
106 |     font-family: Georgia, "Cambria", serif;
107 |     color: #444;
108 |     line-height: 1.8em;
109 | }
110 | .post-meta {
111 |     color: #999;
112 |     font-size: 90%;
113 |     margin: 0;
114 | }
115 | 
116 | .post-category {
117 |     margin: 0 0.1em;
118 |     padding: 0.3em 1em;
119 |     color: #fff;
120 |     background: #999;
121 |     font-size: 80%;
122 | }
123 |     .post-category-design {
124 |         background: #5aba59;
125 |     }
126 |     .post-category-pure {
127 |         background: #4d85d1;
128 |     }
129 |     .post-category-yui {
130 |         background: #8156a7;
131 |     }
132 |     .post-category-js {
133 |         background: #df2d4f;
134 |     }
135 | 
136 | .post-images {
137 |     margin: 1em 0;
138 | }
139 | .post-image-meta {
140 |     margin-top: -3.5em;
141 |     margin-left: 1em;
142 |     color: #fff;
143 |     text-shadow: 0 1px 1px #333;
144 | }
145 | 
146 | .footer {
147 |     padding: 1em 0;
148 | }
149 | .footer a {
150 |     color: #ccc;
151 |     font-size: 80%;
152 | }
153 | .footer .pure-menu a:hover,
154 | .footer .pure-menu a:focus {
155 |     background: none;
156 | }
157 | 
158 | @media (min-width: 48em) {
159 |     .content {
160 |         padding: 2em 3em 0;
161 |         margin-left: 25%;
162 |     }
163 | 
164 |     .header {
165 |         margin: 80% 2em 0;
166 |         text-align: right;
167 |     }
168 | 
169 |     .sidebar {
170 |         position: fixed;
171 |         top: 0;
172 |         bottom: 0;
173 |     }
174 | 
175 |     .footer {
176 |         text-align: center;
177 |     }
178 | }
179 | 


--------------------------------------------------------------------------------
/templates/foundation-blog-simple.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html class="no-js" lang="en">
 3 |   <head>
 4 |     <meta charset="utf-8" />
 5 |     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 6 |     <title>Foundation + CMS.js</title>
 7 |     <link rel="stylesheet" href="https://dhbhdrzi4tiry.cloudfront.net/cdn/sites/foundation.min.css">
 8 |     <link href="./css/animations.css" rel="stylesheet">
 9 |     <noscript>Please enable JavaScript to view this site.</noscript>
10 |   </head>
11 |   <body>
12 |     <div class="top-bar">
13 |       <div class="top-bar-left">
14 |         <ul class="menu">
15 |           <li class="menu-text">Blog Simple</li>
16 |           <li><a href="#/posts">Posts</a></li>
17 |           <li><a href="#/pages/links">Links</a></li>
18 |           <li><a href="#/pages/about">About</a></li>
19 |         </ul>
20 |       </div>
21 |     </div>
22 |     <div class="callout large primary">
23 |       <div class="row column text-center">
24 |         <h1>Foundation + CMS.js</h1>
25 |         <h2 class="subheader">Such a Simple Blog Layout</h2>
26 |       </div>
27 |     </div>
28 |     <div class="row medium-8 large-7 columns">
29 | 
30 |       <!-- CMS.js -->
31 |       <div id="cms"></div>
32 | 
33 |     </div>
34 |     <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
35 |     <script src="https://dhbhdrzi4tiry.cloudfront.net/cdn/sites/foundation.js"></script>
36 | 
37 |     <!-- CMS.js -->
38 |     <script src="//cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.12/es5-shim.min.js"></script>
39 |     <script src="../js/cms.js"></script>
40 |     <script>
41 |       $(document).foundation();
42 | 
43 |       var blog = new CMS({
44 |         elementId: 'cms',
45 |         mode: 'GITHUB',
46 |         github: {
47 |           username: 'chrisdiana',
48 |           repo: 'cms.js-themes',
49 |           branch: 'master',
50 |           host: 'https://api.github.com',
51 |           prefix: 'templates',
52 |         },
53 |         layoutDirectory: 'layouts/foundation-blog',
54 |         errorLayout: 'error',
55 |         defaultView: 'posts',
56 |         types: [
57 |           { name: 'posts', layout: { list: 'post-list', single: 'post' } },
58 |           { name: 'pages', layout: { list: 'page-list', single: 'page' } },
59 |         ],
60 |       });
61 |     </script>
62 |   </body>
63 | </html>


--------------------------------------------------------------------------------
/templates/foundation-blog.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html class="no-js" lang="en">
 3 |   <head>
 4 |     <meta charset="utf-8" />
 5 |     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 6 |     <title>Foundation + CMS.js</title>
 7 |     <link rel="stylesheet" href="https://dhbhdrzi4tiry.cloudfront.net/cdn/sites/foundation.min.css">
 8 |     <link href="./css/animations.css" rel="stylesheet">
 9 |     <noscript>Please enable JavaScript to view this site.</noscript>
10 |   </head>
11 |   <body>
12 |     <div class="top-bar">
13 |       <div class="top-bar-left">
14 |         <ul class="menu">
15 |           <li class="menu-text">Blog</li>
16 |         </ul>
17 |       </div>
18 |       <div class="top-bar-right">
19 |         <ul class="menu">
20 |           <li><a href="#/posts">Posts</a></li>
21 |           <li><a href="#/pages/links">Links</a></li>
22 |           <li><a href="#/pages/about">About</a></li>
23 |         </ul>
24 |       </div>
25 |     </div>
26 |     <div class="callout large primary">
27 |       <div class="row column text-center">
28 |         <h1>Foundation + CMS.js</h1>
29 |       </div>
30 |     </div>
31 |     <div class="row" id="content">
32 |       <div class="medium-8 columns">
33 |         
34 |         <!-- CMS.js -->
35 |         <div id="cms"></div>
36 |         
37 |       </div>
38 |       <div class="medium-3 columns" data-sticky-container>
39 |         <div class="sticky" data-sticky data-anchor="content">
40 |           <h4>Categories</h4>
41 |           <ul>
42 |             <li><a href="#">Skyler</a></li>
43 |             <li><a href="#">Jesse</a></li>
44 |             <li><a href="#">Mike</a></li>
45 |             <li><a href="#">Holly</a></li>
46 |           </ul>
47 |           <h4>Authors</h4>
48 |           <ul>
49 |             <li><a href="#">Skyler</a></li>
50 |             <li><a href="#">Jesse</a></li>
51 |             <li><a href="#">Mike</a></li>
52 |             <li><a href="#">Holly</a></li>
53 |           </ul>
54 |         </div>
55 |       </div>
56 |     </div>
57 |     <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
58 |     <script src="https://dhbhdrzi4tiry.cloudfront.net/cdn/sites/foundation.js"></script>
59 | 
60 |     <!-- CMS.js -->
61 |     <script src="//cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.12/es5-shim.min.js"></script>
62 |     <script src="../js/cms.js"></script>
63 |     <script>
64 |       $(document).foundation();
65 | 
66 |       var blog = new CMS({
67 |         elementId: 'cms',
68 |         mode: 'GITHUB',
69 |         github: {
70 |           username: 'chrisdiana',
71 |           repo: 'cms.js-themes',
72 |           branch: 'master',
73 |           host: 'https://api.github.com',
74 |           prefix: 'templates',
75 |         },
76 |         layoutDirectory: 'layouts/foundation-blog',
77 |         errorLayout: 'error',
78 |         defaultView: 'posts',
79 |         types: [
80 |           { name: 'posts', layout: { list: 'post-list', single: 'post' } },
81 |           { name: 'pages', layout: { list: 'page-list', single: 'page' } },
82 |         ],
83 |       });
84 |     </script>
85 |   </body>
86 | </html>


--------------------------------------------------------------------------------
/templates/layouts/blank/error.html:
--------------------------------------------------------------------------------
1 | <div>
2 |   <h1>404</h1>
3 |   <p>Sorry. What you were looking for doesn't seem to be there :(...</p>
4 | </div>
5 | 


--------------------------------------------------------------------------------
/templates/layouts/blank/page-list.html:
--------------------------------------------------------------------------------
 1 | <div>
 2 |   <h1><%= data.type %></h1>
 3 |   <% data.pages.forEach(function(page) { %>
 4 |     <h2><a href="<%= page.permalink %>"><%= page.title %></a></h2>
 5 |     <% if(page.excerpt) { %>
 6 |       <p><%= page.excerpt %></p>
 7 |     <% } %>
 8 |   <% }) %>
 9 | </div>
10 | 
11 | 


--------------------------------------------------------------------------------
/templates/layouts/blank/page.html:
--------------------------------------------------------------------------------
1 | <div>
2 |   <h1><%= data.title %></h1>
3 |   <%= data.body %>
4 | </div>
5 | 


--------------------------------------------------------------------------------
/templates/layouts/blank/post-list.html:
--------------------------------------------------------------------------------
 1 | <div>
 2 |   <% data.posts.forEach(function(post) { %>
 3 |     <% if(!post.draft) { %>
 4 |       <div>
 5 |         <h1><a href="<%= post.permalink %>"><%= post.title %></a></h1>
 6 |         <% if(post.date) { %>
 7 |           <span><%= post.date %> </span>
 8 |         <% } %>
 9 |         <% if(post.excerpt) { %>
10 |           <p><%= post.excerpt %></p>
11 |         <% } %>
12 |       </div>
13 |     <% } %>
14 |   <% }) %>
15 | </div>


--------------------------------------------------------------------------------
/templates/layouts/blank/post.html:
--------------------------------------------------------------------------------
 1 | <div>
 2 |   <h1><%= data.title %></h1>
 3 |   <% if(data.date) { %>
 4 |     <span><%= data.date %></span>
 5 |   <% } %>
 6 |   <% if(data.tags) { %>
 7 |     <% data.tags.forEach(function(tag) { %>
 8 |       <% if(tag) { %>
 9 |         <a href="#/posts?tag=<%= tag %>" class="post-tag"><%= tag %></a>
10 |       <% } %>
11 |     <% }) %>
12 |   <% } %>
13 |   <%= data.body %>
14 | </div>
15 | 


--------------------------------------------------------------------------------
/templates/layouts/bootstrap-blog/error.html:
--------------------------------------------------------------------------------
1 | <div class="error fade-in">
2 |   <h1>404</h1>
3 |   <p class="error-text">
4 |     Sorry. What you were looking for doesn't seem to be there :(...
5 |   </p>
6 | </div>


--------------------------------------------------------------------------------
/templates/layouts/bootstrap-blog/page-list.html:
--------------------------------------------------------------------------------
 1 | <h1>Pages</h1>
 2 | <hr>
 3 | <div class="pages-list fade-in">
 4 |   <% data.pages.forEach(function(page) { %>
 5 |     <h2>
 6 |       <a href="<%= page.permalink %>"><%= page.title %></a>
 7 |     </h2>
 8 |     <% if(page.excerpt) { %>
 9 |       <p><%= page.excerpt %></p>
10 |     <% } %>
11 |   <% }) %>
12 | </div>


--------------------------------------------------------------------------------
/templates/layouts/bootstrap-blog/page.html:
--------------------------------------------------------------------------------
1 | <div class="page fade-in">
2 |   <h1 class="page-title">
3 |     <%= data.title %>
4 |   </h1>
5 |   <div class="page-content">
6 |   	<%= data.body %>
7 |   </div>
8 | </div>


--------------------------------------------------------------------------------
/templates/layouts/bootstrap-blog/post-list.html:
--------------------------------------------------------------------------------
 1 | <div class="jumbotron p-3 p-md-5 text-white rounded bg-dark">
 2 |   <div class="px-0">
 3 |     <h1 class="display-4 font-italic">Title of a longer featured blog post</h1>
 4 |     <p class="lead my-3">Multiple lines of text that form the lede, informing new readers quickly and efficiently about what's most interesting in this post's contents.</p>
 5 |     <p class="lead mb-0"><a href="#/posts/2014-01-01-sample-blog-post" class="text-white font-weight-bold">Continue reading...</a></p>
 6 |   </div>
 7 | </div>
 8 | 
 9 | <h3 class="pb-3 mb-4 font-italic border-bottom">
10 |   From the Blog
11 | </h3>
12 | 
13 | <div class="blog-posts-list fade-in">
14 |   <% data.posts.forEach(function(post) { %>
15 |     <% if(!post.draft) { %>
16 |       <div class="blog-post">
17 |         <a href="<%= post.permalink %>">
18 |           <h2 class="blog-post-title"><%= post.title %></h2>
19 |         </a>
20 |         <% if(post.date) { %>
21 |           <p class="blog-post-meta"><%= post.date %> 
22 |             <% if(post.author) { %>
23 |               by <%= post.author %>
24 |             <% } %>
25 |           </p>
26 |         <% } %>
27 |         <% if(post.excerpt) { %>
28 |           <p><%= post.excerpt %></p>
29 |         <% } %>
30 |       </div>
31 |     <% } %>
32 |   <% }) %>
33 | </div>
34 | 
35 | <nav class="blog-pagination">
36 |   <a class="btn btn-outline-primary" href="#">Older</a>
37 |   <a class="btn btn-outline-secondary disabled" href="#">Newer</a>
38 | </nav>


--------------------------------------------------------------------------------
/templates/layouts/bootstrap-blog/post.html:
--------------------------------------------------------------------------------
 1 | <div class="blog-post fade-in">
 2 |   <h2 class="blog-post-title"><%= data.title %></h2>
 3 |   <% if(data.date) { %>
 4 |     <p class="blog-post-meta"><%= data.date %> by <a href="#">Mark</a></p>
 5 |   <% } %>
 6 |   <div class="blog-post-tags pb-4">
 7 |     <% if(data.tags) { %>
 8 |       <% data.tags.forEach(function(tag) { %>
 9 |         <% if(tag) { %>
10 |           <a href="#/posts?tag=<%= tag %>">
11 |             <button type="button" class="btn btn-primary btn-sm">
12 |               <%= tag %>
13 |             </button>
14 |           </a>
15 |         <% } %>
16 |       <% }) %>
17 |     <% } %>
18 |   </div>
19 |   <%= data.body %>
20 | </div>


--------------------------------------------------------------------------------
/templates/layouts/bootstrap-starter/error.html:
--------------------------------------------------------------------------------
1 | <div class="error fade-in">
2 |   <h1>404</h1>
3 |   <p class="error-text">
4 |     Sorry. What you were looking for doesn't seem to be there :(...
5 |   </p>
6 | </div>


--------------------------------------------------------------------------------
/templates/layouts/bootstrap-starter/page-list.html:
--------------------------------------------------------------------------------
 1 | <h1>Pages</h1>
 2 | <hr>
 3 | <div class="pages-list fade-in">
 4 |   <% data.pages.forEach(function(page) { %>
 5 |     <h2>
 6 |       <a href="<%= page.permalink %>"><%= page.title %></a>
 7 |     </h2>
 8 |     <% if(page.excerpt) { %>
 9 |       <p><%= page.excerpt %></p>
10 |     <% } %>
11 |   <% }) %>
12 | </div>
13 | 
14 | 


--------------------------------------------------------------------------------
/templates/layouts/bootstrap-starter/page.html:
--------------------------------------------------------------------------------
1 | <div class="page fade-in">
2 |   <h1 class="page-title">
3 |     <%= data.title %>
4 |   </h1>
5 |   <div class="page-content">
6 |   	<%= data.body %>
7 |   </div>
8 | </div>


--------------------------------------------------------------------------------
/templates/layouts/bootstrap-starter/post-list.html:
--------------------------------------------------------------------------------
 1 | <h1>Posts</h1>
 2 | <hr>
 3 | <div class="blog-posts-list fade-in">
 4 |   <% data.posts.forEach(function(post) { %>
 5 |     <% if(!post.draft) { %>
 6 |       <div class="blog-post">
 7 |         <a href="<%= post.permalink %>">
 8 |           <h2 class="blog-post-title"><%= post.title %></h2>
 9 |         </a>
10 |         <% if(post.date) { %>
11 |           <p class="blog-post-meta"><%= post.date %> 
12 |             <% if(post.author) { %>
13 |               by <%= post.author %>
14 |             <% } %>
15 |           </p>
16 |         <% } %>
17 |         <% if(post.excerpt) { %>
18 |           <p><%= post.excerpt %></p>
19 |         <% } %>
20 |       </div>
21 |     <% } %>
22 |   <% }) %>
23 | </div>


--------------------------------------------------------------------------------
/templates/layouts/bootstrap-starter/post.html:
--------------------------------------------------------------------------------
 1 | <div class="blog-post fade-in">
 2 |   <h2 class="blog-post-title"><%= data.title %></h2>
 3 |   <% if(data.date) { %>
 4 |     <p class="blog-post-meta"><%= data.date %> by <a href="#">Mark</a></p>
 5 |   <% } %>
 6 |   <div class="blog-post-tags pb-4">
 7 |     <% if(data.tags) { %>
 8 |       <% data.tags.forEach(function(tag) { %>
 9 |         <% if(tag) { %>
10 |           <a href="#/posts?tag=<%= tag %>">
11 |             <button type="button" class="btn btn-primary btn-sm">
12 |               <%= tag %>
13 |             </button>
14 |           </a>
15 |         <% } %>
16 |       <% }) %>
17 |     <% } %>
18 |   </div>
19 |   <%= data.body %>
20 | </div>


--------------------------------------------------------------------------------
/templates/layouts/bulma-basic/error.html:
--------------------------------------------------------------------------------
1 | <div class="error fade-in">
2 |   <h1>404</h1>
3 |   <p class="error-text">
4 |     Sorry. What you were looking for doesn't seem to be there :(...
5 |   </p>
6 | </div>
7 | 


--------------------------------------------------------------------------------
/templates/layouts/bulma-basic/page-list.html:
--------------------------------------------------------------------------------
 1 | <div class="card article fade-in">
 2 |   <div class="card-content">
 3 |   	<h1 class="is-size-1">Pages</h1>
 4 | 		<hr>
 5 | 	 	<% data.pages.forEach(function(page) { %>
 6 | 	    <h3 class="is-size-3">
 7 | 	      <a href="<%= page.permalink %>"><%= page.title %></a>
 8 | 	    </h3>
 9 | 	  <% }) %>
10 |   </div>
11 |  </div>


--------------------------------------------------------------------------------
/templates/layouts/bulma-basic/page.html:
--------------------------------------------------------------------------------
 1 | <div class="card article fade-in">
 2 |   <div class="card-content">
 3 | 	  <h1 class="is-size-1">
 4 | 	    <%= data.title %>
 5 | 	  </h1>
 6 | 	  <p>
 7 |   		<%= data.body %>
 8 |   	</p>
 9 |   </div>
10 | </div>


--------------------------------------------------------------------------------
/templates/layouts/bulma-basic/post-list.html:
--------------------------------------------------------------------------------
 1 | <% data.posts.forEach(function(post) { %>
 2 |   <% if(!post.draft) { %>
 3 |     <div class="section fade-in">
 4 |       <a href="<%= post.permalink %>">
 5 |         <p class="title article-title">
 6 |           <%= post.title %>
 7 |         </p>
 8 |       </a>
 9 |       <p class="subtitle is-6 article-subtitle has-text-grey-light">
10 |         <% if(post.author) { %>
11 |           <a href="#"><%= post.author %></a> on 
12 |         <% } %>
13 |         <% if(post.date) { %>
14 |           <%= post.date %>
15 |         <% } %>
16 |       </p>
17 |       <% if(post.excerpt) { %>
18 |         <p><%= post.excerpt %></p>
19 |       <% } %>
20 |       </div>
21 |     </div>
22 |   <% } %>
23 | <% }) %>


--------------------------------------------------------------------------------
/templates/layouts/bulma-basic/post.html:
--------------------------------------------------------------------------------
 1 | <div class="section fade-in">
 2 |   <p class="title article-title">
 3 |     <%= data.title %>
 4 |   </p>
 5 |   <p class="subtitle is-6 article-subtitle has-text-grey-light">
 6 |     <% if(data.author) { %>
 7 |       <a href="#"><%= data.author %></a> on 
 8 |     <% } %>
 9 |     <% if(data.date) { %>
10 |       <%= data.date %>
11 |     <% } %>
12 |   </p>
13 |   <div class="tags">
14 |     <% if(data.tags) { %>
15 |       <% data.tags.forEach(function(tag) { %>
16 |         <% if(tag) { %>
17 |           <a href="#/posts?tag=<%= tag %>">
18 |             <span class="tag is-primary"><%= tag %></span>
19 |           </a>
20 |         <% } %>
21 |       <% }) %>
22 |     <% } %>
23 |   </div>
24 |   <%= data.body %>
25 |   </div>
26 | </div>


--------------------------------------------------------------------------------
/templates/layouts/bulma-blog/error.html:
--------------------------------------------------------------------------------
1 | <div class="error fade-in">
2 |   <h1>404</h1>
3 |   <p class="error-text">
4 |     Sorry. What you were looking for doesn't seem to be there :(...
5 |   </p>
6 | </div>


--------------------------------------------------------------------------------
/templates/layouts/bulma-blog/page-list.html:
--------------------------------------------------------------------------------
 1 | <div class="card article fade-in">
 2 |   <div class="card-content">
 3 |   	<h1 class="is-size-1">Pages</h1>
 4 | 		<hr>
 5 | 	 	<% data.pages.forEach(function(page) { %>
 6 | 	    <h3 class="is-size-3">
 7 | 	      <a href="<%= page.permalink %>"><%= page.title %></a>
 8 | 	    </h3>
 9 | 	  <% }) %>
10 |   </div>
11 | </div>


--------------------------------------------------------------------------------
/templates/layouts/bulma-blog/page.html:
--------------------------------------------------------------------------------
 1 | <div class="card article fade-in">
 2 |   <div class="card-content">
 3 | 	  <h1 class="is-size-1">
 4 | 	    <%= data.title %>
 5 | 	  </h1>
 6 | 	  <p>
 7 |   		<%= data.body %>
 8 |   	</p>
 9 |   </div>
10 | </div>


--------------------------------------------------------------------------------
/templates/layouts/bulma-blog/post-list.html:
--------------------------------------------------------------------------------
 1 | <% data.posts.forEach(function(post) { %>
 2 |   <% if(!post.draft) { %>
 3 |     <div class="card article fade-in">
 4 |       <div class="card-content">
 5 |         <div class="media">
 6 |           <div class="media-center">
 7 |             <img src="http://i.pravatar.cc/300" class="author-image" alt="Placeholder image">
 8 |           </div>
 9 |           <div class="media-content has-text-centered">
10 |             <a href="<%= post.permalink %>">
11 |               <p class="title article-title">
12 |                 <%= post.title %>
13 |               </p>
14 |             </a>
15 |             <div class="tags has-addons level-item">
16 |               <% if(post.author) { %>
17 |                 <span class="tag is-rounded is-info"><%= post.author %></span>
18 |               <% } %>
19 |               <% if(post.date) { %>
20 |                 <span class="tag is-rounded"><%= post.date %> </span>
21 |               <% } %>
22 |             </div> 
23 |           </div>
24 |         </div>
25 |         <div class="content article-body">
26 |           <% if(post.excerpt) { %>
27 |             <p><%= post.excerpt %></p>
28 |           <% } %>
29 |         </div>
30 |       </div>
31 |     </div>
32 |   <% } %>
33 | <% }) %>


--------------------------------------------------------------------------------
/templates/layouts/bulma-blog/post.html:
--------------------------------------------------------------------------------
 1 | <div class="card article fade-in">
 2 |   <div class="card-content">
 3 |     <div class="media">
 4 |       <div class="media-center">
 5 |         <img src="http://i.pravatar.cc/300" class="author-image" alt="Placeholder image">
 6 |       </div>
 7 |       <div class="media-content has-text-centered">
 8 |         <p class="title article-title">
 9 |           <%= data.title %>
10 |         </p>
11 |         <p class="subtitle is-6 article-subtitle">
12 |           <% if(data.author) { %>
13 |             <a href="#"><%= data.author %></a> on 
14 |           <% } %>
15 |           <% if(data.date) { %>
16 |             <%= data.date %>
17 |           <% } %>
18 |         </p>
19 |       </div>
20 |       <div class="tags">
21 |         <% if(data.tags) { %>
22 |           <% data.tags.forEach(function(tag) { %>
23 |             <% if(tag) { %>
24 |               <a href="#/posts?tag=<%= tag %>">
25 |                 <span class="tag is-rounded is-info"><%= tag %></span>
26 |               </a>
27 |             <% } %>
28 |           <% }) %>
29 |         <% } %>
30 |       </div>
31 |     </div>
32 |     <div class="content article-body">
33 |       <%= data.body %>
34 |     </div>
35 |   </div>
36 | </div>


--------------------------------------------------------------------------------
/templates/layouts/foundation-blog/error.html:
--------------------------------------------------------------------------------
1 | <div class="error fade-in">
2 |   <h1>404</h1>
3 |   <p class="error-text">
4 |     Sorry. What you were looking for doesn't seem to be there :(...
5 |   </p>
6 | </div>


--------------------------------------------------------------------------------
/templates/layouts/foundation-blog/page-list.html:
--------------------------------------------------------------------------------
1 | <h1>Pages</h1>
2 | <hr>
3 | <div class="pages-list fade-in">
4 |   <% data.pages.forEach(function(page) { %>
5 |     <h2>
6 |       <a href="<%= page.permalink %>"><%= page.title %></a>
7 |     </h2>
8 |   <% }) %>
9 | </div>


--------------------------------------------------------------------------------
/templates/layouts/foundation-blog/page.html:
--------------------------------------------------------------------------------
1 | <div class="page fade-in">
2 |   <h1 class="page-title">
3 |     <%= data.title %>
4 |   </h1>
5 |   <div class="page-content">
6 |   	<%= data.body %>
7 |   </div>
8 | </div>


--------------------------------------------------------------------------------
/templates/layouts/foundation-blog/post-list.html:
--------------------------------------------------------------------------------
 1 | <div class="blog-posts-list fade-in">
 2 |   <% data.posts.forEach(function(post) { %>
 3 |     <% if(!post.draft) { %>
 4 |       <div class="blog-post">
 5 |         <a href="<%= post.permalink %>">
 6 |           <h3 class="blog-post-title">
 7 |             <%= post.title %>
 8 |             <% if(post.date) { %>
 9 |               <small><%= post.date %></small>
10 |             <% } %>
11 |           </h3>
12 |         </a>
13 |         <img class="thumbnail" src="https://placehold.it/850x350">
14 |         <% if(post.excerpt) { %>
15 |           <p><%= post.excerpt %></p>
16 |         <% } %>
17 |         <div class="callout">
18 |           <ul class="menu simple">
19 |             <li>
20 |               <a href="#">
21 |               <% if(post.author) { %>
22 |                 Author: <%= post.author %>
23 |               <% } %>
24 |               </a>
25 |             </li>
26 |             <li><a href="#">Comments: 3</a></li>
27 |           </ul>
28 |         </div>
29 |       </div>
30 |     <% } %>
31 |   <% }) %>
32 | </div>
33 | 
34 | <div class="row column">
35 |     <ul class="pagination" role="navigation" aria-label="Pagination">
36 |         <li class="disabled">Previous</li>
37 |         <li class="current"><span class="show-for-sr">You're on page</span> 1</li>
38 |         <li><a href="#" aria-label="Page 2">2</a></li>
39 |         <li><a href="#" aria-label="Page 3">3</a></li>
40 |         <li><a href="#" aria-label="Page 4">4</a></li>
41 |         <li class="ellipsis"></li>
42 |         <li><a href="#" aria-label="Page 12">12</a></li>
43 |         <li><a href="#" aria-label="Page 13">13</a></li>
44 |         <li><a href="#" aria-label="Next page">Next</a></li>
45 |     </ul>
46 | </div>


--------------------------------------------------------------------------------
/templates/layouts/foundation-blog/post.html:
--------------------------------------------------------------------------------
 1 | <div class="blog-post">
 2 |   <h3 class="blog-post-title">
 3 |     <%= data.title %>
 4 |     <% if(data.date) { %>
 5 |       <small><%= data.date %></small>
 6 |     <% } %>
 7 |   </h3>
 8 |   <img class="thumbnail" src="https://placehold.it/850x350">
 9 |   <div class="blog-post-tags pb-4">
10 |     <% if(data.tags) { %>
11 |       <% data.tags.forEach(function(tag) { %>
12 |         <% if(tag) { %>
13 |           <a href="#/posts?tag=<%= tag %>">
14 |             <button type="button" class="btn btn-primary btn-sm">
15 |               <%= tag %>
16 |             </button>
17 |           </a>
18 |         <% } %>
19 |       <% }) %>
20 |     <% } %>
21 |   </div>
22 |   <%= data.body %>
23 |   <div class="callout">
24 |     <ul class="menu simple">
25 |       <li>
26 |         <a href="#">
27 |         <% if(data.author) { %>
28 |           Author: <%= data.author %>
29 |         <% } %>
30 |         </a>
31 |       </li>
32 |       <li><a href="#">Comments: 3</a></li>
33 |     </ul>
34 |   </div>
35 | </div>


--------------------------------------------------------------------------------
/templates/layouts/medium/error.html:
--------------------------------------------------------------------------------
1 | <div class="error fade-in">
2 |   <h3>404</h3>
3 |   <p class="error-text">
4 |     Sorry. What you were looking for doesn't seem to be there :(...
5 |   </p>
6 | </div>


--------------------------------------------------------------------------------
/templates/layouts/medium/page-list.html:
--------------------------------------------------------------------------------
1 | <div class="pages-list fade-in">
2 |   <h3>Pages</h3>
3 |   <% data.pages.forEach(function(page) { %>
4 |     <h4>
5 |       <a href="<%= page.permalink %>"><%= page.title %></a>
6 |     </h4>
7 |   <% }) %>
8 | </div>


--------------------------------------------------------------------------------
/templates/layouts/medium/page.html:
--------------------------------------------------------------------------------
1 | <div class="page fade-in">
2 |   <h1 class="page-title">
3 |     <%= data.title %>
4 |   </h1>
5 |   <div class="page-content">
6 |   	<%= data.body %>
7 |   </div>
8 | </div>


--------------------------------------------------------------------------------
/templates/layouts/medium/post-list.html:
--------------------------------------------------------------------------------
 1 | <div class="posts-list fade-in">
 2 |   <% data.posts.forEach(function(post) { %>
 3 |     <% if(!post.draft) { %>
 4 |       <div class="post">
 5 |         <h1 class="post-title">
 6 |           <a href="<%= post.permalink %>"><%= post.title %></a>
 7 |         </h1>
 8 |         <% if(post.date) { %>
 9 |           <div class="post-meta">
10 |             <span><%= post.date %></span>
11 |           </div>
12 |         <% } %>
13 |         <div class="post-content">
14 |           <% if(post.excerpt) { %>
15 |             <p><%= post.excerpt %></p>
16 |           <% } %>
17 |         </div>
18 |       </div>
19 |     <% } %>
20 |   <% }) %>
21 | </div>


--------------------------------------------------------------------------------
/templates/layouts/medium/post.html:
--------------------------------------------------------------------------------
 1 | <div class="post fade-in">
 2 |   <h1 class="post-title">
 3 |     <%= data.title %>
 4 |   </h1>
 5 |   <% if(data.date) { %>
 6 |     <div class="post-meta">
 7 |       <span><%= data.date %></span>
 8 |     </div>
 9 |   <% } %>
10 |   <div class="post-tags">
11 |     <% if(data.tags) { %>
12 |       <% data.tags.forEach(function(tag) { %>
13 |         <% if(tag) { %>
14 |           <a href="#/posts?tag=<%= tag %>" class="post-tag"><%= tag %></a>
15 |         <% } %>
16 |       <% }) %>
17 |     <% } %>
18 |   </div>
19 |   <div class="post-content">
20 |     <%= data.body %>
21 |   </div>
22 | </div>


--------------------------------------------------------------------------------
/templates/layouts/poole/error.html:
--------------------------------------------------------------------------------
1 | <!-- Error Template -->
2 | <div class="error fade-in">
3 |   <h1>404</h1>
4 |   <p class="error-text">
5 |     Sorry. What you were looking for doesn't seem to be there :(...
6 |   </p>
7 | </div>


--------------------------------------------------------------------------------
/templates/layouts/poole/page-list.html:
--------------------------------------------------------------------------------
 1 | <!-- Page List Template -->
 2 | <div class="pages-list fade-in">
 3 |   <h1><%= data.type %></h1>
 4 |   <% data.pages.forEach(function(page) { %>
 5 |     <h2>
 6 |       <a href="<%= page.permalink %>"><%= page.title %></a>
 7 |     </h2>
 8 |     <% if(page.excerpt) { %>
 9 |       <p><%= page.excerpt %></p>
10 |     <% } %>
11 |   <% }) %>
12 | </div>


--------------------------------------------------------------------------------
/templates/layouts/poole/page.html:
--------------------------------------------------------------------------------
1 | <!-- Page Template -->
2 | <article class="page fade-in">
3 |   <h1 class="page-title">
4 |     <%= data.title %>
5 |   </h1>
6 |   <div class="page-content">
7 |   	<%= data.body %>
8 |   </div>
9 | </article>


--------------------------------------------------------------------------------
/templates/layouts/poole/post-list.html:
--------------------------------------------------------------------------------
 1 | <!-- Post List Template -->
 2 | <div class="posts-list fade-in">
 3 |   <% data.posts.forEach(function(post) { %>
 4 |     <% if(!post.draft) { %>
 5 |       <article class="post">
 6 |         <h1 class="post-title">
 7 |           <a href="<%= post.permalink %>"><%= post.title %></a>
 8 |         </h1>
 9 |         <time class="post-date">5/28/2015</time>
10 |         <div class="post-content">
11 |           <% if(post.excerpt) { %>
12 |             <p><%= post.excerpt %></p>
13 |           <% } %>
14 |         </div>
15 |       </article>
16 |     <% } %>
17 |   <% }) %>
18 | </div>


--------------------------------------------------------------------------------
/templates/layouts/poole/post.html:
--------------------------------------------------------------------------------
 1 | <!-- Post Template -->
 2 | <article class="post fade-in">
 3 |   <h1 class="post-title">
 4 |     <%= data.title %>
 5 |   </h1>
 6 |   <% if(data.date) { %>
 7 |     <time class="post-date">
 8 |       <span><%= data.date %></span>
 9 |     </time>
10 |   <% } %>
11 |   <div class="post-tags">
12 |     <% if(data.tags) { %>
13 |       <% data.tags.forEach(function(tag) { %>
14 |         <% if(tag) { %>
15 |           <a href="#/posts?tag=<%= tag %>" class="post-tag"><%= tag %></a>
16 |         <% } %>
17 |       <% }) %>
18 |     <% } %>
19 |   </div>
20 |   <div class="post-content">
21 |     <%= data.body %>
22 |   </div>
23 | </article>


--------------------------------------------------------------------------------
/templates/layouts/pure-blog/error.html:
--------------------------------------------------------------------------------
1 | <div class="error fade-in">
2 |   <h3>404</h3>
3 |   <p class="error-text">
4 |     Sorry. What you were looking for doesn't seem to be there :(...
5 |   </p>
6 | </div>


--------------------------------------------------------------------------------
/templates/layouts/pure-blog/page-list.html:
--------------------------------------------------------------------------------
1 | <h1 class="content-subhead">Pages</h1>
2 | <div class="pages-list fade-in">
3 |   <% data.pages.forEach(function(page) { %>
4 |     <h4>
5 |       <a href="<%= page.permalink %>"><%= page.title %></a>
6 |     </h4>
7 |   <% }) %>
8 | </div>


--------------------------------------------------------------------------------
/templates/layouts/pure-blog/page.html:
--------------------------------------------------------------------------------
1 | <div class="page fade-in">
2 |   <h1 class="page-title">
3 |     <%= data.title %>
4 |   </h1>
5 |   <p><%= data.body %></p>
6 | </div>


--------------------------------------------------------------------------------
/templates/layouts/pure-blog/post-list.html:
--------------------------------------------------------------------------------
 1 | <h1 class="content-subhead">Recent Posts</h1>
 2 | <div class="posts-list fade-in">
 3 |   <% data.posts.forEach(function(post) { %>
 4 |     <% if(!post.draft) { %>
 5 |       <section class="post">
 6 |         <header class="post-header">
 7 |           <img width="48" height="48" alt="Placeholder" class="post-avatar" src="http://i.pravatar.cc/48">
 8 |           <h2 class="post-title">
 9 |           <a href="<%= post.permalink %>"><%= post.title %></a>
10 |           </h2>
11 |           <p class="post-meta">
12 |             <% if(post.date) { %>
13 |               <span><%= post.date %></span>
14 |             <% } %>
15 |             <% if(post.author) { %>
16 |               By <a href="#" class="post-author"><%= post.author %></a>
17 |             <% } %>
18 |             <% if(post.tags) { %>
19 |               <% post.tags.forEach(function(tag) { %>
20 |                 <% if(tag) { %>
21 |                 <a class="post-category" href="#/posts?tag=<%= tag %>">
22 |                   <%= tag %>
23 |                 </a>
24 |                 <% } %>
25 |               <% }) %>
26 |             <% } %>
27 |           </p>
28 |         </header>
29 |         <div class="post-description">
30 |           <% if(post.excerpt) { %>
31 |             <p><%= post.excerpt %></p>
32 |           <% } %>
33 |         </div>
34 |       </section>
35 |     <% } %>
36 |   <% }) %>
37 | </div>


--------------------------------------------------------------------------------
/templates/layouts/pure-blog/post.html:
--------------------------------------------------------------------------------
 1 | <section class="post">
 2 |   <header class="post-header">
 3 |     <img width="48" height="48" alt="Placeholder" class="post-avatar" src="http://i.pravatar.cc/48">
 4 |       <h2 class="post-title">
 5 |         <a href="<%= data.permalink %>"><%= data.title %></a>
 6 |       </h2>
 7 |       <p class="post-meta">
 8 |         <% if(data.date) { %>
 9 |           <span><%= data.date %></span>
10 |         <% } %>
11 |         <% if(data.author) { %>
12 |           By <a href="#" class="post-author"><%= data.author %></a> 
13 |         <% } %>
14 |         <% if(data.tags) { %>
15 |           <% data.tags.forEach(function(tag) { %>
16 |             <% if(tag) { %>
17 |               <a class="post-category" href="#/posts?tag=<%= tag %>">
18 |                 <%= tag %>
19 |               </a>
20 |             <% } %>
21 |           <% }) %>
22 |         <% } %>
23 |       </p>
24 |   </header>
25 |   <div class="post-description">
26 |     <p><%= data.body %></p>
27 |   </div>
28 | </section>


--------------------------------------------------------------------------------
/templates/layouts/skeleton/error.html:
--------------------------------------------------------------------------------
1 | <div class="error fade-in">
2 |   <h3>404</h3>
3 |   <p class="error-text">
4 |     Sorry. What you were looking for doesn't seem to be there :(...
5 |   </p>
6 | </div>


--------------------------------------------------------------------------------
/templates/layouts/skeleton/page-list.html:
--------------------------------------------------------------------------------
1 | <div class="pages-list fade-in">
2 |   <h3>Pages</h3>
3 |   <% data.pages.forEach(function(page) { %>
4 |     <h4>
5 |       <a href="<%= page.permalink %>"><%= page.title %></a>
6 |     </h4>
7 |   <% }) %>
8 | </div>


--------------------------------------------------------------------------------
/templates/layouts/skeleton/page.html:
--------------------------------------------------------------------------------
1 | <div class="page fade-in">
2 |   <h1 class="page-title">
3 |     <%= data.title %>
4 |   </h1>
5 |   <div class="page-content">
6 |   	<%= data.body %>
7 |   </div>
8 | </div>


--------------------------------------------------------------------------------
/templates/layouts/skeleton/post-list.html:
--------------------------------------------------------------------------------
 1 | <div class="posts-list fade-in">
 2 |   <% data.posts.forEach(function(post) { %>
 3 |     <% if(!post.draft) { %>
 4 |       <article class="post">
 5 |         <h3 class="post-title">
 6 |           <a href="<%= post.permalink %>"><%= post.title %></a>
 7 |         </h3>
 8 |         <% if(post.date) { %>
 9 |           <div class="post-date">
10 |             <span><%= post.date %></span>
11 |           </div>
12 |         <% } %>
13 |         <div class="post-content">
14 |           <% if(post.excerpt) { %>
15 |             <p><%= post.excerpt %></p>
16 |           <% } %>
17 |         </div>
18 |       </article>
19 |     <% } %>
20 |   <% }) %>
21 | </div>


--------------------------------------------------------------------------------
/templates/layouts/skeleton/post.html:
--------------------------------------------------------------------------------
 1 | <div class="post fade-in">
 2 |   <h3 class="post-title">
 3 |     <%= data.title %>
 4 |   </h3>
 5 |   <% if(data.date) { %>
 6 |     <div class="post-date">
 7 |       <span><%= data.date %></span>
 8 |     </div>
 9 |   <% } %>
10 |   <div class="post-tags">
11 |     <% if(data.tags) { %>
12 |       <% data.tags.forEach(function(tag) { %>
13 |         <% if(tag) { %>
14 |           <a href="#/posts?tag=<%= tag %>" class="post-tag"><%= tag %></a>
15 |         <% } %>
16 |       <% }) %>
17 |     <% } %>
18 |   </div>
19 |   <div class="post-content">
20 |     <%= data.body %>
21 |   </div>
22 | </div>


--------------------------------------------------------------------------------
/templates/medium-dark.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html class="no-js" lang="">
 3 |   <head>
 4 |     <meta charset="utf-8">
 5 |     <meta http-equiv="x-ua-compatible" content="ie=edge">
 6 |     <title>Medium Style Dark - CMS.js</title>
 7 |     <meta name="description" content="">
 8 |     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 9 |     <link rel="manifest" href="site.webmanifest">
10 |     <link rel="apple-touch-icon" href="icon.png">
11 |     <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css">
12 |     <link rel="stylesheet" href="./css/medium-dark.css">
13 |     <link href="./css/animations.css" rel="stylesheet">
14 |     <noscript>Please enable JavaScript to view this site.</noscript>
15 |   </head>
16 |   <body>
17 |     <!--[if lte IE 9]>
18 |     <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
19 |     <![endif]-->
20 |     <div class="content">
21 | 
22 |       <!-- CMS.js -->
23 |       <div id="cms"></div>
24 | 
25 |     </div>
26 |     
27 |     <!-- CMS.js -->
28 |     <script src="//cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.12/es5-shim.min.js"></script>
29 |     <script src="../js/cms.js"></script>
30 |     <script>
31 |     var blog = new CMS({
32 |       elementId: 'cms',
33 |       mode: 'GITHUB',
34 |       github: {
35 |         username: 'chrisdiana',
36 |         repo: 'cms.js-themes',
37 |         branch: 'master',
38 |         host: 'https://api.github.com',
39 |         prefix: 'templates',
40 |       },
41 |       layoutDirectory: 'layouts/medium',
42 |       errorLayout: 'error',
43 |       defaultView: 'posts',
44 |       types: [
45 |         { name: 'posts', layout: { list: 'post-list', single: 'post' }},
46 |         { name: 'pages', layout: { list: 'page-list', single: 'page' }},
47 |       ],
48 |     });
49 |     </script>
50 |   </body>
51 | </html>


--------------------------------------------------------------------------------
/templates/medium-light.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html class="no-js" lang="">
 3 |   <head>
 4 |     <meta charset="utf-8">
 5 |     <meta http-equiv="x-ua-compatible" content="ie=edge">
 6 |     <title>Medium Style Light - CMS.js</title>
 7 |     <meta name="description" content="">
 8 |     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 9 |     <link rel="manifest" href="site.webmanifest">
10 |     <link rel="apple-touch-icon" href="icon.png">
11 |     <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css">
12 |     <link rel="stylesheet" href="./css/medium-light.css">
13 |     <link href="./css/animations.css" rel="stylesheet">
14 |     <noscript>Please enable JavaScript to view this site.</noscript>
15 |   </head>
16 |   <body>
17 |     <!--[if lte IE 9]>
18 |     <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
19 |     <![endif]-->
20 |     <div class="content">
21 | 
22 |       <!-- CMS.js -->
23 |       <div id="cms"></div>
24 | 
25 |     </div>
26 |     
27 |     <!-- CMS.js -->
28 |     <script src="//cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.12/es5-shim.min.js"></script>
29 |     <script src="../js/cms.js"></script>
30 |     <script>
31 |     var blog = new CMS({
32 |       elementId: 'cms',
33 |       mode: 'GITHUB',
34 |       github: {
35 |         username: 'chrisdiana',
36 |         repo: 'cms.js-themes',
37 |         branch: 'master',
38 |         host: 'https://api.github.com',
39 |         prefix: 'templates',
40 |       },
41 |       layoutDirectory: 'layouts/medium',
42 |       errorLayout: 'error',
43 |       defaultView: 'posts',
44 |       types: [
45 |         { name: 'posts', layout: { list: 'post-list', single: 'post' }},
46 |         { name: 'pages', layout: { list: 'page-list', single: 'page' }},
47 |       ],
48 |     });
49 |     </script>
50 |   </body>
51 | </html>


--------------------------------------------------------------------------------
/templates/pages/.htaccess:
--------------------------------------------------------------------------------
1 | Options Indexes
2 | 


--------------------------------------------------------------------------------
/templates/pages/about.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: About
3 | ---
4 | 
5 | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Morbi tincidunt ornare massa eget egestas purus viverra. Phasellus faucibus scelerisque eleifend donec pretium vulputate sapien. Potenti nullam ac tortor vitae. Vitae sapien pellentesque habitant morbi tristique. Aliquam sem et tortor consequat id porta nibh venenatis cras. Integer vitae justo eget magna fermentum iaculis eu. Ut enim blandit volutpat maecenas volutpat blandit aliquam etiam. Mattis enim ut tellus elementum sagittis. Adipiscing enim eu turpis egestas pretium aenean pharetra magna. Ullamcorper malesuada proin libero nunc consequat interdum varius. Pellentesque id nibh tortor id aliquet lectus proin nibh nisl. Est ullamcorper eget nulla facilisi etiam dignissim diam quis enim. Eget nunc scelerisque viverra mauris in aliquam sem fringilla. Vitae tempus quam pellentesque nec nam aliquam sem et tortor.
6 | 
7 | Tellus molestie nunc non blandit massa. Porttitor leo a diam sollicitudin. Malesuada pellentesque elit eget gravida cum sociis natoque. Ultricies leo integer malesuada nunc vel risus commodo viverra. Amet porttitor eget dolor morbi non arcu. Bibendum arcu vitae elementum curabitur vitae nunc. Ut sem nulla pharetra diam sit amet. Ac feugiat sed lectus vestibulum mattis ullamcorper. Eu volutpat odio facilisis mauris sit amet massa vitae. Semper eget duis at tellus at urna condimentum mattis pellentesque. Tincidunt dui ut ornare lectus sit amet. Sed augue lacus viverra vitae congue eu. Nisi lacus sed viverra tellus. Sed id semper risus in. Urna nunc id cursus metus aliquam.


--------------------------------------------------------------------------------
/templates/pages/links.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Links
3 | ---
4 | 
5 | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Morbi tincidunt ornare massa eget egestas purus viverra. Phasellus faucibus scelerisque eleifend donec pretium vulputate sapien. Potenti nullam ac tortor vitae. Vitae sapien pellentesque habitant morbi tristique. Aliquam sem et tortor consequat id porta nibh venenatis cras. Integer vitae justo eget magna fermentum iaculis eu. Ut enim blandit volutpat maecenas volutpat blandit aliquam etiam. Mattis enim ut tellus elementum sagittis. Adipiscing enim eu turpis egestas pretium aenean pharetra magna. Ullamcorper malesuada proin libero nunc consequat interdum varius. Pellentesque id nibh tortor id aliquet lectus proin nibh nisl. Est ullamcorper eget nulla facilisi etiam dignissim diam quis enim. Eget nunc scelerisque viverra mauris in aliquam sem fringilla. Vitae tempus quam pellentesque nec nam aliquam sem et tortor.
6 | 
7 | Tellus molestie nunc non blandit massa. Porttitor leo a diam sollicitudin. Malesuada pellentesque elit eget gravida cum sociis natoque. Ultricies leo integer malesuada nunc vel risus commodo viverra. Amet porttitor eget dolor morbi non arcu. Bibendum arcu vitae elementum curabitur vitae nunc. Ut sem nulla pharetra diam sit amet. Ac feugiat sed lectus vestibulum mattis ullamcorper. Eu volutpat odio facilisis mauris sit amet massa vitae. Semper eget duis at tellus at urna condimentum mattis pellentesque. Tincidunt dui ut ornare lectus sit amet. Sed augue lacus viverra vitae congue eu. Nisi lacus sed viverra tellus. Sed id semper risus in. Urna nunc id cursus metus aliquam.


--------------------------------------------------------------------------------
/templates/poole.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 |   <head>
 4 |     <meta charset="utf-8">
 5 |     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 6 |     <title>CMS.js</title>
 7 |     <meta name="description" content="The JavaScript Site Generator">
 8 |     <meta name="author" content="">
 9 |     <meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
10 |     <link rel="stylesheet" href="./css/animations.css">
11 |     <link rel="stylesheet" href="./css/poole.min.css">
12 |     <link rel="stylesheet" href="./css/poole.overrides.min.css">
13 |     <!--[if lt IE 9]>
14 |       <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
15 |     <![endif]-->
16 |     <noscript>Please enable JavaScript to view this site.</noscript>
17 |   </head>
18 |   <body>
19 |     <!-- Main Container -->
20 |     <div class="container content">
21 |       <!-- Header -->
22 |       <header class="masthead">
23 |         <h3 class="masthead-title">
24 |         <a href="#" class="sitename" title="Home">
25 |           CMS.js
26 |         </a>
27 |         <small class="tagline">
28 |           The Javascript Site Generator
29 |         </small>
30 |         </h3>
31 |         <!-- Navigation -->
32 |         <nav class="nav">
33 |           <ul>
34 |             <li><a href="#/posts">Posts</a></li>
35 |             <li><a href="//github.com/chrisdiana/cms.js" target="_blank">Github</a></li>
36 |             <li><a href="#/pages/about">About</a></li>
37 |             <li><a href="#/pages/links">Links</a></li>
38 |           </ul>
39 |         </nav>
40 |       </header>
41 | 
42 |       <!-- CMS -->
43 |       <div id="cms"></div>
44 | 
45 |       <!-- Footer -->
46 |       <footer class="footer">
47 |         <small class="footer-text">
48 |         </small>
49 |       </footer>
50 |     </div>
51 | 
52 |     <!-- CMS.js -->
53 |     <script src="//cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.12/es5-shim.min.js"></script>
54 |     <script src="../js/cms.js"></script>
55 |     <script>
56 |     var blog = new CMS({
57 |       elementId: 'cms',
58 |       mode: 'GITHUB',
59 |       github: {
60 |         username: 'chrisdiana',
61 |         repo: 'cms.js-themes',
62 |         branch: 'master',
63 |         host: 'https://api.github.com',
64 |         prefix: 'templates',
65 |       },
66 |       layoutDirectory: 'layouts/medium',
67 |       errorLayout: 'error',
68 |       defaultView: 'posts',
69 |       types: [
70 |         { name: 'posts', layout: { list: 'post-list', single: 'post' }},
71 |         { name: 'pages', layout: { list: 'page-list', single: 'page' }},
72 |       ],
73 |     });
74 |     </script>
75 |   </body>
76 | </html>


--------------------------------------------------------------------------------
/templates/posts/.htaccess:
--------------------------------------------------------------------------------
1 | Options Indexes
2 | 


--------------------------------------------------------------------------------
/templates/posts/2015-05-10-new-feature.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | layout: post
 3 | title: New feature
 4 | excerpt: Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean lacinia bibendum nulla sed consectetur.
 5 | author: Chris
 6 | ---
 7 | 
 8 | Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean lacinia bibendum nulla sed consectetur. Etiam porta sem malesuada magna mollis euismod. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
 9 | 
10 | * Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
11 | * Donec id elit non mi porta gravida at eget metus.
12 | * Nulla vitae elit libero, a pharetra augue.
13 | 
14 | Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue.
15 | 


--------------------------------------------------------------------------------
/templates/posts/2017-08-20-another-example-post.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | layout: post
 3 | title: Another blog post
 4 | excerpt: Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum.
 5 | tags: sampletag
 6 | author: Jacob
 7 | ---
 8 | 
 9 | Cum sociis natoque penatibus et magnis [dis parturient montes](#), nascetur ridiculus mus. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum.
10 | 
11 | Curabitur blandit tempus porttitor. **Nullam quis risus eget urna mollis** ornare vel eu leo. Nullam id ~~dolor id~~ nibh ultricies vehicula ut id elit.
12 | 
13 | Etiam porta *sem malesuada magna* mollis euismod. Cras mattis consectetur purus sit amet fermentum. Aenean lacinia bibendum nulla sed consectetur.
14 | 


--------------------------------------------------------------------------------
/templates/posts/2018-03-01-sample-blog-post.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | layout: post
 3 | title: Sample blog post
 4 | excerpt: This blog post shows a few different types of content that's supported and styled with Markdown. Basic typography, images, and code are all supported.
 5 | date: 2018-03-01
 6 | tags: sampletag
 7 | author: Mark
 8 | ---
 9 | 
10 | This blog post shows a few different types of content that's supported and styled with Markdown. Basic typography, images, and code are all supported.
11 | 
12 | -----
13 | 
14 | Cum sociis natoque penatibus et magnis [dis parturient montes](#), nascetur ridiculus mus. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum.
15 | 
16 | Curabitur blandit tempus porttitor. **Nullam quis risus eget urna mollis** ornare vel eu leo. Nullam id ~~dolor id~~ nibh ultricies vehicula ut id elit.
17 | 
18 | Etiam porta *sem malesuada magna* mollis euismod.
19 | 
20 | > Cras mattis consectetur purus sit amet fermentum. Aenean lacinia bibendum nulla sed consectetur.
21 | 
22 | ## Heading
23 | Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
24 | 
25 | ### Sub-heading
26 | 
27 | Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
28 | 
29 | `Example code block`
30 | 
31 | Aenean lacinia bibendum nulla sed consectetur. Etiam porta sem malesuada magna mollis euismod. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa.
32 | 
33 | ### Sub-heading
34 | 
35 | Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean lacinia bibendum nulla sed consectetur. Etiam porta sem malesuada magna mollis euismod. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
36 | 
37 | * Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
38 | * Donec id elit non mi porta gravida at eget metus.
39 | * Nulla vitae elit libero, a pharetra augue.
40 | 
41 | Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue.
42 | 
43 | 1. Vestibulum id ligula porta felis euismod semper.
44 | 2. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
45 | 3. Maecenas sed diam eget risus varius blandit sit amet non magna.
46 | 
47 | Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis.


--------------------------------------------------------------------------------
/templates/pure-blog.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html lang="en">
 3 |   <head>
 4 |     <meta charset="utf-8">
 5 |     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 6 |     <meta name="description" content="A layout example that shows off a blog page with a list of posts.">
 7 |     <title>Pure + CMS.js</title>
 8 |     <link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/pure-min.css" integrity="sha384-" crossorigin="anonymous">
 9 |     <!--[if lte IE 8]>
10 |     <link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/grids-responsive-old-ie-min.css">
11 |     <![endif]-->
12 |     <!--[if gt IE 8]><!-->
13 |     <link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/grids-responsive-min.css">
14 |     <!--<![endif]-->
15 |     <link rel="stylesheet" href="./css/pure-blog.css">
16 |     <noscript>Please enable JavaScript to view this site.</noscript>
17 |   </head>
18 |   <body>
19 |     <div id="layout" class="pure-g">
20 |       <div class="sidebar pure-u-1 pure-u-md-1-4">
21 |         <div class="header">
22 |           <h1 class="brand-title">A Sample Blog</h1>
23 |           <h2 class="brand-tagline">Pure CSS + CMS.js</h2>
24 |           <nav class="nav">
25 |             <ul class="nav-list">
26 |               <li class="nav-item">
27 |                 <a class="pure-button" href="http://purecss.io">Pure</a>
28 |               </li>
29 |               <li class="nav-item">
30 |                 <a class="pure-button" href="https://github.com/chrisdiana/cms.js">CMS.js</a>
31 |               </li>
32 |             </ul>
33 |           </nav>
34 |         </div>
35 |       </div>
36 |       <div class="content pure-u-1 pure-u-md-3-4">
37 |         <div>
38 |           <!-- A wrapper for all the blog posts -->
39 |           <div class="posts">
40 |             
41 |             <!-- CMS.js -->
42 |             <div id="cms"></div>
43 |             
44 |           </div>
45 |           <div class="footer">
46 |             <div class="pure-menu pure-menu-horizontal">
47 |               <ul>
48 |                 <li class="pure-menu-item"><a href="#/pages/about" class="pure-menu-link">About</a></li>
49 |                 <li class="pure-menu-item"><a href="#/pages/links" class="pure-menu-link">Links</a></li>
50 |                 <li class="pure-menu-item"><a href="#/posts" class="pure-menu-link">Posts</a></li>
51 |                 <li class="pure-menu-item"><a href="http://github.com/pure-css/pure/" class="pure-menu-link">Pure</a></li>
52 |                 <li class="pure-menu-item"><a href="https://github.com/chrisdiana/cms.js" class="pure-menu-link">CMS.js</a></li>
53 |               </ul>
54 |             </div>
55 |           </div>
56 |         </div>
57 |       </div>
58 |     </div>
59 |     
60 |     <!-- CMS.js -->
61 |     <script src="//cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.12/es5-shim.min.js"></script>
62 |     <script src="../js/cms.js"></script>
63 |     <script>
64 |     var blog = new CMS({
65 |       elementId: 'cms',
66 |       mode: 'GITHUB',
67 |       github: {
68 |         username: 'chrisdiana',
69 |         repo: 'cms.js-themes',
70 |         branch: 'master',
71 |         host: 'https://api.github.com',
72 |         prefix: 'templates',
73 |       },
74 |       layoutDirectory: 'layouts/pure-blog',
75 |       errorLayout: 'error',
76 |       defaultView: 'posts',
77 |       types: [
78 |         { name: 'posts', layout: { list: 'post-list', single: 'post' }},
79 |         { name: 'pages', layout: { list: 'page-list', single: 'page' }},
80 |       ],
81 |     });
82 |     </script>
83 |   </body>
84 | </html>


--------------------------------------------------------------------------------
/templates/skeleton.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 |   <head>
 4 |     <meta charset="utf-8">
 5 |     <title>Skeleton CSS + CMS.js</title>
 6 |     <meta name="description" content="">
 7 |     <meta name="author" content="">
 8 |     <meta name="viewport" content="width=device-width, initial-scale=1">
 9 |     <link href='//fonts.googleapis.com/css?family=Raleway:400,300,600' rel='stylesheet' type='text/css'>
10 |     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css">
11 |     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css">
12 |     <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
13 |     <link rel="icon" type="image/png" href="favicon.png">
14 |     <noscript>Please enable JavaScript to view this site.</noscript>
15 |   </head>
16 |   <body>
17 |     <div class="container">
18 |       <div class="row">
19 |         <div class="header" style="margin-top:20px;">
20 |           <div class="u-pull-left">
21 |             <h4>
22 |             Skeleton CSS + CMS.js
23 |             </h4>
24 |           </div>
25 |           <div class="u-pull-right">
26 |             <a class="button" href="#/posts">Posts</a>
27 |             <a class="button" href="#/pages/about">About</a>
28 |           </div>
29 |         </div>
30 |         
31 |         <div class="u-cf"></div>
32 |         <hr>
33 | 
34 |         <!-- CMS.js -->
35 |         <div id="cms"></div>
36 | 
37 |       </div>
38 |     </div>
39 |     
40 |     <!-- CMS.js -->
41 |     <script src="//cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.12/es5-shim.min.js"></script>
42 |     <script src="../js/cms.js"></script>
43 |     <script>
44 |     var blog = new CMS({
45 |       elementId: 'cms',
46 |       mode: 'GITHUB',
47 |       github: {
48 |         username: 'chrisdiana',
49 |         repo: 'cms.js-themes',
50 |         branch: 'master',
51 |         host: 'https://api.github.com',
52 |         prefix: 'templates',
53 |       },
54 |       layoutDirectory: 'layouts/skeleton',
55 |       errorLayout: 'error',
56 |       defaultView: 'posts',
57 |       types: [
58 |         { name: 'posts', layout: { list: 'post-list', single: 'post' }},
59 |         { name: 'pages', layout: { list: 'page-list', single: 'page' }},
60 |       ],
61 |     });
62 |     </script>
63 |   </body>
64 | </html>


--------------------------------------------------------------------------------