mirror of
https://github.com/GenZmeY/casper-i18n.git
synced 2025-07-13 09:16:06 +00:00
Compare commits
1 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 688e708cb8 |
@ -1,17 +0,0 @@
|
|||||||
# http://editorconfig.org
|
|
||||||
|
|
||||||
root = true
|
|
||||||
|
|
||||||
[*]
|
|
||||||
charset = utf-8
|
|
||||||
indent_style = space
|
|
||||||
indent_size = 4
|
|
||||||
end_of_line = lf
|
|
||||||
insert_final_newline = true
|
|
||||||
trim_trailing_whitespace = true
|
|
||||||
|
|
||||||
[*.hbs]
|
|
||||||
insert_final_newline = false
|
|
||||||
|
|
||||||
[*.md]
|
|
||||||
trim_trailing_whitespace = false
|
|
||||||
19
.github/ISSUE_TEMPLATE.md
vendored
19
.github/ISSUE_TEMPLATE.md
vendored
@ -1,19 +0,0 @@
|
|||||||
Do you need help or have a question? Please come chat in our forum: https://forum.ghost.org 👫.
|
|
||||||
|
|
||||||
If you're filing a bug 🐛, please include the following information:
|
|
||||||
|
|
||||||
### Screenshot
|
|
||||||
|
|
||||||
![]()
|
|
||||||
|
|
||||||
### Steps to Reproduce
|
|
||||||
|
|
||||||
1. This is the first step
|
|
||||||
2. This may be the post content used to cause an issue...
|
|
||||||
|
|
||||||
### Technical details
|
|
||||||
|
|
||||||
* Casper Version:
|
|
||||||
* Ghost Version:
|
|
||||||
* Browser Version:
|
|
||||||
* OS Version:
|
|
||||||
5
.gitignore
vendored
5
.gitignore
vendored
@ -13,12 +13,9 @@ results
|
|||||||
|
|
||||||
npm-debug.log
|
npm-debug.log
|
||||||
node_modules
|
node_modules
|
||||||
package-lock.json
|
|
||||||
|
|
||||||
.idea/*
|
.idea/*
|
||||||
*.iml
|
*.iml
|
||||||
projectFilesBackup
|
projectFilesBackup
|
||||||
|
|
||||||
.DS_Store
|
.DS_Store
|
||||||
|
|
||||||
dist/
|
|
||||||
@ -1,6 +0,0 @@
|
|||||||
language: node_js
|
|
||||||
sudo: false
|
|
||||||
node_js:
|
|
||||||
- "8"
|
|
||||||
|
|
||||||
|
|
||||||
2
LICENSE
2
LICENSE
@ -1,4 +1,4 @@
|
|||||||
Copyright (c) 2013-2018 Ghost Foundation
|
Copyright (c) 2013-2014 Ghost Foundation - Released under The MIT License.
|
||||||
|
|
||||||
Permission is hereby granted, free of charge, to any person
|
Permission is hereby granted, free of charge, to any person
|
||||||
obtaining a copy of this software and associated documentation
|
obtaining a copy of this software and associated documentation
|
||||||
|
|||||||
66
README.md
66
README.md
@ -1,66 +1,14 @@
|
|||||||
# Casper
|
# Casper
|
||||||
|
|
||||||
The default theme for [Ghost](http://github.com/tryghost/ghost/). This is the latest development version of Casper. If you're just looking to download the latest release, head over to the [releases](https://github.com/TryGhost/Casper/releases) page.
|
The default theme for [Ghost](http://github.com/tryghost/ghost/).
|
||||||
|
|
||||||
|
## Copyright & License
|
||||||
|
|
||||||
|
Copyright (c) 2013-2014 Ghost Foundation - Released under the MIT License.
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
# First time using a Ghost theme?
|
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||||
|
|
||||||
Ghost uses a simple templating language called [Handlebars](http://handlebarsjs.com/) for its themes.
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
||||||
|
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||||
We've documented our default theme pretty heavily so that it should be fairly easy to work out what's going on just by reading the code and the comments. Once you feel comfortable with how everything works, we also have full [theme API documentation](https://themes.ghost.org) which explains every possible Handlebars helper and template.
|
|
||||||
|
|
||||||
**The main files are:**
|
|
||||||
|
|
||||||
- `default.hbs` - The main template file
|
|
||||||
- `index.hbs` - Used for the home page
|
|
||||||
- `post.hbs` - Used for individual posts
|
|
||||||
- `page.hbs` - Used for individual pages
|
|
||||||
- `tag.hbs` - Used for tag archives
|
|
||||||
- `author.hbs` - Used for author archives
|
|
||||||
|
|
||||||
One really neat trick is that you can also create custom one-off templates just by adding the slug of a page to a template file. For example:
|
|
||||||
|
|
||||||
- `page-about.hbs` - Custom template for the `/about/` page
|
|
||||||
- `tag-news.hbs` - Custom template for `/tag/news/` archive
|
|
||||||
- `author-ali.hbs` - Custom template for `/author/ali/` archive
|
|
||||||
|
|
||||||
|
|
||||||
# Development
|
|
||||||
|
|
||||||
Casper styles are compiled using Gulp/PostCSS to polyfill future CSS spec. You'll need Node and Gulp installed globally. After that, from the theme's root directory:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
$ yarn install
|
|
||||||
$ yarn dev
|
|
||||||
```
|
|
||||||
|
|
||||||
Now you can edit `/assets/css/` files, which will be compiled to `/assets/built/` automatically.
|
|
||||||
|
|
||||||
The `zip` Gulp task packages the theme files into `dist/<theme-name>.zip`, which you can then upload to your site.
|
|
||||||
|
|
||||||
```bash
|
|
||||||
$ yarn zip
|
|
||||||
```
|
|
||||||
|
|
||||||
# PostCSS Features Used
|
|
||||||
|
|
||||||
- Autoprefixer - Don't worry about writing browser prefixes of any kind, it's all done automatically with support for the latest 2 major versions of every browser.
|
|
||||||
- Variables - Simple pure CSS variables
|
|
||||||
- [Color Function](https://github.com/postcss/postcss-color-function)
|
|
||||||
|
|
||||||
|
|
||||||
# SVG Icons
|
|
||||||
|
|
||||||
Casper uses inline SVG icons, included via Handlebars partials. You can find all icons inside `/partials/icons`. To use an icon just include the name of the relevant file, eg. To include the SVG icon in `/partials/icons/rss.hbs` - use `{{> "icons/rss"}}`.
|
|
||||||
|
|
||||||
You can add your own SVG icons in the same manner.
|
|
||||||
|
|
||||||
|
|
||||||
# Copyright & License
|
|
||||||
|
|
||||||
Copyright (c) 2013-2018 Ghost Foundation - Released under the [MIT license](LICENSE).
|
|
||||||
|
|||||||
@ -1,2 +0,0 @@
|
|||||||
a,abbr,acronym,address,applet,article,aside,audio,big,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,ul,var,video{margin:0;padding:0;border:0;font:inherit;font-size:100%;vertical-align:baseline}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}img{max-width:100%}html{box-sizing:border-box;font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}*,:after,:before{box-sizing:inherit}a{background-color:transparent}a:active,a:hover{outline:0}b,strong{font-weight:700}dfn,em,i{font-style:italic}h1{margin:.67em 0;font-size:2em}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}mark{background-color:#fdffb6}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{margin:0;color:inherit;font:inherit}button{overflow:visible;border:none}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{cursor:pointer;-webkit-appearance:button}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}input{line-height:normal}input:focus{outline:none}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{box-sizing:content-box;-webkit-appearance:textfield}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}legend{padding:0;border:0}textarea{overflow:auto}table{border-spacing:0;border-collapse:collapse}td,th{padding:0}html{overflow-y:scroll;font-size:62.5%;-webkit-tap-highlight-color:rgba(0,0,0,0)}body,html{overflow-x:hidden}body{color:#3c484e;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:1.5rem;line-height:1.6em;font-weight:400;font-style:normal;letter-spacing:0;text-rendering:optimizeLegibility;background:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-moz-font-feature-settings:"liga" on}::-moz-selection{text-shadow:none;background:#cbeafb}::selection{text-shadow:none;background:#cbeafb}hr{position:relative;display:block;width:100%;margin:2.5em 0 3.5em;padding:0;height:1px;border:0;border-top:1px solid #e3e9ed}audio,canvas,iframe,img,svg,video{vertical-align:middle}fieldset{margin:0;padding:0;border:0}textarea{resize:vertical}blockquote,dl,ol,p,ul{margin:0 0 1.5em}ol,ul{padding-left:1.3em;padding-right:1.5em}ol ol,ol ul,ul ol,ul ul{margin:.5em 0 1em}ul{list-style:disc}ol{list-style:decimal}ol,ul{max-width:100%}li{margin:.5em 0;padding-left:.3em;line-height:1.6em}dt{float:left;margin:0 20px 0 0;width:120px;color:#15171a;font-weight:500;text-align:right}dd{margin:0 0 5px;text-align:left}blockquote{margin:1.5em 0;padding:0 1.6em;border-left:.5em solid #e5eff5}blockquote p{margin:.8em 0;font-size:1.2em;font-weight:300}blockquote small{display:inline-block;margin:.8em 0 .8em 1.5em;font-size:.9em;opacity:.8}blockquote small:before{content:"\2014 \00A0"}blockquote cite{font-weight:700}blockquote cite a{font-weight:400}a{color:#26a8ed;text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3,h4,h5,h6{margin-top:0;line-height:1.15;font-weight:700;text-rendering:optimizeLegibility}h1{margin:0 0 .5em;font-size:5rem;font-weight:700}@media (max-width:500px){h1{font-size:2.2rem}}h2{margin:1.5em 0 .5em;font-size:2rem}@media (max-width:500px){h2{font-size:1.8rem}}h3{margin:1.5em 0 .5em;font-size:1.8rem;font-weight:500}@media (max-width:500px){h3{font-size:1.7rem}}h4{margin:1.5em 0 .5em;font-size:1.6rem;font-weight:500}h5,h6{margin:1.5em 0 .5em;font-size:1.4rem;font-weight:500}
|
|
||||||
/*# sourceMappingURL=global.css.map */
|
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,237 +0,0 @@
|
|||||||
{
|
|
||||||
"remove-empty-rulesets": true,
|
|
||||||
"always-semicolon": true,
|
|
||||||
"color-case": "lower",
|
|
||||||
"block-indent": " ",
|
|
||||||
"color-shorthand": true,
|
|
||||||
"element-case": "lower",
|
|
||||||
"eof-newline": true,
|
|
||||||
"leading-zero": true,
|
|
||||||
"quotes": "double",
|
|
||||||
"space-before-colon": "",
|
|
||||||
"space-after-colon": " ",
|
|
||||||
"space-before-combinator": " ",
|
|
||||||
"space-after-combinator": " ",
|
|
||||||
"space-between-declarations": "\n",
|
|
||||||
"space-before-opening-brace": " ",
|
|
||||||
"space-after-opening-brace": "\n",
|
|
||||||
"space-after-selector-delimiter": "\n",
|
|
||||||
"space-before-selector-delimiter": "",
|
|
||||||
"space-before-closing-brace": "\n",
|
|
||||||
"strip-spaces": true,
|
|
||||||
"tab-size": 4,
|
|
||||||
"unitless-zero": true,
|
|
||||||
"sort-order": [ [
|
|
||||||
"content",
|
|
||||||
"visibility",
|
|
||||||
"position",
|
|
||||||
"top",
|
|
||||||
"right",
|
|
||||||
"bottom",
|
|
||||||
"left",
|
|
||||||
"z-index",
|
|
||||||
"order",
|
|
||||||
"flex",
|
|
||||||
"flex-grow",
|
|
||||||
"flex-shrink",
|
|
||||||
"flex-basis",
|
|
||||||
"align-self",
|
|
||||||
"display",
|
|
||||||
"flex-flow",
|
|
||||||
"flex-direction",
|
|
||||||
"flex-wrap",
|
|
||||||
"justify-content",
|
|
||||||
"align-items",
|
|
||||||
"align-content",
|
|
||||||
"flex-order",
|
|
||||||
"flex-pack",
|
|
||||||
"flex-align",
|
|
||||||
"float",
|
|
||||||
"clear",
|
|
||||||
"overflow",
|
|
||||||
"overflow-x",
|
|
||||||
"overflow-y",
|
|
||||||
"-webkit-overflow-scrolling",
|
|
||||||
"clip",
|
|
||||||
"box-sizing",
|
|
||||||
"margin",
|
|
||||||
"margin-top",
|
|
||||||
"margin-right",
|
|
||||||
"margin-bottom",
|
|
||||||
"margin-left",
|
|
||||||
"padding",
|
|
||||||
"padding-top",
|
|
||||||
"padding-right",
|
|
||||||
"padding-bottom",
|
|
||||||
"padding-left",
|
|
||||||
"min-width",
|
|
||||||
"min-height",
|
|
||||||
"max-width",
|
|
||||||
"max-height",
|
|
||||||
"width",
|
|
||||||
"height",
|
|
||||||
"outline",
|
|
||||||
"outline-width",
|
|
||||||
"outline-style",
|
|
||||||
"outline-color",
|
|
||||||
"outline-offset",
|
|
||||||
"border",
|
|
||||||
"border-spacing",
|
|
||||||
"border-collapse",
|
|
||||||
"border-width",
|
|
||||||
"border-style",
|
|
||||||
"border-color",
|
|
||||||
"border-top",
|
|
||||||
"border-top-width",
|
|
||||||
"border-top-style",
|
|
||||||
"border-top-color",
|
|
||||||
"border-right",
|
|
||||||
"border-right-width",
|
|
||||||
"border-right-style",
|
|
||||||
"border-right-color",
|
|
||||||
"border-bottom",
|
|
||||||
"border-bottom-width",
|
|
||||||
"border-bottom-style",
|
|
||||||
"border-bottom-color",
|
|
||||||
"border-left",
|
|
||||||
"border-left-width",
|
|
||||||
"border-left-style",
|
|
||||||
"border-left-color",
|
|
||||||
"border-image",
|
|
||||||
"border-image-source",
|
|
||||||
"border-image-slice",
|
|
||||||
"border-image-width",
|
|
||||||
"border-image-outset",
|
|
||||||
"border-image-repeat",
|
|
||||||
"border-top-image",
|
|
||||||
"border-right-image",
|
|
||||||
"border-bottom-image",
|
|
||||||
"border-left-image",
|
|
||||||
"border-corner-image",
|
|
||||||
"border-top-left-image",
|
|
||||||
"border-top-right-image",
|
|
||||||
"border-bottom-right-image",
|
|
||||||
"border-bottom-left-image",
|
|
||||||
"color",
|
|
||||||
"font",
|
|
||||||
"font-family",
|
|
||||||
"font-size",
|
|
||||||
"line-height",
|
|
||||||
"font-weight",
|
|
||||||
"font-style",
|
|
||||||
"font-variant",
|
|
||||||
"font-size-adjust",
|
|
||||||
"font-stretch",
|
|
||||||
"font-feature-settings",
|
|
||||||
"letter-spacing",
|
|
||||||
"text-rendering",
|
|
||||||
"text-align",
|
|
||||||
"text-align-last",
|
|
||||||
"text-decoration",
|
|
||||||
"text-emphasis",
|
|
||||||
"text-emphasis-position",
|
|
||||||
"text-emphasis-style",
|
|
||||||
"text-emphasis-color",
|
|
||||||
"text-indent",
|
|
||||||
"text-justify",
|
|
||||||
"text-outline",
|
|
||||||
"text-transform",
|
|
||||||
"text-wrap",
|
|
||||||
"text-overflow",
|
|
||||||
"text-overflow-ellipsis",
|
|
||||||
"text-overflow-mode",
|
|
||||||
"text-shadow",
|
|
||||||
"white-space",
|
|
||||||
"word-spacing",
|
|
||||||
"word-wrap",
|
|
||||||
"word-break",
|
|
||||||
"tab-size",
|
|
||||||
"hyphens",
|
|
||||||
"user-select",
|
|
||||||
"fill",
|
|
||||||
"stroke",
|
|
||||||
"background",
|
|
||||||
"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader",
|
|
||||||
"background-color",
|
|
||||||
"background-image",
|
|
||||||
"background-attachment",
|
|
||||||
"background-position",
|
|
||||||
"background-position-x",
|
|
||||||
"background-position-y",
|
|
||||||
"background-clip",
|
|
||||||
"background-origin",
|
|
||||||
"background-size",
|
|
||||||
"background-repeat",
|
|
||||||
"border-radius",
|
|
||||||
"border-top-left-radius",
|
|
||||||
"border-top-right-radius",
|
|
||||||
"border-bottom-right-radius",
|
|
||||||
"border-bottom-left-radius",
|
|
||||||
"box-decoration-break",
|
|
||||||
"box-shadow",
|
|
||||||
"table-layout",
|
|
||||||
"caption-side",
|
|
||||||
"empty-cells",
|
|
||||||
"list-style",
|
|
||||||
"list-style-position",
|
|
||||||
"list-style-type",
|
|
||||||
"list-style-image",
|
|
||||||
"quotes",
|
|
||||||
"counter-increment",
|
|
||||||
"counter-reset",
|
|
||||||
"vertical-align",
|
|
||||||
"src",
|
|
||||||
"opacity",
|
|
||||||
"filter:progid:DXImageTransform.Microsoft.Alpha(Opacity",
|
|
||||||
"filter",
|
|
||||||
"resize",
|
|
||||||
"cursor",
|
|
||||||
"nav-index",
|
|
||||||
"nav-up",
|
|
||||||
"nav-right",
|
|
||||||
"nav-down",
|
|
||||||
"nav-left",
|
|
||||||
"transition",
|
|
||||||
"transition-delay",
|
|
||||||
"transition-timing-function",
|
|
||||||
"transition-duration",
|
|
||||||
"transition-property",
|
|
||||||
"transform",
|
|
||||||
"transform-origin",
|
|
||||||
"animation",
|
|
||||||
"animation-name",
|
|
||||||
"animation-duration",
|
|
||||||
"animation-play-state",
|
|
||||||
"animation-timing-function",
|
|
||||||
"animation-delay",
|
|
||||||
"animation-iteration-count",
|
|
||||||
"animation-direction",
|
|
||||||
"animation-fill-mode",
|
|
||||||
"pointer-events",
|
|
||||||
"unicode-bidi",
|
|
||||||
"direction",
|
|
||||||
"columns",
|
|
||||||
"column-span",
|
|
||||||
"column-width",
|
|
||||||
"column-count",
|
|
||||||
"column-fill",
|
|
||||||
"column-gap",
|
|
||||||
"column-rule",
|
|
||||||
"column-rule-width",
|
|
||||||
"column-rule-style",
|
|
||||||
"column-rule-color",
|
|
||||||
"break-before",
|
|
||||||
"break-inside",
|
|
||||||
"break-after",
|
|
||||||
"page-break-before",
|
|
||||||
"page-break-inside",
|
|
||||||
"page-break-after",
|
|
||||||
"orphans",
|
|
||||||
"widows",
|
|
||||||
"zoom",
|
|
||||||
"max-zoom",
|
|
||||||
"min-zoom",
|
|
||||||
"user-zoom",
|
|
||||||
"orientation"
|
|
||||||
] ]
|
|
||||||
}
|
|
||||||
@ -1,240 +0,0 @@
|
|||||||
{
|
|
||||||
"remove-empty-rulesets": true,
|
|
||||||
"always-semicolon": true,
|
|
||||||
"color-case": "lower",
|
|
||||||
"block-indent": " ",
|
|
||||||
"color-shorthand": true,
|
|
||||||
"element-case": "lower",
|
|
||||||
"eof-newline": true,
|
|
||||||
"leading-zero": true,
|
|
||||||
"quotes": "double",
|
|
||||||
"space-before-colon": "",
|
|
||||||
"space-after-colon": " ",
|
|
||||||
"space-before-combinator": " ",
|
|
||||||
"space-after-combinator": " ",
|
|
||||||
"space-between-declarations": "\n",
|
|
||||||
"space-before-opening-brace": " ",
|
|
||||||
"space-after-opening-brace": "\n",
|
|
||||||
"space-after-selector-delimiter": "\n",
|
|
||||||
"space-before-selector-delimiter": "",
|
|
||||||
"space-before-closing-brace": "\n",
|
|
||||||
"strip-spaces": true,
|
|
||||||
"tab-size": 4,
|
|
||||||
"unitless-zero": true,
|
|
||||||
"sort-order": [ [
|
|
||||||
"content",
|
|
||||||
"visibility",
|
|
||||||
"position",
|
|
||||||
"top",
|
|
||||||
"right",
|
|
||||||
"bottom",
|
|
||||||
"left",
|
|
||||||
"z-index",
|
|
||||||
"order",
|
|
||||||
"flex",
|
|
||||||
"flex-grow",
|
|
||||||
"flex-shrink",
|
|
||||||
"flex-basis",
|
|
||||||
"align-self",
|
|
||||||
"display",
|
|
||||||
"flex-flow",
|
|
||||||
"flex-direction",
|
|
||||||
"justify-content",
|
|
||||||
"align-items",
|
|
||||||
"align-content",
|
|
||||||
"flex-wrap",
|
|
||||||
"flex-order",
|
|
||||||
"flex-pack",
|
|
||||||
"flex-align",
|
|
||||||
"float",
|
|
||||||
"clear",
|
|
||||||
"box-sizing",
|
|
||||||
"width",
|
|
||||||
"height",
|
|
||||||
"min-width",
|
|
||||||
"min-height",
|
|
||||||
"max-width",
|
|
||||||
"max-height",
|
|
||||||
"overflow",
|
|
||||||
"overflow-x",
|
|
||||||
"overflow-y",
|
|
||||||
"clip",
|
|
||||||
"margin",
|
|
||||||
"margin-top",
|
|
||||||
"margin-right",
|
|
||||||
"margin-bottom",
|
|
||||||
"margin-left",
|
|
||||||
"padding",
|
|
||||||
"padding-top",
|
|
||||||
"padding-right",
|
|
||||||
"padding-bottom",
|
|
||||||
"padding-left",
|
|
||||||
"outline",
|
|
||||||
"outline-width",
|
|
||||||
"outline-style",
|
|
||||||
"outline-color",
|
|
||||||
"outline-offset",
|
|
||||||
"border",
|
|
||||||
"border-spacing",
|
|
||||||
"border-collapse",
|
|
||||||
"border-width",
|
|
||||||
"border-style",
|
|
||||||
"border-color",
|
|
||||||
"border-top",
|
|
||||||
"border-top-width",
|
|
||||||
"border-top-style",
|
|
||||||
"border-top-color",
|
|
||||||
"border-right",
|
|
||||||
"border-right-width",
|
|
||||||
"border-right-style",
|
|
||||||
"border-right-color",
|
|
||||||
"border-bottom",
|
|
||||||
"border-bottom-width",
|
|
||||||
"border-bottom-style",
|
|
||||||
"border-bottom-color",
|
|
||||||
"border-left",
|
|
||||||
"border-left-width",
|
|
||||||
"border-left-style",
|
|
||||||
"border-left-color",
|
|
||||||
"border-image",
|
|
||||||
"border-image-source",
|
|
||||||
"border-image-slice",
|
|
||||||
"border-image-width",
|
|
||||||
"border-image-outset",
|
|
||||||
"border-image-repeat",
|
|
||||||
"border-top-image",
|
|
||||||
"border-right-image",
|
|
||||||
"border-bottom-image",
|
|
||||||
"border-left-image",
|
|
||||||
"border-corner-image",
|
|
||||||
"border-top-left-image",
|
|
||||||
"border-top-right-image",
|
|
||||||
"border-bottom-right-image",
|
|
||||||
"border-bottom-left-image",
|
|
||||||
"table-layout",
|
|
||||||
"caption-side",
|
|
||||||
"empty-cells",
|
|
||||||
"list-style",
|
|
||||||
"list-style-position",
|
|
||||||
"list-style-type",
|
|
||||||
"list-style-image",
|
|
||||||
"quotes",
|
|
||||||
"counter-increment",
|
|
||||||
"counter-reset",
|
|
||||||
"vertical-align",
|
|
||||||
"stroke",
|
|
||||||
"fill",
|
|
||||||
"stroke-width",
|
|
||||||
"stroke-opacity",
|
|
||||||
"color",
|
|
||||||
"font",
|
|
||||||
"font-family",
|
|
||||||
"font-size",
|
|
||||||
"line-height",
|
|
||||||
"font-weight",
|
|
||||||
"font-style",
|
|
||||||
"font-variant",
|
|
||||||
"font-size-adjust",
|
|
||||||
"font-stretch",
|
|
||||||
"text-rendering",
|
|
||||||
"font-feature-settings",
|
|
||||||
"letter-spacing",
|
|
||||||
"hyphens",
|
|
||||||
"text-align",
|
|
||||||
"text-align-last",
|
|
||||||
"text-decoration",
|
|
||||||
"text-emphasis",
|
|
||||||
"text-emphasis-position",
|
|
||||||
"text-emphasis-style",
|
|
||||||
"text-emphasis-color",
|
|
||||||
"text-indent",
|
|
||||||
"text-justify",
|
|
||||||
"text-outline",
|
|
||||||
"text-transform",
|
|
||||||
"text-wrap",
|
|
||||||
"text-overflow",
|
|
||||||
"text-overflow-ellipsis",
|
|
||||||
"text-overflow-mode",
|
|
||||||
"text-shadow",
|
|
||||||
"white-space",
|
|
||||||
"word-spacing",
|
|
||||||
"word-wrap",
|
|
||||||
"word-break",
|
|
||||||
"tab-size",
|
|
||||||
"user-select",
|
|
||||||
"src",
|
|
||||||
"resize",
|
|
||||||
"cursor",
|
|
||||||
"nav-index",
|
|
||||||
"nav-up",
|
|
||||||
"nav-right",
|
|
||||||
"nav-down",
|
|
||||||
"nav-left",
|
|
||||||
"background",
|
|
||||||
"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader",
|
|
||||||
"background-color",
|
|
||||||
"background-image",
|
|
||||||
"background-size",
|
|
||||||
"background-attachment",
|
|
||||||
"background-position",
|
|
||||||
"background-position-x",
|
|
||||||
"background-position-y",
|
|
||||||
"background-clip",
|
|
||||||
"background-origin",
|
|
||||||
"background-repeat",
|
|
||||||
"border-radius",
|
|
||||||
"border-top-left-radius",
|
|
||||||
"border-top-right-radius",
|
|
||||||
"border-bottom-right-radius",
|
|
||||||
"border-bottom-left-radius",
|
|
||||||
"box-decoration-break",
|
|
||||||
"box-shadow",
|
|
||||||
"opacity",
|
|
||||||
"filter:progid:DXImageTransform.Microsoft.Alpha(Opacity",
|
|
||||||
"filter",
|
|
||||||
"transition",
|
|
||||||
"transition-delay",
|
|
||||||
"transition-timing-function",
|
|
||||||
"transition-duration",
|
|
||||||
"transition-property",
|
|
||||||
"transform",
|
|
||||||
"transform-origin",
|
|
||||||
"animation",
|
|
||||||
"animation-name",
|
|
||||||
"animation-duration",
|
|
||||||
"animation-play-state",
|
|
||||||
"animation-timing-function",
|
|
||||||
"animation-delay",
|
|
||||||
"animation-iteration-count",
|
|
||||||
"animation-direction",
|
|
||||||
"animation-fill-mode",
|
|
||||||
"pointer-events",
|
|
||||||
"unicode-bidi",
|
|
||||||
"direction",
|
|
||||||
"columns",
|
|
||||||
"column-span",
|
|
||||||
"column-width",
|
|
||||||
"column-count",
|
|
||||||
"column-fill",
|
|
||||||
"column-gap",
|
|
||||||
"column-rule",
|
|
||||||
"column-rule-width",
|
|
||||||
"column-rule-style",
|
|
||||||
"column-rule-color",
|
|
||||||
"break-before",
|
|
||||||
"break-inside",
|
|
||||||
"break-after",
|
|
||||||
"page-break-before",
|
|
||||||
"page-break-inside",
|
|
||||||
"page-break-after",
|
|
||||||
"orphans",
|
|
||||||
"widows",
|
|
||||||
"zoom",
|
|
||||||
"max-zoom",
|
|
||||||
"min-zoom",
|
|
||||||
"user-zoom",
|
|
||||||
"orientation",
|
|
||||||
"-webkit-overflow-scrolling",
|
|
||||||
"-ms-overflow-scrolling"
|
|
||||||
] ]
|
|
||||||
}
|
|
||||||
@ -1,486 +0,0 @@
|
|||||||
/* Variables
|
|
||||||
/* ---------------------------------------------------------- */
|
|
||||||
|
|
||||||
:root {
|
|
||||||
/* Colours */
|
|
||||||
--blue: #3eb0ef;
|
|
||||||
--green: #a4d037;
|
|
||||||
--purple: #ad26b4;
|
|
||||||
--yellow: #fecd35;
|
|
||||||
--red: #f05230;
|
|
||||||
--darkgrey: #15171A;
|
|
||||||
--midgrey: #738a94;
|
|
||||||
--lightgrey: #c5d2d9;
|
|
||||||
--whitegrey: #e5eff5;
|
|
||||||
--pink: #fa3a57;
|
|
||||||
--brown: #a3821a;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Reset
|
|
||||||
/* ---------------------------------------------------------- */
|
|
||||||
|
|
||||||
html,
|
|
||||||
body,
|
|
||||||
div,
|
|
||||||
span,
|
|
||||||
applet,
|
|
||||||
object,
|
|
||||||
iframe,
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5,
|
|
||||||
h6,
|
|
||||||
p,
|
|
||||||
blockquote,
|
|
||||||
pre,
|
|
||||||
a,
|
|
||||||
abbr,
|
|
||||||
acronym,
|
|
||||||
address,
|
|
||||||
big,
|
|
||||||
cite,
|
|
||||||
code,
|
|
||||||
del,
|
|
||||||
dfn,
|
|
||||||
em,
|
|
||||||
img,
|
|
||||||
ins,
|
|
||||||
kbd,
|
|
||||||
q,
|
|
||||||
s,
|
|
||||||
samp,
|
|
||||||
small,
|
|
||||||
strike,
|
|
||||||
strong,
|
|
||||||
sub,
|
|
||||||
sup,
|
|
||||||
tt,
|
|
||||||
var,
|
|
||||||
dl,
|
|
||||||
dt,
|
|
||||||
dd,
|
|
||||||
ol,
|
|
||||||
ul,
|
|
||||||
li,
|
|
||||||
fieldset,
|
|
||||||
form,
|
|
||||||
label,
|
|
||||||
legend,
|
|
||||||
table,
|
|
||||||
caption,
|
|
||||||
tbody,
|
|
||||||
tfoot,
|
|
||||||
thead,
|
|
||||||
tr,
|
|
||||||
th,
|
|
||||||
td,
|
|
||||||
article,
|
|
||||||
aside,
|
|
||||||
canvas,
|
|
||||||
details,
|
|
||||||
embed,
|
|
||||||
figure,
|
|
||||||
figcaption,
|
|
||||||
footer,
|
|
||||||
header,
|
|
||||||
hgroup,
|
|
||||||
menu,
|
|
||||||
nav,
|
|
||||||
output,
|
|
||||||
ruby,
|
|
||||||
section,
|
|
||||||
summary,
|
|
||||||
time,
|
|
||||||
mark,
|
|
||||||
audio,
|
|
||||||
video {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
border: 0;
|
|
||||||
font: inherit;
|
|
||||||
font-size: 100%;
|
|
||||||
vertical-align: baseline;
|
|
||||||
}
|
|
||||||
body {
|
|
||||||
line-height: 1;
|
|
||||||
}
|
|
||||||
ol,
|
|
||||||
ul {
|
|
||||||
list-style: none;
|
|
||||||
}
|
|
||||||
blockquote,
|
|
||||||
q {
|
|
||||||
quotes: none;
|
|
||||||
}
|
|
||||||
blockquote:before,
|
|
||||||
blockquote:after,
|
|
||||||
q:before,
|
|
||||||
q:after {
|
|
||||||
content: "";
|
|
||||||
content: none;
|
|
||||||
}
|
|
||||||
table {
|
|
||||||
border-spacing: 0;
|
|
||||||
border-collapse: collapse;
|
|
||||||
}
|
|
||||||
img {
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
html {
|
|
||||||
box-sizing: border-box;
|
|
||||||
font-family: sans-serif;
|
|
||||||
|
|
||||||
-ms-text-size-adjust: 100%;
|
|
||||||
-webkit-text-size-adjust: 100%;
|
|
||||||
}
|
|
||||||
*,
|
|
||||||
*:before,
|
|
||||||
*:after {
|
|
||||||
box-sizing: inherit;
|
|
||||||
}
|
|
||||||
a {
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
a:active,
|
|
||||||
a:hover {
|
|
||||||
outline: 0;
|
|
||||||
}
|
|
||||||
b,
|
|
||||||
strong {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
i,
|
|
||||||
em,
|
|
||||||
dfn {
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
h1 {
|
|
||||||
margin: 0.67em 0;
|
|
||||||
font-size: 2em;
|
|
||||||
}
|
|
||||||
small {
|
|
||||||
font-size: 80%;
|
|
||||||
}
|
|
||||||
sub,
|
|
||||||
sup {
|
|
||||||
position: relative;
|
|
||||||
font-size: 75%;
|
|
||||||
line-height: 0;
|
|
||||||
vertical-align: baseline;
|
|
||||||
}
|
|
||||||
sup {
|
|
||||||
top: -0.5em;
|
|
||||||
}
|
|
||||||
sub {
|
|
||||||
bottom: -0.25em;
|
|
||||||
}
|
|
||||||
img {
|
|
||||||
border: 0;
|
|
||||||
}
|
|
||||||
svg:not(:root) {
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
mark {
|
|
||||||
background-color: #fdffb6;
|
|
||||||
}
|
|
||||||
code,
|
|
||||||
kbd,
|
|
||||||
pre,
|
|
||||||
samp {
|
|
||||||
font-family: monospace, monospace;
|
|
||||||
font-size: 1em;
|
|
||||||
}
|
|
||||||
button,
|
|
||||||
input,
|
|
||||||
optgroup,
|
|
||||||
select,
|
|
||||||
textarea {
|
|
||||||
margin: 0; /* 3 */
|
|
||||||
color: inherit; /* 1 */
|
|
||||||
font: inherit; /* 2 */
|
|
||||||
}
|
|
||||||
button {
|
|
||||||
overflow: visible;
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
button,
|
|
||||||
select {
|
|
||||||
text-transform: none;
|
|
||||||
}
|
|
||||||
button,
|
|
||||||
html input[type="button"],
|
|
||||||
/* 1 */
|
|
||||||
input[type="reset"],
|
|
||||||
input[type="submit"] {
|
|
||||||
cursor: pointer; /* 3 */
|
|
||||||
|
|
||||||
-webkit-appearance: button; /* 2 */
|
|
||||||
}
|
|
||||||
button[disabled],
|
|
||||||
html input[disabled] {
|
|
||||||
cursor: default;
|
|
||||||
}
|
|
||||||
button::-moz-focus-inner,
|
|
||||||
input::-moz-focus-inner {
|
|
||||||
padding: 0;
|
|
||||||
border: 0;
|
|
||||||
}
|
|
||||||
input {
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
input:focus {
|
|
||||||
outline: none;
|
|
||||||
}
|
|
||||||
input[type="checkbox"],
|
|
||||||
input[type="radio"] {
|
|
||||||
box-sizing: border-box; /* 1 */
|
|
||||||
padding: 0; /* 2 */
|
|
||||||
}
|
|
||||||
input[type="number"]::-webkit-inner-spin-button,
|
|
||||||
input[type="number"]::-webkit-outer-spin-button {
|
|
||||||
height: auto;
|
|
||||||
}
|
|
||||||
input[type="search"] {
|
|
||||||
box-sizing: content-box; /* 2 */
|
|
||||||
|
|
||||||
-webkit-appearance: textfield; /* 1 */
|
|
||||||
}
|
|
||||||
input[type="search"]::-webkit-search-cancel-button,
|
|
||||||
input[type="search"]::-webkit-search-decoration {
|
|
||||||
-webkit-appearance: none;
|
|
||||||
}
|
|
||||||
legend {
|
|
||||||
padding: 0; /* 2 */
|
|
||||||
border: 0; /* 1 */
|
|
||||||
}
|
|
||||||
textarea {
|
|
||||||
overflow: auto;
|
|
||||||
}
|
|
||||||
table {
|
|
||||||
border-spacing: 0;
|
|
||||||
border-collapse: collapse;
|
|
||||||
}
|
|
||||||
td,
|
|
||||||
th {
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ==========================================================================
|
|
||||||
Base styles: opinionated defaults
|
|
||||||
========================================================================== */
|
|
||||||
|
|
||||||
html {
|
|
||||||
overflow-x: hidden;
|
|
||||||
overflow-y: scroll;
|
|
||||||
font-size: 62.5%;
|
|
||||||
|
|
||||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
|
||||||
}
|
|
||||||
body {
|
|
||||||
overflow-x: hidden;
|
|
||||||
color: color(var(--midgrey) l(-25%));
|
|
||||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
|
|
||||||
font-size: 1.5rem;
|
|
||||||
line-height: 1.6em;
|
|
||||||
font-weight: 400;
|
|
||||||
font-style: normal;
|
|
||||||
letter-spacing: 0;
|
|
||||||
text-rendering: optimizeLegibility;
|
|
||||||
background: #fff;
|
|
||||||
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
-moz-osx-font-smoothing: grayscale;
|
|
||||||
-moz-font-feature-settings: "liga" on;
|
|
||||||
}
|
|
||||||
|
|
||||||
::selection {
|
|
||||||
text-shadow: none;
|
|
||||||
background: color(var(--blue) lightness(+30%));
|
|
||||||
}
|
|
||||||
|
|
||||||
hr {
|
|
||||||
position: relative;
|
|
||||||
display: block;
|
|
||||||
width: 100%;
|
|
||||||
margin: 2.5em 0 3.5em;
|
|
||||||
padding: 0;
|
|
||||||
height: 1px;
|
|
||||||
border: 0;
|
|
||||||
border-top: 1px solid color(var(--lightgrey) l(+10%));
|
|
||||||
}
|
|
||||||
|
|
||||||
audio,
|
|
||||||
canvas,
|
|
||||||
iframe,
|
|
||||||
img,
|
|
||||||
svg,
|
|
||||||
video {
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
|
|
||||||
fieldset {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
border: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
textarea {
|
|
||||||
resize: vertical;
|
|
||||||
}
|
|
||||||
|
|
||||||
p,
|
|
||||||
ul,
|
|
||||||
ol,
|
|
||||||
dl,
|
|
||||||
blockquote {
|
|
||||||
margin: 0 0 1.5em 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
ol,
|
|
||||||
ul {
|
|
||||||
padding-left: 1.3em;
|
|
||||||
padding-right: 1.5em;
|
|
||||||
}
|
|
||||||
|
|
||||||
ol ol,
|
|
||||||
ul ul,
|
|
||||||
ul ol,
|
|
||||||
ol ul {
|
|
||||||
margin: 0.5em 0 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul {
|
|
||||||
list-style: disc;
|
|
||||||
}
|
|
||||||
|
|
||||||
ol {
|
|
||||||
list-style: decimal;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul,
|
|
||||||
ol {
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
li {
|
|
||||||
margin: 0.5em 0;
|
|
||||||
padding-left: 0.3em;
|
|
||||||
line-height: 1.6em;
|
|
||||||
}
|
|
||||||
|
|
||||||
dt {
|
|
||||||
float: left;
|
|
||||||
margin: 0 20px 0 0;
|
|
||||||
width: 120px;
|
|
||||||
color: var(--darkgrey);
|
|
||||||
font-weight: 500;
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
dd {
|
|
||||||
margin: 0 0 5px 0;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote {
|
|
||||||
margin: 1.5em 0;
|
|
||||||
padding: 0 1.6em 0 1.6em;
|
|
||||||
border-left: var(--whitegrey) 0.5em solid;
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote p {
|
|
||||||
margin: 0.8em 0;
|
|
||||||
font-size: 1.2em;
|
|
||||||
font-weight: 300;
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote small {
|
|
||||||
display: inline-block;
|
|
||||||
margin: 0.8em 0 0.8em 1.5em;
|
|
||||||
font-size: 0.9em;
|
|
||||||
opacity: 0.8;
|
|
||||||
}
|
|
||||||
/* Quotation marks */
|
|
||||||
blockquote small:before {
|
|
||||||
content: "\2014 \00A0";
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote cite {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
blockquote cite a {
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: color(var(--blue) l(-5%));
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
a:hover {
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5,
|
|
||||||
h6 {
|
|
||||||
margin-top: 0;
|
|
||||||
line-height: 1.15;
|
|
||||||
font-weight: 700;
|
|
||||||
text-rendering: optimizeLegibility;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
margin: 0 0 0.5em 0;
|
|
||||||
font-size: 5rem;
|
|
||||||
font-weight: 700;
|
|
||||||
}
|
|
||||||
@media (max-width: 500px) {
|
|
||||||
h1 {
|
|
||||||
font-size: 2.2rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
h2 {
|
|
||||||
margin: 1.5em 0 0.5em 0;
|
|
||||||
font-size: 2rem;
|
|
||||||
}
|
|
||||||
@media (max-width: 500px) {
|
|
||||||
h2 {
|
|
||||||
font-size: 1.8rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
h3 {
|
|
||||||
margin: 1.5em 0 0.5em 0;
|
|
||||||
font-size: 1.8rem;
|
|
||||||
font-weight: 500;
|
|
||||||
}
|
|
||||||
@media (max-width: 500px) {
|
|
||||||
h3 {
|
|
||||||
font-size: 1.7rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
h4 {
|
|
||||||
margin: 1.5em 0 0.5em 0;
|
|
||||||
font-size: 1.6rem;
|
|
||||||
font-weight: 500;
|
|
||||||
}
|
|
||||||
|
|
||||||
h5 {
|
|
||||||
margin: 1.5em 0 0.5em 0;
|
|
||||||
font-size: 1.4rem;
|
|
||||||
font-weight: 500;
|
|
||||||
}
|
|
||||||
|
|
||||||
h6 {
|
|
||||||
margin: 1.5em 0 0.5em 0;
|
|
||||||
font-size: 1.4rem;
|
|
||||||
font-weight: 500;
|
|
||||||
}
|
|
||||||
File diff suppressed because it is too large
Load Diff
BIN
assets/fonts/icons.eot
Executable file
BIN
assets/fonts/icons.eot
Executable file
Binary file not shown.
15
assets/fonts/icons.svg
Executable file
15
assets/fonts/icons.svg
Executable file
@ -0,0 +1,15 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<metadata>Generated by IcoMoon</metadata>
|
||||||
|
<defs>
|
||||||
|
<font id="icons" horiz-adv-x="1024">
|
||||||
|
<font-face units-per-em="1024" ascent="960" descent="-64" />
|
||||||
|
<missing-glyph horiz-adv-x="1024" />
|
||||||
|
<glyph unicode=" " d="" horiz-adv-x="512" />
|
||||||
|
<glyph unicode="" d="M0 960v-204.8h614.4v204.8h-614.4zM0 550.4v-204.8h1024v204.8h-1024zM0 140.8v-204.8h409.6v204.8h-409.6zM614.4 140.8v-204.8h409.6v204.8h-409.6zM819.2 960v-204.8h204.8v204.8h-204.8z" />
|
||||||
|
<glyph unicode="" d="M842.688-64c-0.8 459.232-401.504 834.528-842.688 835.392v188.608c541.312 0 1024-460.608 1024-1024h-181.312zM687.2-63.936h-181.216c0.608 112.768-56.672 238.976-147.328 333.472-90.144 95.264-249.92 155.296-358.208 154.72v188.544c338.080-7.296 679.872-326.624 686.752-676.736zM128.512 192.096c70.624 0 127.872-57.312 127.872-128 0-70.656-57.248-127.968-127.872-127.968s-127.872 57.312-127.872 127.968c0 70.688 57.248 128 127.872 128z" />
|
||||||
|
<glyph unicode="" d="M1024 765.582c-37.676-16.708-78.164-28.002-120.66-33.080 43.372 26 76.686 67.17 92.372 116.23-40.596-24.078-85.556-41.56-133.41-50.98-38.32 40.83-92.922 66.34-153.346 66.34-116.022 0-210.088-94.058-210.088-210.078 0-16.466 1.858-32.5 5.44-47.878-174.6 8.764-329.402 92.4-433.018 219.506-18.084-31.028-28.446-67.116-28.446-105.618 0-72.888 37.088-137.192 93.46-174.866-34.438 1.092-66.832 10.542-95.154 26.278-0.020-0.876-0.020-1.756-0.020-2.642 0-101.788 72.418-186.696 168.522-206-17.626-4.8-36.188-7.372-55.348-7.372-13.538 0-26.698 1.32-39.528 3.772 26.736-83.46 104.32-144.206 196.252-145.896-71.9-56.35-162.486-89.934-260.916-89.934-16.958 0-33.68 0.994-50.116 2.94 92.972-59.61 203.402-94.394 322.042-94.394 386.422 0 597.736 320.124 597.736 597.744 0 9.108-0.206 18.168-0.61 27.18 41.056 29.62 76.672 66.62 104.836 108.748z" />
|
||||||
|
<glyph unicode="" d="M0.806 90.336c-0.244 2.532-0.452 5.070-0.584 7.63 0.13-2.56 0.34-5.098 0.584-7.63zM235.908 394.852c92.010-2.738 153.734 92.698 137.862 213.198-15.894 120.48-103.396 217.168-195.408 219.922-92.026 2.73-153.74-89.482-137.852-210 15.882-120.468 103.352-220.374 195.398-223.12zM1024 704v85.31c0 93.88-76.782 170.69-170.658 170.69h-682.656c-92.276 0-168.012-74.232-170.564-165.926 58.362 51.386 139.324 94.316 222.874 94.316 89.304 0 357.244 0 357.244 0l-79.948-67.618h-113.268c75.13-28.804 115.156-116.124 115.156-205.722 0-75.248-41.81-139.954-100.888-185.968-57.644-44.902-68.572-63.708-68.572-101.878 0-32.578 61.746-88 94.032-110.788 94.382-66.538 124.916-128.312 124.916-231.456 0-16.428-2.042-32.83-6.066-48.96h307.742c93.874 0 170.656 76.75 170.656 170.69v533.308h-192v-191.998h-64v192h-191.998v64h191.998v192h64v-192h192zM185.886 194.064c21.614 0 41.422 0.59 61.936 0.59-27.146 26.334-48.626 58.6-48.626 98.38 0 23.608 7.564 46.336 18.134 66.52-10.782-0.77-21.79-0.994-33.126-0.994-74.356 0-137.506 24.076-184.204 63.854v-67.242l0.006-201.73c53.44 25.374 116.888 40.622 185.88 40.622zM3.42 72.742c-1.112 5.458-1.966 11.006-2.542 16.634 0.574-5.628 1.43-11.176 2.542-16.634zM455.45 7.154c-15.058 58.806-68.454 87.964-142.888 139.568-27.072 8.732-56.894 13.874-88.894 14.208-89.618 0.964-173.108-34.942-220.216-88.372 15.92-77.706 85.034-136.558 167.234-136.558h286.444c1.816 11.128 2.696 22.632 2.696 34.432 0 12.534-1.534 24.792-4.376 36.722z" />
|
||||||
|
<glyph unicode="" d="M853.344 960h-682.66c-93.872 0-170.684-76.814-170.684-170.688v-682.626c0-93.938 76.812-170.686 170.684-170.686l682.66 0.002c93.876 0 170.656 76.746 170.656 170.688v682.622c0 93.874-76.782 170.688-170.656 170.688zM870.592 448h-166.592v-448h-192v448h-92.526v146.564h92.526v95.186c0 129.342 55.792 206.25 207.87 206.25h175.244v-158.57h-143.13c-42.482 0.070-47.752-22.152-47.752-63.512l-0.232-79.354h192l-25.408-146.564z" />
|
||||||
|
</font></defs></svg>
|
||||||
|
After Width: | Height: | Size: 3.8 KiB |
BIN
assets/fonts/icons.ttf
Executable file
BIN
assets/fonts/icons.ttf
Executable file
Binary file not shown.
BIN
assets/fonts/icons.woff
Executable file
BIN
assets/fonts/icons.woff
Executable file
Binary file not shown.
59
assets/js/index.js
Normal file
59
assets/js/index.js
Normal file
@ -0,0 +1,59 @@
|
|||||||
|
/**
|
||||||
|
* Main JS file for Casper behaviours
|
||||||
|
*/
|
||||||
|
|
||||||
|
/*globals jQuery, document */
|
||||||
|
(function ($) {
|
||||||
|
"use strict";
|
||||||
|
|
||||||
|
$(document).ready(function(){
|
||||||
|
|
||||||
|
$(".post-content").fitVids();
|
||||||
|
|
||||||
|
function casperFullImg() {
|
||||||
|
$("img").each( function() {
|
||||||
|
var contentWidth = $(".post-content").outerWidth(); // Width of the content
|
||||||
|
var imageWidth = $(this)[0].naturalWidth; // Original image resolution
|
||||||
|
|
||||||
|
if (imageWidth >= contentWidth) {
|
||||||
|
$(this).addClass('full-img');
|
||||||
|
} else {
|
||||||
|
$(this).removeClass('full-img');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
casperFullImg();
|
||||||
|
$(window).smartresize(casperFullImg);
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
}(jQuery));
|
||||||
|
|
||||||
|
(function($,sr){
|
||||||
|
|
||||||
|
// debouncing function from John Hann
|
||||||
|
// http://unscriptable.com/index.php/2009/03/20/debouncing-javascript-methods/
|
||||||
|
var debounce = function (func, threshold, execAsap) {
|
||||||
|
var timeout;
|
||||||
|
|
||||||
|
return function debounced () {
|
||||||
|
var obj = this, args = arguments;
|
||||||
|
function delayed () {
|
||||||
|
if (!execAsap)
|
||||||
|
func.apply(obj, args);
|
||||||
|
timeout = null;
|
||||||
|
};
|
||||||
|
|
||||||
|
if (timeout)
|
||||||
|
clearTimeout(timeout);
|
||||||
|
else if (execAsap)
|
||||||
|
func.apply(obj, args);
|
||||||
|
|
||||||
|
timeout = setTimeout(delayed, threshold || 100);
|
||||||
|
};
|
||||||
|
}
|
||||||
|
// smartresize
|
||||||
|
jQuery.fn[sr] = function(fn){ return fn ? this.bind('resize', debounce(fn)) : this.trigger(sr); };
|
||||||
|
|
||||||
|
})(jQuery,'smartresize');
|
||||||
@ -1,115 +0,0 @@
|
|||||||
/* global maxPages */
|
|
||||||
|
|
||||||
// Code snippet inspired by https://github.com/douglasrodrigues5/ghost-blog-infinite-scroll
|
|
||||||
$(function ($) {
|
|
||||||
var currentPage = 1;
|
|
||||||
var pathname = window.location.pathname;
|
|
||||||
var $document = $(document);
|
|
||||||
var $result = $('.post-feed');
|
|
||||||
var buffer = 300;
|
|
||||||
|
|
||||||
var ticking = false;
|
|
||||||
var isLoading = false;
|
|
||||||
|
|
||||||
var lastScrollY = window.scrollY;
|
|
||||||
var lastWindowHeight = window.innerHeight;
|
|
||||||
var lastDocumentHeight = $document.height();
|
|
||||||
|
|
||||||
function onScroll() {
|
|
||||||
lastScrollY = window.scrollY;
|
|
||||||
requestTick();
|
|
||||||
}
|
|
||||||
|
|
||||||
function onResize() {
|
|
||||||
lastWindowHeight = window.innerHeight;
|
|
||||||
lastDocumentHeight = $document.height();
|
|
||||||
requestTick();
|
|
||||||
}
|
|
||||||
|
|
||||||
function requestTick() {
|
|
||||||
if (!ticking) {
|
|
||||||
requestAnimationFrame(infiniteScroll);
|
|
||||||
}
|
|
||||||
ticking = true;
|
|
||||||
}
|
|
||||||
|
|
||||||
function sanitizePathname(path) {
|
|
||||||
var paginationRegex = /(?:page\/)(\d)(?:\/)$/i;
|
|
||||||
|
|
||||||
// remove hash params from path
|
|
||||||
path = path.replace(/#(.*)$/g, '').replace('////g', '/');
|
|
||||||
|
|
||||||
// remove pagination from the path and replace the current pages
|
|
||||||
// with the actual requested page. E. g. `/page/3/` indicates that
|
|
||||||
// the user actually requested page 3, so we should request page 4
|
|
||||||
// next, unless it's the last page already.
|
|
||||||
if (path.match(paginationRegex)) {
|
|
||||||
currentPage = parseInt(path.match(paginationRegex)[1]);
|
|
||||||
|
|
||||||
path = path.replace(paginationRegex, '');
|
|
||||||
}
|
|
||||||
|
|
||||||
return path;
|
|
||||||
}
|
|
||||||
|
|
||||||
function infiniteScroll() {
|
|
||||||
// sanitize the pathname from possible pagination or hash params
|
|
||||||
pathname = sanitizePathname(pathname);
|
|
||||||
|
|
||||||
// return if already loading
|
|
||||||
if (isLoading) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// return if not scroll to the bottom
|
|
||||||
if (lastScrollY + lastWindowHeight <= lastDocumentHeight - buffer) {
|
|
||||||
ticking = false;
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* maxPages is defined in default.hbs and is the value
|
|
||||||
* of the amount of pagination pages.
|
|
||||||
* If we reached the last page or are past it,
|
|
||||||
* we return and disable the listeners.
|
|
||||||
*/
|
|
||||||
if (currentPage >= maxPages) {
|
|
||||||
window.removeEventListener('scroll', onScroll, {passive: true});
|
|
||||||
window.removeEventListener('resize', onResize);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
isLoading = true;
|
|
||||||
|
|
||||||
// next page
|
|
||||||
currentPage += 1;
|
|
||||||
|
|
||||||
// Load more
|
|
||||||
var nextPage = pathname + 'page/' + currentPage + '/';
|
|
||||||
|
|
||||||
$.get(nextPage, function (content) {
|
|
||||||
var parse = document.createRange().createContextualFragment(content);
|
|
||||||
var posts = parse.querySelectorAll('.post');
|
|
||||||
if (posts.length) {
|
|
||||||
[].forEach.call(posts, function (post) {
|
|
||||||
$result[0].appendChild(post);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}).fail(function (xhr) {
|
|
||||||
// 404 indicates we've run out of pages
|
|
||||||
if (xhr.status === 404) {
|
|
||||||
window.removeEventListener('scroll', onScroll, {passive: true});
|
|
||||||
window.removeEventListener('resize', onResize);
|
|
||||||
}
|
|
||||||
}).always(function () {
|
|
||||||
lastDocumentHeight = $document.height();
|
|
||||||
isLoading = false;
|
|
||||||
ticking = false;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
window.addEventListener('scroll', onScroll, {passive: true});
|
|
||||||
window.addEventListener('resize', onResize);
|
|
||||||
|
|
||||||
infiniteScroll();
|
|
||||||
});
|
|
||||||
@ -1,30 +1,28 @@
|
|||||||
|
/*global jQuery */
|
||||||
/*jshint browser:true */
|
/*jshint browser:true */
|
||||||
/*!
|
/*!
|
||||||
* FitVids 1.3
|
* FitVids 1.1
|
||||||
*
|
*
|
||||||
*
|
* Copyright 2013, Chris Coyier - http://css-tricks.com + Dave Rupert - http://daverupert.com
|
||||||
* Copyright 2017, Chris Coyier + Dave Rupert + Ghost Foundation
|
|
||||||
* This is an unofficial release, ported by John O'Nolan
|
|
||||||
* Credit to Thierry Koblentz - http://www.alistapart.com/articles/creating-intrinsic-ratios-for-video/
|
* Credit to Thierry Koblentz - http://www.alistapart.com/articles/creating-intrinsic-ratios-for-video/
|
||||||
* Released under the MIT license
|
* Released under the WTFPL license - http://sam.zoy.org/wtfpl/
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
|
|
||||||
;(function( $ ){
|
(function( $ ){
|
||||||
|
|
||||||
'use strict';
|
"use strict";
|
||||||
|
|
||||||
$.fn.fitVids = function( options ) {
|
$.fn.fitVids = function( options ) {
|
||||||
var settings = {
|
var settings = {
|
||||||
customSelector: null,
|
customSelector: null
|
||||||
ignore: null
|
|
||||||
};
|
};
|
||||||
|
|
||||||
if(!document.getElementById('fit-vids-style')) {
|
if(!document.getElementById('fit-vids-style')) {
|
||||||
// appendStyles: https://github.com/toddmotto/fluidvids/blob/master/dist/fluidvids.js
|
// appendStyles: https://github.com/toddmotto/fluidvids/blob/master/dist/fluidvids.js
|
||||||
var head = document.head || document.getElementsByTagName('head')[0];
|
var head = document.head || document.getElementsByTagName('head')[0];
|
||||||
var css = '.fluid-width-video-container{flex-grow: 1;width:100%;}.fluid-width-video-wrapper{width:100%;position:relative;padding:0;}.fluid-width-video-wrapper iframe,.fluid-width-video-wrapper object,.fluid-width-video-wrapper embed {position:absolute;top:0;left:0;width:100%;height:100%;}';
|
var css = '.fluid-width-video-wrapper{width:100%;position:relative;padding:0;}.fluid-width-video-wrapper iframe,.fluid-width-video-wrapper object,.fluid-width-video-wrapper embed {position:absolute;top:0;left:0;width:100%;height:100%;}';
|
||||||
var div = document.createElement("div");
|
var div = document.createElement('div');
|
||||||
div.innerHTML = '<p>x</p><style id="fit-vids-style">' + css + '</style>';
|
div.innerHTML = '<p>x</p><style id="fit-vids-style">' + css + '</style>';
|
||||||
head.appendChild(div.childNodes[1]);
|
head.appendChild(div.childNodes[1]);
|
||||||
}
|
}
|
||||||
@ -35,55 +33,35 @@
|
|||||||
|
|
||||||
return this.each(function(){
|
return this.each(function(){
|
||||||
var selectors = [
|
var selectors = [
|
||||||
'iframe[src*="player.vimeo.com"]',
|
"iframe[src*='player.vimeo.com']",
|
||||||
'iframe[src*="youtube.com"]',
|
"iframe[src*='youtube.com']",
|
||||||
'iframe[src*="youtube-nocookie.com"]',
|
"iframe[src*='youtube-nocookie.com']",
|
||||||
'iframe[src*="kickstarter.com"][src*="video.html"]',
|
"iframe[src*='kickstarter.com'][src*='video.html']",
|
||||||
'object',
|
"object",
|
||||||
'embed'
|
"embed"
|
||||||
];
|
];
|
||||||
|
|
||||||
if (settings.customSelector) {
|
if (settings.customSelector) {
|
||||||
selectors.push(settings.customSelector);
|
selectors.push(settings.customSelector);
|
||||||
}
|
}
|
||||||
|
|
||||||
var ignoreList = '.fitvidsignore';
|
|
||||||
|
|
||||||
if(settings.ignore) {
|
|
||||||
ignoreList = ignoreList + ', ' + settings.ignore;
|
|
||||||
}
|
|
||||||
|
|
||||||
var $allVideos = $(this).find(selectors.join(','));
|
var $allVideos = $(this).find(selectors.join(','));
|
||||||
$allVideos = $allVideos.not('object object'); // SwfObj conflict patch
|
$allVideos = $allVideos.not("object object"); // SwfObj conflict patch
|
||||||
$allVideos = $allVideos.not(ignoreList); // Disable FitVids on this video.
|
|
||||||
|
|
||||||
$allVideos.each(function(){
|
$allVideos.each(function(){
|
||||||
var $this = $(this);
|
var $this = $(this);
|
||||||
if($this.parents(ignoreList).length > 0) {
|
|
||||||
return; // Disable FitVids on this video.
|
|
||||||
}
|
|
||||||
if (this.tagName.toLowerCase() === 'embed' && $this.parent('object').length || $this.parent('.fluid-width-video-wrapper').length) { return; }
|
if (this.tagName.toLowerCase() === 'embed' && $this.parent('object').length || $this.parent('.fluid-width-video-wrapper').length) { return; }
|
||||||
if ((!$this.css('height') && !$this.css('width')) && (isNaN($this.attr('height')) || isNaN($this.attr('width'))))
|
|
||||||
{
|
|
||||||
$this.attr('height', 9);
|
|
||||||
$this.attr('width', 16);
|
|
||||||
}
|
|
||||||
var height = ( this.tagName.toLowerCase() === 'object' || ($this.attr('height') && !isNaN(parseInt($this.attr('height'), 10))) ) ? parseInt($this.attr('height'), 10) : $this.height(),
|
var height = ( this.tagName.toLowerCase() === 'object' || ($this.attr('height') && !isNaN(parseInt($this.attr('height'), 10))) ) ? parseInt($this.attr('height'), 10) : $this.height(),
|
||||||
width = !isNaN(parseInt($this.attr('width'), 10)) ? parseInt($this.attr('width'), 10) : $this.width(),
|
width = !isNaN(parseInt($this.attr('width'), 10)) ? parseInt($this.attr('width'), 10) : $this.width(),
|
||||||
aspectRatio = height / width;
|
aspectRatio = height / width;
|
||||||
if(!$this.attr('name')){
|
if(!$this.attr('id')){
|
||||||
var videoName = 'fitvid' + $.fn.fitVids._count;
|
var videoID = 'fitvid' + Math.floor(Math.random()*999999);
|
||||||
$this.attr('name', videoName);
|
$this.attr('id', videoID);
|
||||||
$.fn.fitVids._count++;
|
|
||||||
}
|
}
|
||||||
$this.wrap('<div class="fluid-width-video-container"><div class="fluid-width-video-wrapper"></div></div>').parent('.fluid-width-video-wrapper').css('padding-top', (aspectRatio * 100)+'%');
|
$this.wrap('<div class="fluid-width-video-wrapper"></div>').parent('.fluid-width-video-wrapper').css('padding-top', (aspectRatio * 100)+"%");
|
||||||
$this.removeAttr('height').removeAttr('width');
|
$this.removeAttr('height').removeAttr('width');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
// Internal counter for unique video names.
|
|
||||||
$.fn.fitVids._count = 0;
|
|
||||||
|
|
||||||
// Works with either jQuery or Zepto
|
// Works with either jQuery or Zepto
|
||||||
})( window.jQuery || window.Zepto );
|
})( window.jQuery || window.Zepto );
|
||||||
|
|||||||
Binary file not shown.
|
Before Width: | Height: | Size: 106 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 102 KiB |
69
author.hbs
69
author.hbs
@ -1,54 +1,39 @@
|
|||||||
{{!< default}}
|
{{!< default}}
|
||||||
{{!-- The tag above means - insert everything in this file into the {body} of the default.hbs template --}}
|
|
||||||
|
|
||||||
|
{{! The comment above "< default" means - insert everything in this file into
|
||||||
|
the {body} of the default.hbs template, which contains our header/footer. }}
|
||||||
|
|
||||||
|
{{! Everything inside the #author tags pulls data from the author }}
|
||||||
{{#author}}
|
{{#author}}
|
||||||
{{!-- Everything inside the #author tags pulls data from the author --}}
|
<header class="site-head" {{#if cover}}style="background-image: url({{cover}})"{{/if}}>
|
||||||
<header class="site-header outer {{#if cover_image}}" style="background-image: url({{cover_image}}){{else}}no-cover{{/if}}">
|
<div class="vertical">
|
||||||
<div class="inner">
|
<div class="site-head-content inner">
|
||||||
{{> "site-nav"}}
|
<h1 class="blog-title">{{name}}</h1>
|
||||||
<div class="site-header-content">
|
<h2 class="blog-description">{{bio}}</h2>
|
||||||
{{#if profile_image}}
|
|
||||||
<img class="author-profile-image" src="{{profile_image}}" alt="{{name}}" />
|
|
||||||
{{/if}}
|
|
||||||
<h1 class="site-title">{{name}}</h1>
|
|
||||||
{{#if bio}}
|
|
||||||
<h2 class="author-bio">{{bio}}</h2>
|
|
||||||
{{/if}}
|
|
||||||
<div class="author-meta">
|
|
||||||
{{#if location}}
|
|
||||||
<div class="author-location">{{location}} <span class="bull">•</span></div>
|
|
||||||
{{/if}}
|
|
||||||
<div class="author-stats">
|
|
||||||
{{plural ../pagination.total empty='No posts' singular='% post' plural='% posts'}} <span class="bull">•</span>
|
|
||||||
</div>
|
|
||||||
{{#if website}}
|
|
||||||
<a class="social-link social-link-wb" href="{{website}}" target="_blank" rel="noopener">{{> "icons/website"}}</a>
|
|
||||||
{{/if}}
|
|
||||||
{{#if twitter}}
|
|
||||||
<a class="social-link social-link-tw" href="{{twitter_url}}" target="_blank" rel="noopener">{{> "icons/twitter"}}</a>
|
|
||||||
{{/if}}
|
|
||||||
{{#if facebook}}
|
|
||||||
<a class="social-link social-link-fb" href="{{facebook_url}}" target="_blank" rel="noopener">{{> "icons/facebook"}}</a>
|
|
||||||
{{/if}}
|
|
||||||
<a class="social-link social-link-rss" href="https://feedly.com/i/subscription/feed/{{url absolute="true"}}rss/" target="_blank" rel="noopener">{{> "icons/rss"}}</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
{{/author}}
|
{{/author}}
|
||||||
|
|
||||||
{{!-- The main content area --}}
|
{{! The main content area on the homepage }}
|
||||||
<main id="site-main" class="site-main outer">
|
<main class="content" role="main">
|
||||||
<div class="inner">
|
|
||||||
|
|
||||||
<div class="post-feed">
|
{{! Each post will be output using this markup }}
|
||||||
{{#foreach posts}}
|
{{#foreach posts}}
|
||||||
|
|
||||||
{{!-- The tag below includes the markup for each post - partials/post-card.hbs --}}
|
<article class="{{post_class}}">
|
||||||
{{> "post-card"}}
|
<header class="post-header">
|
||||||
|
<span class="post-meta"><time datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMM YYYY"}}</time> {{tags prefix="on "}}</span>
|
||||||
|
<h2 class="post-title"><a href="{{url}}">{{{title}}}</a></h2>
|
||||||
|
</header>
|
||||||
|
<section class="post-excerpt">
|
||||||
|
<p>{{excerpt}}… <a class="read-more" href="{{url}}">»</a></p>
|
||||||
|
</section>
|
||||||
|
</article>
|
||||||
|
|
||||||
{{/foreach}}
|
{{/foreach}}
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
{{!! After all the posts, we have the previous/next pagination links }}
|
||||||
</main>
|
{{pagination}}
|
||||||
|
|
||||||
|
</main>
|
||||||
98
default.hbs
98
default.hbs
@ -1,95 +1,45 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="{{lang}}">
|
<html>
|
||||||
<head>
|
<head>
|
||||||
|
{{! Document Settings }}
|
||||||
{{!-- Document Settings --}}
|
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||||
|
|
||||||
{{!-- Base Meta --}}
|
{{! Page Meta }}
|
||||||
<title>{{meta_title}}</title>
|
<title>{{meta_title}}</title>
|
||||||
|
<meta name="description" content="{{meta_description}}" />
|
||||||
|
|
||||||
<meta name="HandheldFriendly" content="True" />
|
<meta name="HandheldFriendly" content="True" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
|
||||||
{{!-- Styles'n'Scripts --}}
|
<link rel="shortcut icon" href="{{asset "favicon.ico"}}">
|
||||||
<link rel="stylesheet" type="text/css" href="{{asset "built/screen.css"}}" />
|
|
||||||
|
|
||||||
{{!-- This tag outputs SEO meta+structured data and other important settings --}}
|
{{! Styles'n'Scripts }}
|
||||||
|
<link rel="stylesheet" type="text/css" href="{{asset "css/screen.css"}}" />
|
||||||
|
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Noto+Serif:400,700,400italic|Open+Sans:700,400" />
|
||||||
|
|
||||||
|
{{! Ghost outputs important style and meta data with this tag }}
|
||||||
{{ghost_head}}
|
{{ghost_head}}
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body class="{{body_class}}">
|
<body class="{{body_class}}">
|
||||||
|
|
||||||
<div class="site-wrapper">
|
{{! Everything else gets inserted here }}
|
||||||
|
{{{body}}}
|
||||||
|
|
||||||
{{!-- All the main content gets inserted here, index.hbs, post.hbs, etc --}}
|
<footer class="site-footer">
|
||||||
{{{body}}}
|
<a class="subscribe icon-feed" href="{{@blog.url}}/rss/"><span class="tooltip">Subscribe!</span></a>
|
||||||
|
<div class="inner">
|
||||||
{{!-- The footer at the very bottom of the screen --}}
|
<section class="copyright">All content copyright <a href="{{@blog.url}}/">{{@blog.title}}</a> © {{date format="YYYY"}} • All rights reserved.</section>
|
||||||
<footer class="site-footer outer">
|
<section class="poweredby">Proudly published with <a class="icon-ghost" href="https://ghost.org">Ghost</a></section>
|
||||||
<div class="site-footer-content inner">
|
|
||||||
<section class="copyright"><a href="{{@blog.url}}">{{@blog.title}}</a> © {{date format="YYYY"}}</section>
|
|
||||||
<nav class="site-footer-nav">
|
|
||||||
<a href="{{@blog.url}}">Latest Posts</a>
|
|
||||||
{{#if @blog.facebook}}<a href="{{facebook_url @blog.facebook}}" target="_blank" rel="noopener">Facebook</a>{{/if}}
|
|
||||||
{{#if @blog.twitter}}<a href="{{twitter_url @blog.twitter}}" target="_blank" rel="noopener">Twitter</a>{{/if}}
|
|
||||||
<a href="https://ghost.org" target="_blank" rel="noopener">Ghost</a>
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{{!-- The big email subscribe modal content --}}
|
|
||||||
{{#if @labs.subscribers}}
|
|
||||||
<div id="subscribe" class="subscribe-overlay">
|
|
||||||
<a class="subscribe-overlay-close" href="#"></a>
|
|
||||||
<div class="subscribe-overlay-content">
|
|
||||||
{{#if @blog.logo}}
|
|
||||||
<img class="subscribe-overlay-logo" src="{{@blog.logo}}" alt="{{@blog.title}}" />
|
|
||||||
{{/if}}
|
|
||||||
<h1 class="subscribe-overlay-title">Subscribe to {{@blog.title}}</h1>
|
|
||||||
<p class="subscribe-overlay-description">Stay up to date! Get all the latest & greatest posts delivered straight to your inbox</p>
|
|
||||||
{{subscribe_form placeholder="youremail@example.com"}}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</footer>
|
||||||
{{/if}}
|
|
||||||
|
|
||||||
<script>
|
{{! Ghost outputs important scripts and data with this tag }}
|
||||||
var images = document.querySelectorAll('.kg-gallery-image img');
|
|
||||||
images.forEach(function (image) {
|
|
||||||
var container = image.closest('.kg-gallery-image');
|
|
||||||
var width = image.attributes.width.value;
|
|
||||||
var height = image.attributes.height.value;
|
|
||||||
var ratio = width / height;
|
|
||||||
container.style.flex = ratio + ' 1 0%';
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
|
|
||||||
{{!-- jQuery + Fitvids, which makes all video embeds responsive --}}
|
|
||||||
<script
|
|
||||||
src="https://code.jquery.com/jquery-3.2.1.min.js"
|
|
||||||
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
|
|
||||||
crossorigin="anonymous">
|
|
||||||
</script>
|
|
||||||
<script type="text/javascript" src="{{asset "js/jquery.fitvids.js"}}"></script>
|
|
||||||
|
|
||||||
{{#if pagination.pages}}
|
|
||||||
<script>
|
|
||||||
// maxPages is a global variable that is needed to determine
|
|
||||||
// if we need to load more pages for the infinitescroll, or if
|
|
||||||
// we reached the last page already.
|
|
||||||
var maxPages = parseInt('{{pagination.pages}}');
|
|
||||||
</script>
|
|
||||||
<script src="{{asset "js/infinitescroll.js"}}"></script>
|
|
||||||
{{/if}}
|
|
||||||
|
|
||||||
{{!-- The #block helper will pull in data from the #contentFor other template files. In this case, there's some JavaScript which we only want to use in post.hbs, but it needs to be included down here, after jQuery has already loaded. --}}
|
|
||||||
{{{block "scripts"}}}
|
|
||||||
|
|
||||||
{{!-- Ghost outputs important scripts and data with this tag - it should always be the very last thing before the closing body tag --}}
|
|
||||||
{{ghost_foot}}
|
{{ghost_foot}}
|
||||||
|
|
||||||
|
{{! The main JavaScript file for Casper }}
|
||||||
|
<script type="text/javascript" src="{{asset "js/jquery.fitvids.js"}}"></script>
|
||||||
|
<script type="text/javascript" src="{{asset "js/index.js"}}"></script>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@ -1,56 +0,0 @@
|
|||||||
{{!--
|
|
||||||
This error template is used for all 404 errors, which might occur on your site.
|
|
||||||
It's a good idea to keep this template as minimal as possible in terms of both file size and complexity.
|
|
||||||
--}}
|
|
||||||
|
|
||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8" />
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
||||||
<title>{{meta_title}}</title>
|
|
||||||
<meta name="HandheldFriendly" content="True" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="{{asset "built/screen.css"}}" />
|
|
||||||
</head>
|
|
||||||
<body class="error-template">
|
|
||||||
<div class="site-wrapper">
|
|
||||||
|
|
||||||
<header class="site-header outer {{#if feature_image}}" style="background-image: url({{feature_image}}){{else}}no-cover{{/if}}">
|
|
||||||
<div class="inner">
|
|
||||||
<nav class="site-nav-center">
|
|
||||||
{{#if @blog.logo}}
|
|
||||||
<a class="site-nav-logo" href="{{@blog.url}}"><img src="{{@blog.logo}}" alt="{{@blog.title}}" /></a>
|
|
||||||
{{else}}
|
|
||||||
<a class="site-nav-logo" href="{{@blog.url}}">{{@blog.title}}</a>
|
|
||||||
{{/if}}
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<main id="site-main" class="site-main outer">
|
|
||||||
<div class="inner">
|
|
||||||
|
|
||||||
<section class="error-message">
|
|
||||||
<h1 class="error-code">{{code}}</h1>
|
|
||||||
<p class="error-description">{{message}}</p>
|
|
||||||
<a class="error-link" href="{{@blog.url}}">Go to the front page →</a>
|
|
||||||
</section>
|
|
||||||
</div>
|
|
||||||
</main>
|
|
||||||
|
|
||||||
{{#get "posts" limit="3"}}
|
|
||||||
<aside class="outer">
|
|
||||||
<div class="inner">
|
|
||||||
<div class="post-feed">
|
|
||||||
{{#foreach posts}}
|
|
||||||
{{> "post-card"}}
|
|
||||||
{{/foreach}}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</aside>
|
|
||||||
{{/get}}
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
63
error.hbs
63
error.hbs
@ -1,63 +0,0 @@
|
|||||||
{{!--
|
|
||||||
This error template is used for all 400/500 errors, except 404, which might occur on your site.
|
|
||||||
It's a good idea to keep this template as minimal as possible in terms of both file size and complexity.
|
|
||||||
You'll notice that we *don't* use any JavsScript, or ghost_head / ghost_foot in this file.
|
|
||||||
--}}
|
|
||||||
|
|
||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8" />
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
||||||
<title>{{meta_title}}</title>
|
|
||||||
<meta name="HandheldFriendly" content="True" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="{{asset "built/screen.css"}}" />
|
|
||||||
</head>
|
|
||||||
<body class="error-template">
|
|
||||||
<div class="site-wrapper">
|
|
||||||
|
|
||||||
<header class="site-header outer {{#if feature_image}}" style="background-image: url({{feature_image}}){{else}}no-cover{{/if}}">
|
|
||||||
<div class="inner">
|
|
||||||
<nav class="site-nav-center">
|
|
||||||
{{#if @blog.logo}}
|
|
||||||
<a class="site-nav-logo" href="{{@blog.url}}"><img src="{{@blog.logo}}" alt="{{@blog.title}}" /></a>
|
|
||||||
{{else}}
|
|
||||||
<a class="site-nav-logo" href="{{@blog.url}}">{{@blog.title}}</a>
|
|
||||||
{{/if}}
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<main id="site-main" class="site-main outer">
|
|
||||||
<div class="inner">
|
|
||||||
|
|
||||||
<section class="error-message">
|
|
||||||
<h1 class="error-code">{{code}}</h1>
|
|
||||||
<p class="error-description">{{message}}</p>
|
|
||||||
<a class="error-link" href="{{@blog.url}}">Go to the front page →</a>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
{{#if errorDetails}}
|
|
||||||
<section class="error-stack">
|
|
||||||
<h3>Theme errors</h3>
|
|
||||||
<ul class="error-stack-list">
|
|
||||||
{{#each errorDetails}}
|
|
||||||
<li>
|
|
||||||
<em class="error-stack-function">{{{rule}}}</em>
|
|
||||||
|
|
||||||
{{#each failures}}
|
|
||||||
<p><span class="error-stack-file">Ref: {{ref}}</span></p>
|
|
||||||
<p><span class="error-stack-file">Message: {{message}}</span></p>
|
|
||||||
{{/each}}
|
|
||||||
</li>
|
|
||||||
{{/each}}
|
|
||||||
</ul>
|
|
||||||
</section>
|
|
||||||
{{/if}}
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</main>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
69
gulpfile.js
69
gulpfile.js
@ -1,69 +0,0 @@
|
|||||||
var gulp = require('gulp');
|
|
||||||
|
|
||||||
// gulp plugins and utils
|
|
||||||
var gutil = require('gulp-util');
|
|
||||||
var livereload = require('gulp-livereload');
|
|
||||||
var postcss = require('gulp-postcss');
|
|
||||||
var sourcemaps = require('gulp-sourcemaps');
|
|
||||||
var zip = require('gulp-zip');
|
|
||||||
|
|
||||||
// postcss plugins
|
|
||||||
var autoprefixer = require('autoprefixer');
|
|
||||||
var colorFunction = require('postcss-color-function');
|
|
||||||
var cssnano = require('cssnano');
|
|
||||||
var customProperties = require('postcss-custom-properties');
|
|
||||||
var easyimport = require('postcss-easy-import');
|
|
||||||
|
|
||||||
var swallowError = function swallowError(error) {
|
|
||||||
gutil.log(error.toString());
|
|
||||||
gutil.beep();
|
|
||||||
this.emit('end');
|
|
||||||
};
|
|
||||||
|
|
||||||
var nodemonServerInit = function () {
|
|
||||||
livereload.listen(1234);
|
|
||||||
};
|
|
||||||
|
|
||||||
gulp.task('build', ['css'], function (/* cb */) {
|
|
||||||
return nodemonServerInit();
|
|
||||||
});
|
|
||||||
|
|
||||||
gulp.task('css', function () {
|
|
||||||
var processors = [
|
|
||||||
easyimport,
|
|
||||||
customProperties,
|
|
||||||
colorFunction(),
|
|
||||||
autoprefixer({browsers: ['last 2 versions']}),
|
|
||||||
cssnano()
|
|
||||||
];
|
|
||||||
|
|
||||||
return gulp.src('assets/css/*.css')
|
|
||||||
.on('error', swallowError)
|
|
||||||
.pipe(sourcemaps.init())
|
|
||||||
.pipe(postcss(processors))
|
|
||||||
.pipe(sourcemaps.write('.'))
|
|
||||||
.pipe(gulp.dest('assets/built/'))
|
|
||||||
.pipe(livereload());
|
|
||||||
});
|
|
||||||
|
|
||||||
gulp.task('watch', function () {
|
|
||||||
gulp.watch('assets/css/**', ['css']);
|
|
||||||
});
|
|
||||||
|
|
||||||
gulp.task('zip', ['css'], function () {
|
|
||||||
var targetDir = 'dist/';
|
|
||||||
var themeName = require('./package.json').name;
|
|
||||||
var filename = themeName + '.zip';
|
|
||||||
|
|
||||||
return gulp.src([
|
|
||||||
'**',
|
|
||||||
'!node_modules', '!node_modules/**',
|
|
||||||
'!dist', '!dist/**'
|
|
||||||
])
|
|
||||||
.pipe(zip(filename))
|
|
||||||
.pipe(gulp.dest(targetDir));
|
|
||||||
});
|
|
||||||
|
|
||||||
gulp.task('default', ['build'], function () {
|
|
||||||
gulp.start('watch');
|
|
||||||
});
|
|
||||||
54
index.hbs
54
index.hbs
@ -1,36 +1,38 @@
|
|||||||
{{!< default}}
|
{{!< default}}
|
||||||
{{!-- The tag above means: insert everything in this file
|
|
||||||
into the {body} of the default.hbs template --}}
|
|
||||||
|
|
||||||
{{!-- The big featured header, it uses blog cover image as a BG if available --}}
|
{{! The comment above "< default" means - insert everything in this file into
|
||||||
<header class="site-header outer {{#if @blog.cover_image}}" style="background-image: url({{@blog.cover_image}}){{else}}no-cover{{/if}}">
|
the {body} of the default.hbs template, which contains our header/footer. }}
|
||||||
<div class="inner">
|
|
||||||
<div class="site-header-content">
|
{{! The big featured header on the homepage, with the site logo and description }}
|
||||||
<h1 class="site-title">
|
<header class="site-head" {{#if @blog.cover}}style="background-image: url({{@blog.cover}})"{{/if}}>
|
||||||
{{#if @blog.logo}}
|
<div class="vertical">
|
||||||
<img class="site-logo" src="{{@blog.logo}}" alt="{{@blog.title}}" />
|
<div class="site-head-content inner">
|
||||||
{{else}}
|
{{#if @blog.logo}}<a class="blog-logo" href="{{@blog.url}}"><img src="{{@blog.logo}}" alt="Blog Logo" /></a>{{/if}}
|
||||||
{{@blog.title}}
|
<h1 class="blog-title">{{@blog.title}}</h1>
|
||||||
{{/if}}
|
<h2 class="blog-description">{{@blog.description}}</h2>
|
||||||
</h1>
|
|
||||||
<h2 class="site-description">{{@blog.description}}</h2>
|
|
||||||
</div>
|
</div>
|
||||||
{{> "site-nav"}}
|
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
{{!-- The main content area --}}
|
{{! The main content area on the homepage }}
|
||||||
<main id="site-main" class="site-main outer">
|
<main class="content" role="main">
|
||||||
<div class="inner">
|
|
||||||
|
|
||||||
<div class="post-feed">
|
{{! Each post will be output using this markup }}
|
||||||
{{#foreach posts}}
|
{{#foreach posts}}
|
||||||
|
|
||||||
{{!-- The tag below includes the markup for each post - partials/post-card.hbs --}}
|
<article class="{{post_class}}">
|
||||||
{{> "post-card"}}
|
<header class="post-header">
|
||||||
|
<span class="post-meta">{{author}}, <time datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMM YYYY"}}</time> {{tags prefix="on "}}</span>
|
||||||
|
<h2 class="post-title"><a href="{{url}}">{{{title}}}</a></h2>
|
||||||
|
</header>
|
||||||
|
<section class="post-excerpt">
|
||||||
|
<p>{{excerpt}}… <a class="read-more" href="{{url}}">»</a></p>
|
||||||
|
</section>
|
||||||
|
</article>
|
||||||
|
|
||||||
{{/foreach}}
|
{{/foreach}}
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
{{!! After all the posts, we have the previous/next pagination links }}
|
||||||
</main>
|
{{pagination}}
|
||||||
|
|
||||||
|
</main>
|
||||||
60
package.json
60
package.json
@ -1,60 +1,4 @@
|
|||||||
{
|
{
|
||||||
"name": "casper",
|
"name": "Casper",
|
||||||
"description": "The default personal blogging theme for Ghost. Beautiful, minimal and responsive.",
|
"version": "0.9.4"
|
||||||
"demo": "https://demo.ghost.io",
|
|
||||||
"version": "2.6.1",
|
|
||||||
"engines": {
|
|
||||||
"ghost": ">=2.0.0"
|
|
||||||
},
|
|
||||||
"license": "MIT",
|
|
||||||
"screenshots": {
|
|
||||||
"desktop": "assets/screenshot-desktop.jpg",
|
|
||||||
"mobile": "assets/screenshot-mobile.jpg"
|
|
||||||
},
|
|
||||||
"scripts": {
|
|
||||||
"dev": "gulp",
|
|
||||||
"zip": "gulp zip",
|
|
||||||
"test": "gscan ."
|
|
||||||
},
|
|
||||||
"author": {
|
|
||||||
"name": "Ghost Foundation",
|
|
||||||
"email": "hello@ghost.org",
|
|
||||||
"url": "https://ghost.org"
|
|
||||||
},
|
|
||||||
"gpm": {
|
|
||||||
"type": "theme",
|
|
||||||
"categories": [
|
|
||||||
"Minimal",
|
|
||||||
"Magazine"
|
|
||||||
]
|
|
||||||
},
|
|
||||||
"keywords": [
|
|
||||||
"ghost",
|
|
||||||
"theme",
|
|
||||||
"ghost-theme"
|
|
||||||
],
|
|
||||||
"repository": {
|
|
||||||
"type": "git",
|
|
||||||
"url": "https://github.com/TryGhost/Casper.git"
|
|
||||||
},
|
|
||||||
"bugs": "https://github.com/TryGhost/Casper/issues",
|
|
||||||
"contributors": "https://github.com/TryGhost/Casper/graphs/contributors",
|
|
||||||
"devDependencies": {
|
|
||||||
"autoprefixer": "6.3.6",
|
|
||||||
"cssnano": "3.7.1",
|
|
||||||
"gscan": "^2.0.0",
|
|
||||||
"gulp": "3.9.1",
|
|
||||||
"gulp-livereload": "3.8.1",
|
|
||||||
"gulp-postcss": "6.1.1",
|
|
||||||
"gulp-sourcemaps": "1.6.0",
|
|
||||||
"gulp-util": "3.0.7",
|
|
||||||
"gulp-watch": "4.3.8",
|
|
||||||
"gulp-zip": "4.0.0",
|
|
||||||
"postcss-color-function": "2.0.1",
|
|
||||||
"postcss-custom-properties": "5.0.1",
|
|
||||||
"postcss-easy-import": "1.0.1"
|
|
||||||
},
|
|
||||||
"config": {
|
|
||||||
"posts_per_page": 25
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
58
page.hbs
58
page.hbs
@ -1,50 +1,32 @@
|
|||||||
{{!< default}}
|
{{!< default}}
|
||||||
{{!-- The tag above means: insert everything in this file
|
|
||||||
into the {body} of the default.hbs template --}}
|
|
||||||
|
|
||||||
{{!-- The big featured header, it uses blog cover image as a BG if available --}}
|
{{! This is a page template. A page outputs content just like any other post, and has all the same
|
||||||
<header class="site-header outer">
|
attributes by default, but you can also customise it to behave differently if you prefer. }}
|
||||||
<div class="inner">
|
|
||||||
{{> "site-nav"}}
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
{{!-- Everything inside the #post tags pulls data from the post --}}
|
<main class="content" role="main">
|
||||||
{{#post}}
|
|
||||||
|
|
||||||
<main id="site-main" class="site-main outer">
|
<article class="{{post_class}}">
|
||||||
<div class="inner">
|
|
||||||
|
|
||||||
<article class="post-full {{post_class}} {{#unless feature_image}}no-image{{/unless}}">
|
<header class="post-header">
|
||||||
|
<a class="blog-logo" href="{{@blog.url}}">
|
||||||
|
{{#if @blog.logo}}
|
||||||
|
<img src="{{@blog.logo}}" alt="Blog Logo" />
|
||||||
|
{{else}}
|
||||||
|
<span class="blog-title">{{@blog.title}}</span>
|
||||||
|
{{/if}}
|
||||||
|
</a>
|
||||||
|
</header>
|
||||||
|
|
||||||
<header class="post-full-header">
|
{{#post}}
|
||||||
<h1 class="post-full-title">{{title}}</h1>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
{{#if feature_image}}
|
<h1 class="post-title">{{{title}}}</h1>
|
||||||
<figure class="post-full-image" style="background-image: url({{feature_image}})">
|
|
||||||
</figure>
|
|
||||||
{{/if}}
|
|
||||||
|
|
||||||
<section class="post-full-content">
|
<section class="post-content">
|
||||||
<div class="post-content">
|
{{content}}
|
||||||
{{content}}
|
|
||||||
</div>
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
</article>
|
{{/post}}
|
||||||
|
|
||||||
|
</article>
|
||||||
|
|
||||||
</div>
|
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
{{/post}}
|
|
||||||
|
|
||||||
{{!-- The #contentFor helper here will send everything inside it up to the matching #block helper found in default.hbs --}}
|
|
||||||
{{#contentFor "scripts"}}
|
|
||||||
<script>
|
|
||||||
$(function() {
|
|
||||||
var $postContent = $(".post-full-content");
|
|
||||||
$postContent.fitVids();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
{{/contentFor}}
|
|
||||||
|
|||||||
@ -1,72 +0,0 @@
|
|||||||
<section class="post-full-authors">
|
|
||||||
|
|
||||||
<div class="post-full-authors-content">
|
|
||||||
<p>This post was a collaboration between</p>
|
|
||||||
<p>{{authors}}</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ul class="author-list">
|
|
||||||
{{#foreach authors}}
|
|
||||||
<li class="author-list-item">
|
|
||||||
|
|
||||||
<div class="author-card">
|
|
||||||
<div class="basic-info">
|
|
||||||
{{#if profile_image}}
|
|
||||||
<img class="author-profile-image" src="{{profile_image}}" alt="{{name}}" />
|
|
||||||
{{else}}
|
|
||||||
<div class="author-profile-image">{{> "icons/avatar"}}</div>
|
|
||||||
{{/if}}
|
|
||||||
<h2>{{name}}</h2>
|
|
||||||
</div>
|
|
||||||
<div class="bio">
|
|
||||||
{{#if bio}}
|
|
||||||
<p>{{bio}}</p>
|
|
||||||
<p><a href="{{url}}">More posts</a> by {{name}}.</p>
|
|
||||||
{{else}}
|
|
||||||
<p>Read <a href="{{url}}">more posts</a> by this author.</p>
|
|
||||||
{{/if}}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{{#if profile_image}}
|
|
||||||
<a href="{{url}}" class="moving-avatar"><img class="author-profile-image" src="{{profile_image}}" alt="{{name}}" /></a>
|
|
||||||
{{else}}
|
|
||||||
<a href="{{url}}" class="moving-avatar author-profile-image">{{> "icons/avatar"}}</a>
|
|
||||||
{{/if}}
|
|
||||||
|
|
||||||
</li>
|
|
||||||
{{/foreach}}
|
|
||||||
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
|
|
||||||
{{#contentFor "scripts"}}
|
|
||||||
<script>
|
|
||||||
// Adds delay to author card dropups to disappear. This gives enough
|
|
||||||
// time for the user to interact with the author card while they move
|
|
||||||
// the mouse from the avatar to the card. Also makes space for the
|
|
||||||
// interacted avatar.
|
|
||||||
$(document).ready(function () {
|
|
||||||
|
|
||||||
var hoverTimeout;
|
|
||||||
|
|
||||||
$('.author-list-item').hover(function(){
|
|
||||||
var $this = $(this);
|
|
||||||
|
|
||||||
clearTimeout(hoverTimeout);
|
|
||||||
|
|
||||||
$('.author-card').removeClass('hovered');
|
|
||||||
$(this).children('.author-card').addClass('hovered');
|
|
||||||
|
|
||||||
}, function() {
|
|
||||||
var $this = $(this);
|
|
||||||
|
|
||||||
hoverTimeout = setTimeout(function() {
|
|
||||||
$this.children('.author-card').removeClass('hovered');
|
|
||||||
}, 800);
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
{{/contentFor}}
|
|
||||||
@ -1,23 +0,0 @@
|
|||||||
{{!-- Everything inside the #author tags pulls data from the author --}}
|
|
||||||
{{#primary_author}}
|
|
||||||
|
|
||||||
<section class="author-card">
|
|
||||||
{{#if profile_image}}
|
|
||||||
<img class="author-profile-image" src="{{profile_image}}" alt="{{name}}" />
|
|
||||||
{{else}}
|
|
||||||
<span class="avatar-wrapper">{{> "icons/avatar"}}</span>
|
|
||||||
{{/if}}
|
|
||||||
<section class="author-card-content">
|
|
||||||
<h4 class="author-card-name"><a href="{{url}}">{{name}}</a></h4>
|
|
||||||
{{#if bio}}
|
|
||||||
<p>{{bio}}</p>
|
|
||||||
{{else}}
|
|
||||||
<p>Read <a href="{{url}}">more posts</a> by this author.</p>
|
|
||||||
{{/if}}
|
|
||||||
</section>
|
|
||||||
</section>
|
|
||||||
<div class="post-full-footer-right">
|
|
||||||
<a class="author-card-button" href="{{url}}">Read More</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{{/primary_author}}
|
|
||||||
@ -1,28 +0,0 @@
|
|||||||
<div class="floating-header">
|
|
||||||
<div class="floating-header-logo">
|
|
||||||
<a href="{{@blog.url}}">
|
|
||||||
{{#if @blog.icon}}
|
|
||||||
<img src="{{@blog.icon}}" alt="{{@blog.title}} icon" />
|
|
||||||
{{/if}}
|
|
||||||
<span>{{@blog.title}}</span>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<span class="floating-header-divider">—</span>
|
|
||||||
<div class="floating-header-title">{{title}}</div>
|
|
||||||
<div class="floating-header-share">
|
|
||||||
<div class="floating-header-share-label">Share this {{> "icons/point"}}</div>
|
|
||||||
<a class="floating-header-share-tw" href="https://twitter.com/share?text={{encode title}}&url={{url absolute="true"}}"
|
|
||||||
onclick="window.open(this.href, 'share-twitter', 'width=550,height=235');return false;">
|
|
||||||
{{> "icons/twitter"}}
|
|
||||||
</a>
|
|
||||||
<a class="floating-header-share-fb" href="https://www.facebook.com/sharer/sharer.php?u={{url absolute="true"}}"
|
|
||||||
onclick="window.open(this.href, 'share-facebook','width=580,height=296');return false;">
|
|
||||||
{{> "icons/facebook"}}
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<progress id="reading-progress" class="progress" value="0">
|
|
||||||
<div class="progress-container">
|
|
||||||
<span class="progress-bar"></span>
|
|
||||||
</div>
|
|
||||||
</progress>
|
|
||||||
</div>
|
|
||||||
@ -1 +0,0 @@
|
|||||||
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><path d="M3.513 18.998C4.749 15.504 8.082 13 12 13s7.251 2.504 8.487 5.998C18.47 21.442 15.417 23 12 23s-6.47-1.558-8.487-4.002zM12 12c2.21 0 4-2.79 4-5s-1.79-4-4-4-4 1.79-4 4 1.79 5 4 5z" fill="#FFF"/></g></svg>
|
|
||||||
|
Before Width: | Height: | Size: 308 B |
@ -1 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path d="M19 6h5V0h-5c-3.86 0-7 3.14-7 7v3H8v6h4v16h6V16h5l1-6h-6V7c0-.542.458-1 1-1z"/></svg>
|
|
||||||
|
Before Width: | Height: | Size: 155 B |
@ -1 +0,0 @@
|
|||||||
<svg class="ghost-svg" viewBox="0 0 493 161" xmlns="http://www.w3.org/2000/svg"><title>Ghost Logo</title><g fill="none" fill-rule="evenodd"><path d="M328.52 37.36c-27.017 0-40.97 19.323-40.97 43.16 0 23.837 13.61 43.162 40.97 43.162s40.968-19.325 40.968-43.163c0-23.84-13.954-43.16-40.97-43.16zm20.438 43.237c-.02 15.328-5.126 27.743-20.44 27.743-15.312 0-20.42-12.414-20.435-27.743v-.078c.016-15.33 5.124-27.74 20.437-27.74 15.312 0 20.42 12.41 20.438 27.74v.07zM207.553 5.19c0-1.103.885-2.124 1.984-2.282 0 0 13.577-1.95 14.784-2.115 1.37-.187 3.19.798 3.19 2.744v44.236c3.23-3.105 6.79-5.608 10.66-7.515 3.88-1.906 8.43-2.86 13.66-2.86 4.53 0 8.53.776 12.03 2.33 3.5 1.55 6.43 3.73 8.77 6.533 2.34 2.81 4.12 6.16 5.33 10.05 1.21 3.9 1.82 8.19 1.82 12.87v51.35c0 1.1-.89 2-2 2h-15.95c-1.1 0-2-.9-2-1.99V69.18c0-5.118-1.17-9.08-3.51-11.888-2.35-2.804-5.86-4.207-10.544-4.207-3.45 0-6.677.79-9.69 2.37-3.02 1.58-5.87 3.73-8.564 6.46v58.617c0 1.102-.894 2-2.002 2h-15.94c-1.11 0-2.005-.895-2.005-2V5.188zm244.007 95.327v-43.68h-13.482c-1.1 0-1.742-.87-1.443-1.916l3-10.49c.262-.9.942-1.87 2.308-2.07l9.597-1.35 3.508-23.49c.163-1.09 1.18-2.1 2.274-2.26 0 0 9.192-1.31 10.963-1.58 1.673-.25 3.19.97 3.19 2.81v24.52h17.565c1.106 0 2.002.9 2.002 2.01v11.82c0 1.11-.89 2.01-2.002 2.01h-17.566v43.08c0 6.02 3.623 8.32 7.095 8.32 2.12 0 5.02-1.14 7.19-2.16 1.34-.62 3.41-.16 3.95 1.73l2.45 8.65c.3 1.07-.25 2.37-1.23 2.86 0 0-7.29 4.37-17.06 4.37-13.73 0-22.33-8.08-22.33-23.16zm-44.584-47.74c-7.084 0-12.657 2.476-12.657 8.433 0 7.44 12.01 9.606 20.23 12.64 5.49 2.027 20.24 5.98 20.24 22.016 0 19.48-16 27.807-33.06 27.807-17.06 0-25.4-5.465-25.4-5.465-.96-.527-1.5-1.822-1.2-2.89 0 0 2.1-7.52 2.64-9.386.48-1.68 2.41-2.27 3.64-1.792 4.39 1.712 12.32 4.092 21.28 4.092 9.07 0 13.46-2.803 13.46-8.777 0-7.95-12.26-10.38-20.36-12.967-5.59-1.78-20.36-5.93-20.36-23.566 0-17.373 15.08-25.524 31.2-25.524 13.64 0 23.5 4.69 23.5 4.69 1.01.427 1.58 1.635 1.28 2.698l-2.658 9.357c-.488 1.74-1.898 2.537-3.666 1.957-3.89-1.277-11.2-3.322-18.15-3.322zm-210.313-15.28c-6.695.775-11.472 3.962-14.562 6.93-6.06-4.81-14.49-7.106-23.94-7.106-18.95 0-33.76 9.26-33.76 29.43 0 11.58 4.88 19.56 12.62 24.26-5.75 2.75-9.57 8.59-9.57 14.34 0 9.61 7.5 12.61 7.5 12.61s-13.11 6.44-13.11 19.32c0 16.49 15.01 23.16 33.34 23.16 26.43 0 44.61-11.04 44.61-31.31 0-12.47-9.44-19.36-30.01-20.18-12.2-.48-20.11-.93-22.07-1.58-2.59-.87-3.86-2.96-3.86-5.28 0-2.55 2.08-4.98 5.35-6.65 2.86.516 5.87.768 8.99.768 18.97 0 33.76-9.223 33.76-29.425 0-4.897-.87-9.15-2.46-12.78 2.79-1.506 8.34-2.25 8.34-2.25 1.09-.17 1.975-1.21 1.974-2.31V40.3c0-1.88-1.59-2.955-3.1-2.78zm-49.13 85.132s9.954.38 19.9.84c11.172.52 14.654 2.96 14.654 8.81 0 7.15-9.71 14.1-23.28 14.1-12.88 0-19.314-4.54-19.314-12.08 0-4.33 2.26-9.18 8.04-11.69zm10.66-40.54c-8.978 0-15.983-4.83-15.983-15.35 0-10.53 7.01-15.35 15.983-15.35 8.974 0 15.984 4.81 15.984 15.34 0 10.53-7.002 15.34-15.984 15.34z" fill="#2D3134"/><g opacity=".6" transform="translate(0 36)" fill="#2E3134"><rect x=".209" y="69.017" width="33.643" height="17.014" rx="4"/><rect x="50.672" y="69.017" width="33.622" height="17.014" rx="4"/><rect x=".184" y="34.99" width="84.121" height="17.014" rx="4"/><rect x=".209" y=".964" width="50.469" height="17.013" rx="4"/><rect x="67.494" y=".964" width="16.821" height="17.013" rx="4"/></g></g></svg>
|
|
||||||
|
Before Width: | Height: | Size: 3.3 KiB |
@ -1 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13 14.5s2 3 5 3 5.5-2.463 5.5-5.5S21 6.5 18 6.5c-5 0-7 11-12 11C2.962 17.5.5 15.037.5 12S3 6.5 6 6.5s4.5 3.5 4.5 3.5"/></svg>
|
|
||||||
|
Before Width: | Height: | Size: 196 B |
@ -1 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" fill="none"><path d="M19.5 8c0 4.144-7.5 15.5-7.5 15.5S4.5 12.144 4.5 8C4.5 3.858 7.857.5 12 .5c4.142 0 7.5 3.358 7.5 7.5z"/><circle cx="12" cy="8" r="3"/></svg>
|
|
||||||
|
Before Width: | Height: | Size: 329 B |
@ -1,3 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
|
||||||
<path d="M7.5 15.5V4a1.5 1.5 0 1 1 3 0v4.5h2a1 1 0 0 1 1 1h2a1 1 0 0 1 1 1H18a1.5 1.5 0 0 1 1.5 1.5v3.099c0 .929-.13 1.854-.385 2.748L17.5 23.5h-9c-1.5-2-5.417-8.673-5.417-8.673a1.2 1.2 0 0 1 1.76-1.605L7.5 15.5zm6-6v2m-3-3.5v3.5m6-1v2"/>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 311 B |
@ -1 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="6.18" cy="17.82" r="2.18"/><path d="M4 4.44v2.83c7.03 0 12.73 5.7 12.73 12.73h2.83c0-8.59-6.97-15.56-15.56-15.56zm0 5.66v2.83c3.9 0 7.07 3.17 7.07 7.07h2.83c0-5.47-4.43-9.9-9.9-9.9z"/></svg>
|
|
||||||
|
Before Width: | Height: | Size: 263 B |
@ -1 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path d="M30.063 7.313c-.813 1.125-1.75 2.125-2.875 2.938v.75c0 1.563-.188 3.125-.688 4.625a15.088 15.088 0 0 1-2.063 4.438c-.875 1.438-2 2.688-3.25 3.813a15.015 15.015 0 0 1-4.625 2.563c-1.813.688-3.75 1-5.75 1-3.25 0-6.188-.875-8.875-2.625.438.063.875.125 1.375.125 2.688 0 5.063-.875 7.188-2.5-1.25 0-2.375-.375-3.375-1.125s-1.688-1.688-2.063-2.875c.438.063.813.125 1.125.125.5 0 1-.063 1.5-.25-1.313-.25-2.438-.938-3.313-1.938a5.673 5.673 0 0 1-1.313-3.688v-.063c.813.438 1.688.688 2.625.688a5.228 5.228 0 0 1-1.875-2c-.5-.875-.688-1.813-.688-2.75 0-1.063.25-2.063.75-2.938 1.438 1.75 3.188 3.188 5.25 4.25s4.313 1.688 6.688 1.813a5.579 5.579 0 0 1 1.5-5.438c1.125-1.125 2.5-1.688 4.125-1.688s3.063.625 4.188 1.813a11.48 11.48 0 0 0 3.688-1.375c-.438 1.375-1.313 2.438-2.563 3.188 1.125-.125 2.188-.438 3.313-.875z"/></svg>
|
|
||||||
|
Before Width: | Height: | Size: 888 B |
@ -1 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M23.5 11.957c0 6.375-5.163 11.544-11.532 11.544C5.599 23.5.5 18.125.5 11.75.5 5.542 5.37.758 11.505.511l.5-.011C18.374.5 23.5 5.582 23.5 11.957zM11.505.511c-6 6.5-6 14.98 0 22.98m1-22.98c6 6.5 6 14.977 0 22.977M2 17.479h20.063m-19.657-12h19.062m-20.968 6h22.938" stroke="#000" stroke-linejoin="round" stroke-miterlimit="10" fill="none"/></svg>
|
|
||||||
|
Before Width: | Height: | Size: 413 B |
@ -1,42 +0,0 @@
|
|||||||
<article class="post-card {{post_class}}{{#unless feature_image}} no-image{{/unless}}">
|
|
||||||
{{#if feature_image}}
|
|
||||||
<a class="post-card-image-link" href="{{url}}">
|
|
||||||
<div class="post-card-image" style="background-image: url({{feature_image}})"></div>
|
|
||||||
</a>
|
|
||||||
{{/if}}
|
|
||||||
<div class="post-card-content">
|
|
||||||
<a class="post-card-content-link" href="{{url}}">
|
|
||||||
<header class="post-card-header">
|
|
||||||
{{#if primary_tag}}
|
|
||||||
<span class="post-card-tags">{{primary_tag.name}}</span>
|
|
||||||
{{/if}}
|
|
||||||
<h2 class="post-card-title">{{title}}</h2>
|
|
||||||
</header>
|
|
||||||
<section class="post-card-excerpt">
|
|
||||||
<p>{{excerpt words="33"}}</p>
|
|
||||||
</section>
|
|
||||||
</a>
|
|
||||||
<footer class="post-card-meta">
|
|
||||||
|
|
||||||
<ul class="author-list">
|
|
||||||
{{#foreach authors}}
|
|
||||||
<li class="author-list-item">
|
|
||||||
|
|
||||||
<div class="author-name-tooltip">
|
|
||||||
{{name}}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{{#if profile_image}}
|
|
||||||
<a href="{{url}}" class="static-avatar"><img class="author-profile-image" src="{{profile_image}}" alt="{{name}}" /></a>
|
|
||||||
{{else}}
|
|
||||||
<a href="{{url}}" class="static-avatar author-profile-image">{{> "icons/avatar"}}</a>
|
|
||||||
{{/if}}
|
|
||||||
</li>
|
|
||||||
{{/foreach}}
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<span class="reading-time">{{reading_time}}</span>
|
|
||||||
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</article>
|
|
||||||
@ -1,29 +0,0 @@
|
|||||||
<nav class="site-nav">
|
|
||||||
<div class="site-nav-left">
|
|
||||||
{{^is "home"}}
|
|
||||||
{{#if @blog.logo}}
|
|
||||||
<a class="site-nav-logo" href="{{@blog.url}}"><img src="{{@blog.logo}}" alt="{{@blog.title}}" /></a>
|
|
||||||
{{else}}
|
|
||||||
<a class="site-nav-logo" href="{{@blog.url}}">{{@blog.title}}</a>
|
|
||||||
{{/if}}
|
|
||||||
{{/is}}
|
|
||||||
{{#if @blog.navigation}}
|
|
||||||
{{navigation}}
|
|
||||||
{{/if}}
|
|
||||||
</div>
|
|
||||||
<div class="site-nav-right">
|
|
||||||
<div class="social-links">
|
|
||||||
{{#if @blog.facebook}}
|
|
||||||
<a class="social-link social-link-fb" href="{{facebook_url @blog.facebook}}" target="_blank" rel="noopener">{{> "icons/facebook"}}</a>
|
|
||||||
{{/if}}
|
|
||||||
{{#if @blog.twitter}}
|
|
||||||
<a class="social-link social-link-tw" href="{{twitter_url @blog.twitter}}" target="_blank" rel="noopener">{{> "icons/twitter"}}</a>
|
|
||||||
{{/if}}
|
|
||||||
</div>
|
|
||||||
{{#if @labs.subscribers}}
|
|
||||||
<a class="subscribe-button" href="#subscribe">Subscribe</a>
|
|
||||||
{{else}}
|
|
||||||
<a class="rss-button" href="https://feedly.com/i/subscription/feed/{{@blog.url}}/rss/" target="_blank" rel="noopener">{{> "icons/rss"}}</a>
|
|
||||||
{{/if}}
|
|
||||||
</div>
|
|
||||||
</nav>
|
|
||||||
245
post.hbs
245
post.hbs
@ -1,198 +1,71 @@
|
|||||||
{{!< default}}
|
{{!< default}}
|
||||||
|
|
||||||
{{!-- The tag above means: insert everything in this file
|
{{! The comment above "< default" means - insert everything in this file into
|
||||||
into the {body} of the default.hbs template --}}
|
the {body} of the default.hbs template, which contains our header/footer. }}
|
||||||
|
|
||||||
<header class="site-header outer">
|
<main class="content" role="main">
|
||||||
<div class="inner">
|
|
||||||
{{> "site-nav"}}
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
{{!-- Everything inside the #post tags pulls data from the post --}}
|
<article class="{{post_class}}">
|
||||||
{{#post}}
|
|
||||||
|
|
||||||
<main id="site-main" class="site-main outer">
|
{{! Each post has the blog logo at the top, with a link back to the home page }}
|
||||||
<div class="inner">
|
<header class="post-header">
|
||||||
|
<a class="blog-logo" href="{{@blog.url}}">
|
||||||
<article class="post-full {{post_class}} {{#unless feature_image}}no-image{{/unless}}">
|
{{#if @blog.logo}}
|
||||||
|
<img src="{{@blog.logo}}" alt="Blog Logo" />
|
||||||
<header class="post-full-header">
|
|
||||||
<section class="post-full-meta">
|
|
||||||
<time class="post-full-meta-date" datetime="{{date format="YYYY-MM-DD"}}">{{date format="D MMMM YYYY"}}</time>
|
|
||||||
{{#primary_tag}}
|
|
||||||
<span class="date-divider">/</span> <a href="{{url}}">{{name}}</a>
|
|
||||||
{{/primary_tag}}
|
|
||||||
</section>
|
|
||||||
<h1 class="post-full-title">{{title}}</h1>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
{{#if feature_image}}
|
|
||||||
<figure class="post-full-image" style="background-image: url({{feature_image}})">
|
|
||||||
</figure>
|
|
||||||
{{/if}}
|
|
||||||
|
|
||||||
<section class="post-full-content">
|
|
||||||
<div class="post-content">
|
|
||||||
{{content}}
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
{{!-- Email subscribe form at the bottom of the page --}}
|
|
||||||
{{#if @labs.subscribers}}
|
|
||||||
<section class="subscribe-form">
|
|
||||||
<h3 class="subscribe-form-title">Subscribe to {{@blog.title}}</h3>
|
|
||||||
<p>Get the latest posts delivered right to your inbox</p>
|
|
||||||
{{subscribe_form placeholder="youremail@example.com"}}
|
|
||||||
</section>
|
|
||||||
{{/if}}
|
|
||||||
|
|
||||||
<footer class="post-full-footer">
|
|
||||||
|
|
||||||
{{!-- There are two options for how we display the byline/author-info.
|
|
||||||
If the post has more than one author, we load a specific template
|
|
||||||
from includes/byline-multiple.hbs, otherwise, we just use the
|
|
||||||
default byline. --}}
|
|
||||||
|
|
||||||
{{#has author="count:>1"}}
|
|
||||||
{{> "byline-multiple"}}
|
|
||||||
{{else}}
|
{{else}}
|
||||||
{{> "byline-single"}}
|
<span class="blog-title">{{@blog.title}}</span>
|
||||||
{{/has}}
|
{{/if}}
|
||||||
|
</a>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
{{! Everything inside the #post tags pulls data from the post }}
|
||||||
|
{{#post}}
|
||||||
|
|
||||||
|
<span class="post-meta">{{author}}, <time datetime="{{date format="YYYY-MM-DD"}}">{{date format='DD MMM YYYY'}}</time> {{tags prefix="on " separator=" | "}}</span>
|
||||||
|
|
||||||
|
<h1 class="post-title">{{{title}}}</h1>
|
||||||
|
|
||||||
|
<section class="post-content">
|
||||||
|
{{content}}
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<footer class="post-footer">
|
||||||
|
|
||||||
|
{{#author}}
|
||||||
|
<section class="author">
|
||||||
|
<h4><a href="{{url}}">{{name}}</a></h4>
|
||||||
|
{{#if bio}}
|
||||||
|
<p>{{bio}}</p>
|
||||||
|
{{else}}
|
||||||
|
<p>Read <a href="{{url}}">more posts</a> by this author.</p>
|
||||||
|
{{/if}}
|
||||||
|
<div class="author-meta">
|
||||||
|
{{#if location}}<span class="author-location icon-location">{{location}}</span>{{/if}}
|
||||||
|
{{#if website}}<span class="author-link icon-link"><a href="{{website}}">{{website}}</a></span>{{/if}}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
{{/author}}
|
||||||
|
|
||||||
|
<section class="share">
|
||||||
|
<h4>Share this post</h4>
|
||||||
|
<a class="icon-twitter" href="https://twitter.com/share?text={{encode title}}&url={{url absolute="true"}}"
|
||||||
|
onclick="window.open(this.href, 'twitter-share', 'width=550,height=235');return false;">
|
||||||
|
<span class="hidden">Twitter</span>
|
||||||
|
</a>
|
||||||
|
<a class="icon-facebook" href="https://www.facebook.com/sharer/sharer.php?u={{url absolute="true"}}"
|
||||||
|
onclick="window.open(this.href, 'facebook-share','width=580,height=296');return false;">
|
||||||
|
<span class="hidden">Facebook</span>
|
||||||
|
</a>
|
||||||
|
<a class="icon-google-plus" href="https://plus.google.com/share?url={{url absolute="true"}}"
|
||||||
|
onclick="window.open(this.href, 'google-plus-share', 'width=490,height=530');return false;">
|
||||||
|
<span class="hidden">Google+</span>
|
||||||
|
</a>
|
||||||
|
</section>
|
||||||
|
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
{{!--
|
{{/post}}
|
||||||
<section class="post-full-comments">
|
|
||||||
If you want to embed comments, this is a good place to do it!
|
|
||||||
</section>
|
|
||||||
--}}
|
|
||||||
|
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
</div>
|
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
{{!-- Links to Previous/Next posts --}}
|
|
||||||
<aside class="read-next outer">
|
|
||||||
<div class="inner">
|
|
||||||
<div class="read-next-feed">
|
|
||||||
{{#if primary_tag}}
|
|
||||||
{{#get "posts" filter="tags:{{primary_tag.slug}}+id:-{{id}}" limit="3" as |related_posts|}}
|
|
||||||
{{#if related_posts}}
|
|
||||||
<article class="read-next-card"
|
|
||||||
{{#if ../primary_tag.feature_image}}
|
|
||||||
style="background-image: url({{../primary_tag.feature_image}})"
|
|
||||||
{{else}}
|
|
||||||
{{#if @blog.cover_image}}
|
|
||||||
style="background-image: url({{@blog.cover_image}})"{{/if}}
|
|
||||||
{{/if}}
|
|
||||||
>
|
|
||||||
<header class="read-next-card-header">
|
|
||||||
<small class="read-next-card-header-sitetitle">— {{@blog.title}} —</small>
|
|
||||||
{{#../primary_tag}}
|
|
||||||
<h3 class="read-next-card-header-title"><a href="{{url}}">{{name}}</a></h3>
|
|
||||||
{{/../primary_tag}}
|
|
||||||
</header>
|
|
||||||
<div class="read-next-divider">{{> "icons/infinity"}}</div>
|
|
||||||
<div class="read-next-card-content">
|
|
||||||
<ul>
|
|
||||||
{{#foreach related_posts}}
|
|
||||||
<li><a href="{{url}}">{{title}}</a></li>
|
|
||||||
{{/foreach}}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<footer class="read-next-card-footer">
|
|
||||||
<a href="{{#../primary_tag}}{{url}}{{/../primary_tag}}">{{plural meta.pagination.total empty='No posts' singular='% post' plural='See all % posts'}} →</a>
|
|
||||||
</footer>
|
|
||||||
</article>
|
|
||||||
{{/if}}
|
|
||||||
{{/get}}
|
|
||||||
{{/if}}
|
|
||||||
|
|
||||||
{{!-- If there's a next post, display it using the same markup included from - partials/post-card.hbs --}}
|
|
||||||
{{#next_post}}
|
|
||||||
{{> "post-card"}}
|
|
||||||
{{/next_post}}
|
|
||||||
|
|
||||||
{{!-- If there's a previous post, display it using the same markup included from - partials/post-card.hbs --}}
|
|
||||||
{{#prev_post}}
|
|
||||||
{{> "post-card"}}
|
|
||||||
{{/prev_post}}
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</aside>
|
|
||||||
|
|
||||||
{{!-- Floating header which appears on-scroll, included from includes/floating-header.hbs --}}
|
|
||||||
{{> floating-header}}
|
|
||||||
|
|
||||||
{{/post}}
|
|
||||||
|
|
||||||
{{!-- The #contentFor helper here will send everything inside it up to the matching #block helper found in default.hbs --}}
|
|
||||||
{{#contentFor "scripts"}}
|
|
||||||
<script>
|
|
||||||
|
|
||||||
// NOTE: Scroll performance is poor in Safari
|
|
||||||
// - this appears to be due to the events firing much more slowly in Safari.
|
|
||||||
// Dropping the scroll event and using only a raf loop results in smoother
|
|
||||||
// scrolling but continuous processing even when not scrolling
|
|
||||||
$(document).ready(function () {
|
|
||||||
// Start fitVids
|
|
||||||
var $postContent = $(".post-full-content");
|
|
||||||
$postContent.fitVids();
|
|
||||||
// End fitVids
|
|
||||||
|
|
||||||
var progressBar = document.querySelector('#reading-progress');
|
|
||||||
var header = document.querySelector('.floating-header');
|
|
||||||
var title = document.querySelector('.post-full-title');
|
|
||||||
|
|
||||||
var lastScrollY = window.scrollY;
|
|
||||||
var lastWindowHeight = window.innerHeight;
|
|
||||||
var lastDocumentHeight = $(document).height();
|
|
||||||
var ticking = false;
|
|
||||||
|
|
||||||
function onScroll() {
|
|
||||||
lastScrollY = window.scrollY;
|
|
||||||
requestTick();
|
|
||||||
}
|
|
||||||
|
|
||||||
function onResize() {
|
|
||||||
lastWindowHeight = window.innerHeight;
|
|
||||||
lastDocumentHeight = $(document).height();
|
|
||||||
requestTick();
|
|
||||||
}
|
|
||||||
|
|
||||||
function requestTick() {
|
|
||||||
if (!ticking) {
|
|
||||||
requestAnimationFrame(update);
|
|
||||||
}
|
|
||||||
ticking = true;
|
|
||||||
}
|
|
||||||
|
|
||||||
function update() {
|
|
||||||
var trigger = title.getBoundingClientRect().top + window.scrollY;
|
|
||||||
var triggerOffset = title.offsetHeight + 35;
|
|
||||||
var progressMax = lastDocumentHeight - lastWindowHeight;
|
|
||||||
|
|
||||||
// show/hide floating header
|
|
||||||
if (lastScrollY >= trigger + triggerOffset) {
|
|
||||||
header.classList.add('floating-active');
|
|
||||||
} else {
|
|
||||||
header.classList.remove('floating-active');
|
|
||||||
}
|
|
||||||
|
|
||||||
progressBar.setAttribute('max', progressMax);
|
|
||||||
progressBar.setAttribute('value', lastScrollY);
|
|
||||||
|
|
||||||
ticking = false;
|
|
||||||
}
|
|
||||||
|
|
||||||
window.addEventListener('scroll', onScroll, {passive: true});
|
|
||||||
window.addEventListener('resize', onResize, false);
|
|
||||||
|
|
||||||
update();
|
|
||||||
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
{{/contentFor}}
|
|
||||||
|
|||||||
64
tag.hbs
64
tag.hbs
@ -1,33 +1,43 @@
|
|||||||
{{!< default}}
|
{{!< default}}
|
||||||
{{!-- The tag above means - insert everything in this file into the {body} of the default.hbs template --}}
|
|
||||||
|
|
||||||
{{!-- The big featured header, it uses blog cover image as a BG if available --}}
|
{{! The comment above "< default" means - insert everything in this file into
|
||||||
{{#tag}}
|
the {body} of the default.hbs template, which contains our header/footer. }}
|
||||||
<header class="site-header outer {{#if feature_image}}" style="background-image: url({{feature_image}}){{else}}no-cover{{/if}}">
|
|
||||||
<div class="inner">
|
{{! The big featured header on the homepage, with the site logo and description }}
|
||||||
{{> "site-nav"}}
|
<header class="site-head" {{#if @blog.cover}}style="background-image: url({{@blog.cover}})"{{/if}}>
|
||||||
<div class="site-header-content">
|
<div class="vertical">
|
||||||
<h1 class="site-title">{{name}}</h1>
|
<div class="site-head-content inner">
|
||||||
<h2 class="site-description">
|
{{#if @blog.logo}}<a class="blog-logo" href="{{@blog.url}}"><img src="{{@blog.logo}}" alt="Blog Logo" /></a>{{/if}}
|
||||||
{{#if description}}
|
<h1 class="blog-title">{{@blog.title}}</h1>
|
||||||
{{description}}
|
<h2 class="blog-description">{{@blog.description}}</h2>
|
||||||
{{else}}
|
|
||||||
A collection of {{plural ../pagination.total empty='posts' singular='% post' plural='% posts'}}
|
|
||||||
{{/if}}
|
|
||||||
</h2>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
{{/tag}}
|
|
||||||
|
|
||||||
{{!-- The main content area --}}
|
{{! The main content area on the homepage }}
|
||||||
<main id="site-main" class="site-main outer">
|
<main class="content" role="main">
|
||||||
<div class="inner">
|
|
||||||
<div class="post-feed">
|
<header class="tag-archive-header">
|
||||||
{{#foreach posts}}
|
<h1>{{tag.name}}</h1>
|
||||||
{{!-- The tag below includes the markup for each post - partials/post-card.hbs --}}
|
</header>
|
||||||
{{> "post-card"}}
|
|
||||||
{{/foreach}}
|
{{! Each post will be output using this markup }}
|
||||||
</div>
|
{{#foreach posts}}
|
||||||
</div>
|
|
||||||
</main>
|
<article class="{{post_class}}">
|
||||||
|
<header class="post-header">
|
||||||
|
<span class="post-meta"><time datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMM YYYY"}}</time> {{tags prefix="on "}}</span>
|
||||||
|
<h2 class="post-title"><a href="{{url}}">{{{title}}}</a></h2>
|
||||||
|
|
||||||
|
</header>
|
||||||
|
<section class="post-excerpt">
|
||||||
|
<p>{{excerpt}}…</p>
|
||||||
|
</section>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
{{/foreach}}
|
||||||
|
|
||||||
|
{{!! After all the posts, we have the previous/next pagination links }}
|
||||||
|
{{pagination}}
|
||||||
|
|
||||||
|
</main>
|
||||||
Reference in New Issue
Block a user