mirror of
https://github.com/GenZmeY/casper-i18n.git
synced 2025-07-12 16:56:06 +00:00
Compare commits
63 Commits
2.0.0-beta
...
2.1.5
| Author | SHA1 | Date | |
|---|---|---|---|
| 73bd9c630e | |||
| 9597a28320 | |||
| 461639886e | |||
| 7592ad182b | |||
| 97a522a037 | |||
| 25f12d760b | |||
| 4f78d99112 | |||
| f5b7b45f2e | |||
| d34ff1d32b | |||
| 73a1ab52da | |||
| 5ec77dfb31 | |||
| 269d2b5787 | |||
| d1d0bca2d8 | |||
| d92dda3523 | |||
| ca325285bf | |||
| aee9f69bb0 | |||
| a7d5c885bd | |||
| 9bc5c92628 | |||
| 0f3651c23f | |||
| d739bb52a4 | |||
| 8d17e9a452 | |||
| e4e6bb9c5a | |||
| d2375a3917 | |||
| 577b92811c | |||
| 2f385ba5f1 | |||
| b024b544e4 | |||
| 9caeb2a2e7 | |||
| 12d139aa7d | |||
| 690e1bad1f | |||
| c63804006d | |||
| 65d0104224 | |||
| ba10cb1516 | |||
| d7ca6fd2f6 | |||
| 10f11bb14f | |||
| 7d4f93bf23 | |||
| 11f61782ad | |||
| fd108b1b40 | |||
| 33005666ca | |||
| 1767ca59b8 | |||
| 5cafa756ef | |||
| 08e5cbe021 | |||
| 615d8a9001 | |||
| f08f07fd7e | |||
| 2565c16916 | |||
| 4b66223bb3 | |||
| 35e91ecee9 | |||
| 2b2d6e6d14 | |||
| cd4e0e03f5 | |||
| 3993cbdcfa | |||
| 6c5d6af6d0 | |||
| 9aa6ff1716 | |||
| 551aeb3ca5 | |||
| 8690450eae | |||
| 2fdfc5285d | |||
| 0f9410fb3d | |||
| d3a9af0666 | |||
| 96ffcdceed | |||
| aa80667232 | |||
| 0914d43a86 | |||
| d6d9711b9d | |||
| 2ca409032a | |||
| 902b6dcdbc | |||
| 6f441794e4 |
17
.editorconfig
Normal file
17
.editorconfig
Normal file
@ -0,0 +1,17 @@
|
||||
# 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
Normal file
19
.github/ISSUE_TEMPLATE.md
vendored
Normal file
@ -0,0 +1,19 @@
|
||||
Do you need help or have a question? Please come chat in Slack: https://ghost.org/slack 👫.
|
||||
|
||||
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,9 +13,12 @@ results
|
||||
|
||||
npm-debug.log
|
||||
node_modules
|
||||
package-lock.json
|
||||
|
||||
.idea/*
|
||||
*.iml
|
||||
projectFilesBackup
|
||||
|
||||
.DS_Store
|
||||
.DS_Store
|
||||
|
||||
dist/
|
||||
|
||||
12
README.md
12
README.md
@ -34,12 +34,18 @@ One really neat trick is that you can also create custom one-off templates just
|
||||
|
||||
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:
|
||||
|
||||
`$ npm install`
|
||||
```bash
|
||||
$ npm install
|
||||
$ gulp
|
||||
```
|
||||
|
||||
`$ gulp`
|
||||
Now you can edit `/assets/css/` files, which will be compiled to `/assets/built/` automatically.
|
||||
|
||||
Now you can edit `/assets/css/` files, which will be compiled to `/assets/public/` automatically.
|
||||
The `zip` Gulp task packages the theme files into `dist/<theme-name>.zip`, which you can then upload to your site.
|
||||
|
||||
```bash
|
||||
$ gulp zip
|
||||
```
|
||||
|
||||
# PostCSS Features Used
|
||||
|
||||
|
||||
@ -1,2 +1,2 @@
|
||||
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:1em;padding-right:1.5em}ol ol,ol ul,ul ol,ul ul{margin:.5em 0 1em}ul{list-style:disc}ol{list-style:decimal}li{margin:.5em 0;padding-left:.5em;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}
|
||||
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}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
240
assets/css/csscomb.json
Normal file
240
assets/css/csscomb.json
Normal file
@ -0,0 +1,240 @@
|
||||
{
|
||||
"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"
|
||||
] ]
|
||||
}
|
||||
@ -341,7 +341,7 @@ blockquote {
|
||||
|
||||
ol,
|
||||
ul {
|
||||
padding-left: 1em;
|
||||
padding-left: 1.3em;
|
||||
padding-right: 1.5em;
|
||||
}
|
||||
|
||||
@ -362,7 +362,7 @@ ol {
|
||||
|
||||
li {
|
||||
margin: 0.5em 0;
|
||||
padding-left: 0.5em;
|
||||
padding-left: 0.3em;
|
||||
line-height: 1.6em;
|
||||
}
|
||||
|
||||
|
||||
@ -36,8 +36,8 @@ body {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-position: center center;
|
||||
background-size: cover;
|
||||
background-position: center center;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
@ -51,6 +51,17 @@ body {
|
||||
/* 2. Layout - Page building blocks
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
.site-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.site-main {
|
||||
z-index: 100;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
/* Full width page blocks */
|
||||
.outer {
|
||||
position: relative;
|
||||
@ -59,9 +70,9 @@ body {
|
||||
|
||||
/* Centered content container blocks */
|
||||
.inner {
|
||||
margin: 0 auto;
|
||||
max-width: 1040px;
|
||||
width: 100%;
|
||||
max-width: 1040px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
/* Usage:
|
||||
@ -81,12 +92,12 @@ body {
|
||||
.home-template .post-feed,
|
||||
.tag-template .post-feed,
|
||||
.author-template .post-feed {
|
||||
margin-top: -110px;
|
||||
margin-top: -70px;
|
||||
padding-top: 0;
|
||||
}
|
||||
.home-template .site-nav {
|
||||
position: relative;
|
||||
top: -70px;
|
||||
z-index: 300;
|
||||
}
|
||||
}
|
||||
|
||||
@ -134,19 +145,18 @@ body {
|
||||
}
|
||||
|
||||
.site-header-content {
|
||||
position: relative;
|
||||
z-index: 100;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 10vw 4vw;
|
||||
min-height: 200px;
|
||||
max-height: 450px;
|
||||
padding: 10vw 4vw;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.site-title {
|
||||
z-index: 10;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 3.8rem;
|
||||
@ -158,6 +168,7 @@ body {
|
||||
}
|
||||
|
||||
.site-description {
|
||||
z-index: 10;
|
||||
margin: 0;
|
||||
padding: 5px 0;
|
||||
font-size: 2.2rem;
|
||||
@ -181,12 +192,12 @@ body {
|
||||
|
||||
.site-nav {
|
||||
position: relative;
|
||||
z-index: 100;
|
||||
z-index: 300;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
overflow-y: hidden;
|
||||
height: 40px;
|
||||
overflow-y: hidden;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
@ -199,7 +210,6 @@ body {
|
||||
padding-bottom: 80px;
|
||||
letter-spacing: 0.4px;
|
||||
white-space: nowrap;
|
||||
|
||||
-webkit-overflow-scrolling: touch;
|
||||
-ms-overflow-scrolling: touch;
|
||||
}
|
||||
@ -216,6 +226,7 @@ The knock-on effect of this is ugly browser-scroll bars at the bottom, so 80px o
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
margin-right: 24px;
|
||||
padding: 11px 0;
|
||||
color: #fff;
|
||||
font-size: 1.7rem;
|
||||
line-height: 1em;
|
||||
@ -337,19 +348,19 @@ The knock-on effect of this is ugly browser-scroll bars at the bottom, so 80px o
|
||||
}
|
||||
|
||||
.rss-button svg {
|
||||
margin-bottom: 1px;
|
||||
height: 2.1rem;
|
||||
margin-bottom: 1px;
|
||||
fill: #fff;
|
||||
}
|
||||
|
||||
@media (max-width: 700px) {
|
||||
.site-header {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
.site-nav-left {
|
||||
padding-left: 4vw;
|
||||
margin-right: 0;
|
||||
padding-left: 4vw;
|
||||
}
|
||||
.site-nav-right {
|
||||
display: none;
|
||||
@ -362,7 +373,6 @@ The knock-on effect of this is ugly browser-scroll bars at the bottom, so 80px o
|
||||
|
||||
.post-feed {
|
||||
position: relative;
|
||||
z-index: 200;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin: 0 -20px;
|
||||
@ -373,9 +383,9 @@ The knock-on effect of this is ugly browser-scroll bars at the bottom, so 80px o
|
||||
flex: 1 1 300px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 300px;
|
||||
overflow: hidden;
|
||||
margin: 0 20px 40px;
|
||||
min-height: 300px;
|
||||
background: #fff center center;
|
||||
background-size: cover;
|
||||
border-radius: 5px;
|
||||
@ -391,6 +401,9 @@ The knock-on effect of this is ugly browser-scroll bars at the bottom, so 80px o
|
||||
|
||||
.post-card-image-link {
|
||||
position: relative;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
border-radius: 5px 5px 0 0;
|
||||
}
|
||||
|
||||
.post-card-image {
|
||||
@ -442,10 +455,12 @@ The knock-on effect of this is ugly browser-scroll bars at the bottom, so 80px o
|
||||
}
|
||||
|
||||
.author-profile-image {
|
||||
margin-right: 5px;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
margin-right: 5px;
|
||||
border-radius: 100%;
|
||||
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.post-card-author {
|
||||
@ -470,6 +485,7 @@ The first (most recent) post in the list is styled to be bigger than the others
|
||||
.home-template .post-feed .post-card:nth-child(6n+1):not(.no-image) .post-card-image-link {
|
||||
position: relative;
|
||||
flex: 1 1 auto;
|
||||
border-radius: 5px 0 0 5px;
|
||||
}
|
||||
|
||||
.home-template .post-feed .post-card:nth-child(6n+1):not(.no-image) .post-card-image {
|
||||
@ -533,11 +549,16 @@ The first (most recent) post in the list is styled to be bigger than the others
|
||||
/* ^ Required to make .post-full-content:before/after z-index stacking work */
|
||||
|
||||
.post-full-header {
|
||||
max-width: 1040px;
|
||||
margin: 0 auto;
|
||||
padding: 6vw 3vw 3vw;
|
||||
max-width: 1040px;
|
||||
text-align: center;
|
||||
}
|
||||
@media (max-width: 500px) {
|
||||
.post-full-header {
|
||||
padding: 14vw 3vw 10vw;
|
||||
}
|
||||
}
|
||||
|
||||
.post-full-meta {
|
||||
display: flex;
|
||||
@ -564,8 +585,8 @@ The first (most recent) post in the list is styled to be bigger than the others
|
||||
}
|
||||
|
||||
.post-full-image {
|
||||
margin: 0 -10vw -165px;
|
||||
height: 800px;
|
||||
margin: 0 -10vw -165px;
|
||||
background: var(--lightgrey) center center;
|
||||
background-size: cover;
|
||||
border-radius: 5px;
|
||||
@ -573,8 +594,8 @@ The first (most recent) post in the list is styled to be bigger than the others
|
||||
|
||||
@media (max-width: 1170px) {
|
||||
.post-full-image {
|
||||
margin: 0 -4vw -100px;
|
||||
height: 600px;
|
||||
margin: 0 -4vw -100px;
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
@ -587,9 +608,9 @@ The first (most recent) post in the list is styled to be bigger than the others
|
||||
|
||||
.post-full-content {
|
||||
position: relative;
|
||||
min-height: 230px;
|
||||
margin: 0 auto;
|
||||
padding: 70px 100px 0;
|
||||
min-height: 230px;
|
||||
font-family: Georgia, serif;
|
||||
font-size: 2.2rem;
|
||||
line-height: 1.6em;
|
||||
@ -651,22 +672,31 @@ The first (most recent) post in the list is styled to be bigger than the others
|
||||
max-width: 920px;
|
||||
}
|
||||
|
||||
.post-full-content p,
|
||||
.post-full-content ul,
|
||||
.post-full-content ol,
|
||||
.post-full-content dl,
|
||||
.post-full-content pre,
|
||||
.post-full-content h1,
|
||||
.post-full-content h2,
|
||||
.post-full-content h3,
|
||||
.post-full-content h4,
|
||||
.post-full-content h5,
|
||||
.post-full-content h6,
|
||||
.post-full-content p,
|
||||
.post-full-content ul,
|
||||
.post-full-content ol,
|
||||
.post-full-content dl,
|
||||
.post-full-content pre,
|
||||
.post-full-content blockquote,
|
||||
.post-full-comments,
|
||||
.footnotes {
|
||||
min-width: 100%;
|
||||
}
|
||||
|
||||
.post-full-content li {
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.post-full-content li p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.post-template .kg-card-markdown > p:first-child {
|
||||
font-size: 1.25em;
|
||||
line-height: 1.5em;
|
||||
@ -687,47 +717,78 @@ The first (most recent) post in the list is styled to be bigger than the others
|
||||
color: color(var(--darkgrey) l(-5%));
|
||||
}
|
||||
|
||||
.post-full-content img {
|
||||
margin: 1.5em 0;
|
||||
max-width: 1040px;
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
/*
|
||||
If an image url has #full on the end, give it special wide styles.
|
||||
Super neat trick courtesy of @JoelDrapper
|
||||
*/
|
||||
.post-full-content img[src$="#full"] {
|
||||
max-width: 100vw;
|
||||
}
|
||||
|
||||
.post-full-content blockquote {
|
||||
margin: 0 0 1.5em 0;
|
||||
padding: 1.5em 0;
|
||||
border: 0;
|
||||
color: var(--blue);
|
||||
font-size: 3rem;
|
||||
.post-full-content small {
|
||||
display: inline-block;
|
||||
line-height: 1.6em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.post-full-content blockquote:before {
|
||||
content: open-quote;
|
||||
.post-full-content li:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.post-full-content blockquote p {
|
||||
margin: 0;
|
||||
.post-full-content img,
|
||||
.post-full-content video {
|
||||
display: block;
|
||||
max-width: 1040px;
|
||||
margin: 1.5em auto;
|
||||
}
|
||||
|
||||
@media (min-width: 1000px) {
|
||||
.post-full-content blockquote {
|
||||
max-width: 1060px;
|
||||
width: 100vw;
|
||||
@media (max-width: 1040px) {
|
||||
.post-full-content img,
|
||||
.post-full-content video {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.post-full-content blockquote + blockquote {
|
||||
padding-top: 0;
|
||||
|
||||
/* Full bleed images (#full)
|
||||
Super neat trick courtesy of @JoelDrapper
|
||||
|
||||
Usage (In Ghost edtior):
|
||||
|
||||
|
||||
|
||||
*/
|
||||
.post-full-content img[src$="#full"] {
|
||||
width: 100vw;
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
|
||||
/* Image captions
|
||||
|
||||
Usage (In Ghost editor):
|
||||
|
||||
|
||||
<small>Your image caption</small>
|
||||
|
||||
*/
|
||||
.post-full-content img + br + small {
|
||||
display: block;
|
||||
margin-top: -3em;
|
||||
margin-bottom: 1.5em;
|
||||
}
|
||||
|
||||
|
||||
.post-full-content iframe {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.post-full-content blockquote {
|
||||
margin: 0 0 1.5em;
|
||||
padding: 0 1.5em;
|
||||
border-left: #3eb0ef 3px solid;
|
||||
}
|
||||
|
||||
.post-full-content blockquote p {
|
||||
margin: 0 0 1em 0;
|
||||
color: inherit;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.post-full-content blockquote p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.post-full-content code {
|
||||
@ -740,10 +801,10 @@ Super neat trick courtesy of @JoelDrapper
|
||||
}
|
||||
|
||||
.post-full-content pre {
|
||||
max-width: 100%;
|
||||
overflow-x: auto;
|
||||
margin: 1.5em 0 3em;
|
||||
padding: 20px;
|
||||
max-width: 100%;
|
||||
border: color(var(--darkgrey) l(-10%)) 1px solid;
|
||||
color: var(--whitegrey);
|
||||
font-size: 1.4rem;
|
||||
@ -773,9 +834,9 @@ Super neat trick courtesy of @JoelDrapper
|
||||
top: -15px;
|
||||
left: 50%;
|
||||
display: block;
|
||||
margin-left: -10px;
|
||||
width: 1px;
|
||||
height: 30px;
|
||||
margin-left: -10px;
|
||||
background: color(var(--lightgrey) l(+10%));
|
||||
box-shadow: #fff 0 0 0 5px;
|
||||
transform: rotate(45deg);
|
||||
@ -792,27 +853,82 @@ Super neat trick courtesy of @JoelDrapper
|
||||
}
|
||||
|
||||
.post-full-content h1 {
|
||||
font-size: 5rem;
|
||||
margin: 0.5em 0 0.2em 0;
|
||||
font-size: 4.6rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
@media (max-width: 500px) {
|
||||
.post-full-content h1 {
|
||||
font-size: 2.8rem;
|
||||
}
|
||||
}
|
||||
|
||||
.post-full-content h2 {
|
||||
font-size: 3.5rem;
|
||||
margin: 0.5em 0 0.2em 0;
|
||||
font-size: 3.6rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
@media (max-width: 500px) {
|
||||
.post-full-content h2 {
|
||||
font-size: 2.6rem;
|
||||
}
|
||||
}
|
||||
|
||||
.post-full-content h3 {
|
||||
font-size: 2.5rem;
|
||||
margin: 0.5em 0 0.2em 0;
|
||||
font-size: 2.8rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
@media (max-width: 500px) {
|
||||
.post-full-content h3 {
|
||||
font-size: 2.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.post-full-content h4 {
|
||||
font-size: 1.6rem;
|
||||
margin: 0.5em 0 0.2em 0;
|
||||
font-size: 2.8rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
@media (max-width: 500px) {
|
||||
.post-full-content h4 {
|
||||
font-size: 2.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.post-full-content h5 {
|
||||
font-size: 1.4rem;
|
||||
display: block;
|
||||
margin: 0.5em 0;
|
||||
padding: 1em 0 1.5em;
|
||||
border: 0;
|
||||
color: var(--blue);
|
||||
font-family: Georgia,serif;
|
||||
font-size: 3.2rem;
|
||||
line-height: 1.35em;
|
||||
text-align: center;
|
||||
}
|
||||
@media (min-width: 1180px) {
|
||||
.post-full-content h5 {
|
||||
width: 100vw;
|
||||
max-width: 1060px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 500px) {
|
||||
.post-full-content h5 {
|
||||
padding: 0 0 0.5em;
|
||||
font-size: 2.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.post-full-content h6 {
|
||||
font-size: 1.4rem;
|
||||
margin: 0.5em 0 0.2em 0;
|
||||
font-size: 2.3rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
@media (max-width: 500px) {
|
||||
.post-full-content h6 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.footnotes-sep {
|
||||
@ -855,15 +971,58 @@ Super neat trick courtesy of @JoelDrapper
|
||||
.post-full-content:after {
|
||||
display: none;
|
||||
}
|
||||
.post-full-content h1 {
|
||||
font-size: 2.9rem;
|
||||
}
|
||||
.post-full-content h2 {
|
||||
font-size: 2.9rem;
|
||||
}
|
||||
.post-full-content h3 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Tables */
|
||||
.post-full-content table {
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
max-width: 100%;
|
||||
overflow-x: auto;
|
||||
margin: 0.5em 0 2.5em;
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
vertical-align: top;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
|
||||
font-size: 1.6rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.post-full-content table {
|
||||
background: radial-gradient(ellipse at left, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 75%) 0 center, radial-gradient(ellipse at right, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 75%) 100% center;
|
||||
background-size: 10px 100%, 10px 100%;
|
||||
background-attachment: scroll, scroll;
|
||||
background-repeat: no-repeat;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
.post-full-content table td:first-child {
|
||||
background-image: linear-gradient(to right, rgba(255,255,255, 1) 50%, rgba(255,255,255, 0) 100%);
|
||||
background-size: 20px 100%;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.post-full-content table td:last-child {
|
||||
background-image: linear-gradient(to left, rgba(255,255,255, 1) 50%, rgba(255,255,255, 0) 100%);
|
||||
background-size: 20px 100%;
|
||||
background-position: 100% 0;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.post-full-content table th {
|
||||
color: var(--darkgrey);
|
||||
font-size: 1.2rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.2px;
|
||||
text-align: left;
|
||||
text-transform: uppercase;
|
||||
background-color: color(var(--whitegrey) l(+4%));
|
||||
}
|
||||
|
||||
.post-full-content table th,
|
||||
.post-full-content table td {
|
||||
padding: 6px 12px;
|
||||
border: color(var(--whitegrey) l(-1%) s(-5%)) 1px solid;
|
||||
}
|
||||
|
||||
|
||||
@ -900,8 +1059,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 0 auto;
|
||||
max-width: 420px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.subscribe-form .form-group {
|
||||
@ -910,8 +1069,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
|
||||
.subscribe-email {
|
||||
display: block;
|
||||
padding: 10px;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
border: color(var(--lightgrey) l(+7%)) 1px solid;
|
||||
color: var(--midgrey);
|
||||
font-size: 1.8rem;
|
||||
@ -931,9 +1090,9 @@ Super neat trick courtesy of @JoelDrapper
|
||||
|
||||
.subscribe-form button {
|
||||
display: inline-block;
|
||||
height: 41px;
|
||||
margin: 0 0 0 10px;
|
||||
padding: 0 20px;
|
||||
height: 41px;
|
||||
outline: none;
|
||||
color: #fff;
|
||||
font-size: 1.5rem;
|
||||
@ -988,9 +1147,9 @@ Super neat trick courtesy of @JoelDrapper
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
max-width: 840px;
|
||||
margin: 0 auto;
|
||||
padding: 3vw 0 6vw 0;
|
||||
max-width: 840px;
|
||||
}
|
||||
|
||||
.author-card {
|
||||
@ -999,9 +1158,9 @@ Super neat trick courtesy of @JoelDrapper
|
||||
}
|
||||
|
||||
.author-card .author-profile-image {
|
||||
margin-right: 15px;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.author-card-name {
|
||||
@ -1053,8 +1212,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
.post-full-comments {
|
||||
margin: 0 auto;
|
||||
max-width: 840px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
|
||||
@ -1139,9 +1298,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
|
||||
.read-next-divider svg {
|
||||
width: 40px;
|
||||
fill: transparent;
|
||||
stroke: #fff;
|
||||
|
||||
fill: transparent;
|
||||
stroke-width: 0.5px;
|
||||
stroke-opacity: 0.65;
|
||||
}
|
||||
@ -1159,8 +1317,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
flex-direction: column;
|
||||
margin: 0 auto;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
list-style: none;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.read-next-card-content li {
|
||||
@ -1176,9 +1334,9 @@ Super neat trick courtesy of @JoelDrapper
|
||||
display: block;
|
||||
padding: 20px 0;
|
||||
border-bottom: rgba(255,255,255,0.3) 1px solid;
|
||||
vertical-align: top;
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
vertical-align: top;
|
||||
transition: opacity 0.3s ease;
|
||||
}
|
||||
|
||||
@ -1240,6 +1398,7 @@ Super neat trick courtesy of @JoelDrapper
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: var(--darkgrey);
|
||||
line-height: 1.1em;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@ -1248,8 +1407,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
}
|
||||
|
||||
.floating-header-logo img {
|
||||
margin: 0 10px 0 0;
|
||||
max-height: 20px;
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
|
||||
.floating-header-divider {
|
||||
@ -1263,7 +1422,7 @@ Super neat trick courtesy of @JoelDrapper
|
||||
margin: 0;
|
||||
color: #2e2e2e;
|
||||
font-size: 1.6rem;
|
||||
line-height: 1em;
|
||||
line-height: 1.3em;
|
||||
font-weight: bold;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
@ -1300,9 +1459,9 @@ Super neat trick courtesy of @JoelDrapper
|
||||
}
|
||||
|
||||
.floating-header-share-label svg {
|
||||
margin: 0 5px 0 10px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin: 0 5px 0 10px;
|
||||
stroke: rgba(0,0,0,0.7);
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
@ -1349,6 +1508,10 @@ Super neat trick courtesy of @JoelDrapper
|
||||
background-color: var(--blue);
|
||||
}
|
||||
|
||||
.progress::-moz-progress-bar {
|
||||
background-color: var(--blue);
|
||||
}
|
||||
|
||||
.progress-container {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
@ -1406,17 +1569,19 @@ Super neat trick courtesy of @JoelDrapper
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
.site-header-content .author-profile-image {
|
||||
z-index: 10;
|
||||
flex-shrink: 0;
|
||||
margin: 0 0 20px 0;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
margin: 0 0 20px 0;
|
||||
box-shadow: rgba(255,255,255,0.1) 0 0 0 6px;
|
||||
}
|
||||
|
||||
.site-header-content .author-bio {
|
||||
z-index: 10;
|
||||
flex-shrink: 0;
|
||||
margin: 5px 0 10px 0;
|
||||
max-width: 600px;
|
||||
margin: 5px 0 10px 0;
|
||||
font-size: 2rem;
|
||||
line-height: 1.3em;
|
||||
font-weight: 300;
|
||||
@ -1425,6 +1590,7 @@ Super neat trick courtesy of @JoelDrapper
|
||||
}
|
||||
|
||||
.site-header-content .author-meta {
|
||||
z-index: 10;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
@ -1567,8 +1733,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
}
|
||||
|
||||
.subscribe-overlay-description {
|
||||
margin: 0 auto 50px;
|
||||
max-width: 650px;
|
||||
margin: 0 auto 50px;
|
||||
font-family: Georgia, serif;
|
||||
font-size: 3rem;
|
||||
line-height: 1.3em;
|
||||
@ -1580,8 +1746,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 0 auto;
|
||||
max-width: 500px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.subscribe-overlay .form-group {
|
||||
@ -1590,8 +1756,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
|
||||
.subscribe-overlay .subscribe-email {
|
||||
display: block;
|
||||
padding: 14px 20px;
|
||||
width: 100%;
|
||||
padding: 14px 20px;
|
||||
border: none;
|
||||
color: var(--midgrey);
|
||||
font-size: 2rem;
|
||||
@ -1612,9 +1778,9 @@ Super neat trick courtesy of @JoelDrapper
|
||||
|
||||
.subscribe-overlay button {
|
||||
display: inline-block;
|
||||
height: 52px;
|
||||
margin: 0 0 0 15px;
|
||||
padding: 0 25px;
|
||||
height: 52px;
|
||||
outline: none;
|
||||
color: #fff;
|
||||
font-size: 1.7rem;
|
||||
|
||||
83
assets/js/infinitescroll.js
Normal file
83
assets/js/infinitescroll.js
Normal file
@ -0,0 +1,83 @@
|
||||
// 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 = 100;
|
||||
|
||||
var ticking = false;
|
||||
var isLoading = false;
|
||||
|
||||
var lastScrollY = window.scrollY;
|
||||
var lastWindowHeight = window.innerHeight;
|
||||
var lastDocumentHeight = $document.height();
|
||||
|
||||
// remove hash params from pathname
|
||||
pathname = pathname.replace(/#(.*)$/g, '').replace('/\//g', '/');
|
||||
|
||||
function onScroll() {
|
||||
lastScrollY = window.scrollY;
|
||||
requestTick();
|
||||
}
|
||||
|
||||
function onResize() {
|
||||
lastWindowHeight = window.innerHeight;
|
||||
lastDocumentHeight = $document.height();
|
||||
requestTick();
|
||||
}
|
||||
|
||||
function requestTick() {
|
||||
if (!ticking) {
|
||||
requestAnimationFrame(infiniteScroll)
|
||||
}
|
||||
ticking = true;
|
||||
}
|
||||
|
||||
function infiniteScroll () {
|
||||
// return if already loading
|
||||
if (isLoading) {
|
||||
return;
|
||||
}
|
||||
|
||||
// return if not scroll to the bottom
|
||||
if (lastScrollY + lastWindowHeight <= lastDocumentHeight - buffer) {
|
||||
ticking = false;
|
||||
return;
|
||||
}
|
||||
|
||||
// return if currentPage is the last page already
|
||||
if (currentPage === maxPages) {
|
||||
return;
|
||||
}
|
||||
|
||||
isLoading = true;
|
||||
|
||||
// next page
|
||||
currentPage++;
|
||||
|
||||
// Load more
|
||||
var nextPage = pathname + 'page/' + currentPage + '/';
|
||||
|
||||
$.get(nextPage, function (content) {
|
||||
$result.append($(content).find('.post').hide().fadeIn(100));
|
||||
|
||||
}).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,10 +1,12 @@
|
||||
/*jshint browser:true */
|
||||
/*!
|
||||
* FitVids 1.1
|
||||
* FitVids 1.3
|
||||
*
|
||||
* 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/
|
||||
* Released under the WTFPL license - http://sam.zoy.org/wtfpl/
|
||||
* Released under the MIT license
|
||||
*
|
||||
*/
|
||||
|
||||
@ -21,7 +23,7 @@
|
||||
if(!document.getElementById('fit-vids-style')) {
|
||||
// appendStyles: https://github.com/toddmotto/fluidvids/blob/master/dist/fluidvids.js
|
||||
var head = document.head || document.getElementsByTagName('head')[0];
|
||||
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 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 div = document.createElement("div");
|
||||
div.innerHTML = '<p>x</p><style id="fit-vids-style">' + css + '</style>';
|
||||
head.appendChild(div.childNodes[1]);
|
||||
@ -74,7 +76,7 @@
|
||||
$this.attr('name', videoName);
|
||||
$.fn.fitVids._count++;
|
||||
}
|
||||
$this.wrap('<div class="fluid-width-video-wrapper"></div>').parent('.fluid-width-video-wrapper').css('padding-top', (aspectRatio * 100)+'%');
|
||||
$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.removeAttr('height').removeAttr('width');
|
||||
});
|
||||
});
|
||||
|
||||
0
assets/screenshot-desktop.jpg
Executable file → Normal file
0
assets/screenshot-desktop.jpg
Executable file → Normal file
|
Before Width: | Height: | Size: 106 KiB After Width: | Height: | Size: 106 KiB |
0
assets/screenshot-mobile.jpg
Executable file → Normal file
0
assets/screenshot-mobile.jpg
Executable file → Normal file
|
Before Width: | Height: | Size: 102 KiB After Width: | Height: | Size: 102 KiB |
@ -22,15 +22,15 @@
|
||||
{{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">{{> "icons/website"}}</a>
|
||||
<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">{{> "icons/twitter"}}</a>
|
||||
<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">{{> "icons/facebook"}}</a>
|
||||
<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="http://cloud.feedly.com/#subscription/feed/{{url absolute="true"}}rss/" target="_blank">{{> "icons/rss"}}</a>
|
||||
<a class="social-link social-link-rss" href="http://cloud.feedly.com/#subscription/feed/{{url absolute="true"}}/rss/" target="_blank" rel="noopener">{{> "icons/rss"}}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
22
default.hbs
22
default.hbs
@ -14,7 +14,7 @@
|
||||
{{!-- Styles'n'Scripts --}}
|
||||
<link rel="stylesheet" type="text/css" href="{{asset "built/screen.css"}}" />
|
||||
|
||||
{{!-- This tag outputes SEO meta+structured data and other important settings --}}
|
||||
{{!-- This tag outputs SEO meta+structured data and other important settings --}}
|
||||
{{ghost_head}}
|
||||
|
||||
</head>
|
||||
@ -31,9 +31,9 @@
|
||||
<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">Facebook</a>{{/if}}
|
||||
{{#if @blog.twitter}}<a href="{{twitter_url @blog.twitter}}" target="_blank">Twitter</a>{{/if}}
|
||||
<a href="https://ghost.org" target="_blank">Ghost</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>
|
||||
@ -57,11 +57,19 @@
|
||||
|
||||
{{!-- jQuery + Fitvids, which makes all video embeds responsive --}}
|
||||
<script
|
||||
src="//code.jquery.com/jquery-3.2.1.slim.min.js"
|
||||
integrity="sha256-k2WSCIexGzOj3Euiig+TlR8gA0EmPjuc79OEeY5L45g="
|
||||
crossorigin="anonymous"></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>
|
||||
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"}}}
|
||||
|
||||
|
||||
56
error-404.hbs
Normal file
56
error-404.hbs
Normal file
@ -0,0 +1,56 @@
|
||||
{{!--
|
||||
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" role="main">
|
||||
<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>
|
||||
17
error.hbs
17
error.hbs
@ -1,5 +1,7 @@
|
||||
{{!--
|
||||
This error template is used for all 400/500 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. You'll notice that we *don't* use any JavsScript, or ghost_head / ghost_foot in this file.
|
||||
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>
|
||||
@ -56,19 +58,6 @@ This error template is used for all 400/500 errors which might occur on your sit
|
||||
|
||||
</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>
|
||||
|
||||
19
gulpfile.js
19
gulpfile.js
@ -6,6 +6,7 @@ var livereload = require('gulp-livereload');
|
||||
var nodemon = require('gulp-nodemon');
|
||||
var postcss = require('gulp-postcss');
|
||||
var sourcemaps = require('gulp-sourcemaps');
|
||||
var zip = require('gulp-zip');
|
||||
|
||||
// postcss plugins
|
||||
var autoprefixer = require('autoprefixer');
|
||||
@ -36,7 +37,8 @@ gulp.task('css', function () {
|
||||
autoprefixer({browsers: ['last 2 versions']}),
|
||||
cssnano()
|
||||
];
|
||||
gulp.src('assets/css/*.css')
|
||||
|
||||
return gulp.src('assets/css/*.css')
|
||||
.on('error', swallowError)
|
||||
.pipe(sourcemaps.init())
|
||||
.pipe(postcss(processors))
|
||||
@ -49,6 +51,21 @@ 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/**',
|
||||
'!assets/css', '!assets/css/**',
|
||||
])
|
||||
.pipe(zip(filename))
|
||||
.pipe(gulp.dest(targetDir));
|
||||
});
|
||||
|
||||
gulp.task('default', ['build'], function () {
|
||||
gulp.start('watch');
|
||||
});
|
||||
|
||||
@ -2,9 +2,9 @@
|
||||
"name": "casper",
|
||||
"description": "The default personal blogging theme for Ghost. Beautiful, minimal and responsive.",
|
||||
"demo": "https://demo.ghost.io",
|
||||
"version": "2.0.0",
|
||||
"version": "2.1.5",
|
||||
"engines": {
|
||||
"ghost": ">=1.0.0"
|
||||
"ghost": ">=1.2.0"
|
||||
},
|
||||
"license": "MIT",
|
||||
"screenshots": {
|
||||
@ -43,6 +43,7 @@
|
||||
"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"
|
||||
|
||||
0
partials/icons/facebook.hbs
Executable file → Normal file
0
partials/icons/facebook.hbs
Executable file → Normal file
|
Before Width: | Height: | Size: 155 B After Width: | Height: | Size: 155 B |
@ -7,8 +7,8 @@
|
||||
<div class="post-card-content">
|
||||
<a class="post-card-content-link" href="{{url}}">
|
||||
<header class="post-card-header">
|
||||
{{#if tags}}
|
||||
<span class="post-card-tags">{{tags.[0].name}}</span>
|
||||
{{#if primary_tag}}
|
||||
<span class="post-card-tags">{{primary_tag.name}}</span>
|
||||
{{/if}}
|
||||
<h2 class="post-card-title">{{title}}</h2>
|
||||
</header>
|
||||
|
||||
@ -1,36 +0,0 @@
|
||||
<section class="share">
|
||||
<ul class="">
|
||||
<li>
|
||||
<a class="share-facebook" 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;"><span class="share-label">Share</span><svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<path d="M12 0C5.383 0 0 5.383 0 12s5.383 12 12 12 12-5.383 12-12S18.617 0 12 0zm0 23C5.935 23 1 18.065 1 12S5.935 1 12 1s11 4.935 11 11-4.935 11-11 11zm3.839-14H14v-.523c0-.087.017-.127.092-.147H15.5c.276 0 .5-.224.5-.5V5.524c0-.275-.223-.499-.499-.5l-2.352-.007C11.148 5.018 10 6.227 10 8.336V9H8.5c-.276 0-.5.224-.5.5v2c0 .276.224.5.5.5H10v6.5c0 .276.224.5.5.5h3c.276 0 .5-.224.5-.5V12h1.595c.253 0 .466-.189.496-.439l.244-2c.018-.142-.026-.285-.122-.392-.095-.108-.231-.169-.374-.169zm-.687 2H13.5c-.276 0-.5.224-.5.5V18h-2v-6.5c0-.276-.224-.5-.5-.5H9v-1h1.5c.276 0 .5-.224.5-.5V8.336c0-2.319 1.618-2.319 2.148-2.319L15 6.023V7.33h-.908c-.526 0-1.092.359-1.092 1.147V9.5c0 .276.224.5.5.5h1.774l-.122 1z"/></a>
|
||||
</svg>
|
||||
</li>
|
||||
<li>
|
||||
<a class="share-twitter" 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;"><span class="share-label">Tweet</span><svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<path d="M18.446 6.856c-.049.005-1.066.116-1.732.226-.57-.508-1.315-.795-2.085-.795-1.727 0-3.133 1.405-3.133 3.132v.045C9.755 9.227 8.15 8.332 7.027 6.953c-.104-.127-.265-.195-.426-.182-.164.013-.311.105-.394.247-.277.478-.424 1.022-.424 1.575 0 .494.115.971.329 1.399l-.104.049c-.152.09-.246.271-.246.448 0 .906.393 1.739 1.028 2.318-.102.13-.132.301-.082.459.271.846.879 1.515 1.648 1.877-.783.356-1.664.494-2.553.391-.243-.032-.451.109-.528.328-.078.219.005.464.201.589 1.288.826 2.776 1.263 4.305 1.263 5 0 7.988-4.062 7.988-7.989l-.001-.123c.324-.336.565-.833.801-1.316.121-.25.234-.487.347-.656.107-.162.112-.371.012-.537-.101-.164-.288-.257-.482-.237zm-1.477 2.123c-.138.1-.215.262-.206.431l.007.314c0 3.436-2.614 6.989-6.988 6.989-.697 0-1.385-.104-2.043-.306.8-.191 1.55-.553 2.213-1.073.166-.13.232-.351.166-.552-.067-.2-.254-.337-.465-.341-.647-.013-1.238-.315-1.627-.801.163-.018.323-.048.481-.092.224-.062.375-.269.367-.5-.009-.231-.175-.427-.402-.472-.736-.147-1.322-.67-1.575-1.36.179.038.36.06.542.065.232.024.424-.133.492-.346.068-.212-.012-.445-.197-.569-.596-.396-.951-1.06-.951-1.773 0-.129.012-.257.035-.384 1.392 1.381 3.253 2.212 5.222 2.309.16.007.309-.059.408-.179.101-.121.139-.282.103-.435-.036-.156-.055-.319-.055-.485 0-1.176.957-2.132 2.133-2.132.596 0 1.148.239 1.556.674.118.126.293.183.463.148.24-.047.614-.101.967-.146-.198.405-.433.862-.646 1.016zM12 0C5.383 0 0 5.383 0 12s5.383 12 12 12 12-5.383 12-12S18.617 0 12 0zm0 23C5.935 23 1 18.065 1 12S5.935 1 12 1s11 4.935 11 11-4.935 11-11 11z"/></a>
|
||||
</svg>
|
||||
</li>
|
||||
<li>
|
||||
<a class="share-mail" href="mailto:?subject={{title}}&body=Hey, saw this on {{@blog.title}} and thought of you! - {{url absolute="true"}}"><span class="share-label">Send</span><svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<path d="M18 6H6c-1.103 0-2 .897-2 2v8c0 1.103.897 2 2 2h12c1.103 0 2-.897 2-2V8c0-1.103-.897-2-2-2zm1 10c0 .551-.449 1-1 1H6c-.551 0-1-.449-1-1V8c0-.551.449-1 1-1h12c.551 0 1 .449 1 1v8zm-1.113-7.816c-.175-.214-.49-.245-.704-.071L12 12.354 6.816 8.113c-.214-.174-.528-.143-.703.071-.175.213-.143.528.071.703l3.618 2.96-3.566 2.229c-.234.146-.305.455-.159.689.094.152.257.235.424.235.09 0 .182-.024.265-.076l3.853-2.408 1.065.872c.091.074.204.112.316.112s.225-.038.316-.113l1.065-.872 3.853 2.408c.083.053.175.077.266.077.167 0 .33-.083.424-.235.146-.234.075-.543-.159-.689l-3.566-2.229 3.618-2.96c.213-.175.245-.49.07-.703zM12 0C5.383 0 0 5.383 0 12s5.383 12 12 12 12-5.383 12-12S18.617 0 12 0zm0 23C5.935 23 1 18.065 1 12S5.935 1 12 1s11 4.935 11 11-4.935 11-11 11z"/></a>
|
||||
</svg>
|
||||
</li>
|
||||
<li>
|
||||
<a class="share-tumblr" href="https://www.tumblr.com/share?v=3&u={{url absolute="true"}}&t={{title}}" onclick="window.open(this.href, 'share-tumblr', 'width=450,height=483');return false;"><span class="share-label">Reblog</span><svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<path d="M12 0C5.383 0 0 5.383 0 12s5.383 12 12 12 12-5.383 12-12S18.617 0 12 0zm0 23C5.935 23 1 18.065 1 12S5.935 1 12 1s11 4.935 11 11-4.935 11-11 11zm3.729-8.521c-.161-.087-.357-.079-.512.022-.459.302-.905.468-1.256.468-.795 0-.962-.952-.962-1.751V10h1.5c.276 0 .5-.224.5-.5v-2C15 7.224 14.776 7 14.5 7H13V4.5c0-.276-.224-.5-.5-.5h-1.939c-.253 0-.466.188-.496.439-.075.606-.202 1.043-.441 1.51-.204.403-.48.755-.821 1.045-.252.214-.742.441-1.457.673-.206.066-.346.258-.346.475V9.5c0 .276.224.5.5.5H9v4.031c0 1.271.33 2.429.929 3.264.7.977 1.728 1.493 2.973 1.493.849 0 1.792-.242 2.804-.72.176-.083.287-.259.287-.452V14.92c-.001-.184-.101-.354-.264-.441zm-.737 2.813c-1.898.814-3.394.616-4.251-.581-.478-.665-.741-1.617-.741-2.68V9.5c0-.276-.224-.5-.5-.5H8v-.5c.674-.24 1.14-.48 1.451-.745.442-.377.801-.832 1.064-1.354.229-.447.379-.884.474-1.401H12v2.5c0 .276.224.5.5.5H14v1h-1.5c-.276 0-.5.224-.5.5v3.719c0 2.552 1.502 2.751 1.962 2.751.323 0 .671-.075 1.03-.22v1.542z"/></a>
|
||||
</svg>
|
||||
</li>
|
||||
<li>
|
||||
<a class="share-pinterest" href="https://www.pinterest.com/pin/create/bookmarklet/?media={{image absolute="true"}}&url={{url absolute="true"}}&description={{title}}" onclick="window.open(this.href, 'share-pinterest', 'width=770,height=560');return false;"><span class="share-label">Pin</span><svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<path d="M12 0C5.383 0 0 5.383 0 12s5.383 12 12 12 12-5.383 12-12S18.617 0 12 0zm0 23C5.935 23 1 18.065 1 12S5.935 1 12 1s11 4.935 11 11-4.935 11-11 11zm.531-19.5c-4.425 0-7.068 3.173-7.068 6.24 0 .958.204 1.831.591 2.523.134.238.435.325.671.197l1.513-.805c.234-.124.331-.409.22-.65-.137-.297-.203-.637-.203-1.037 0-1.938 1.383-3.9 4.025-3.9 2.051 0 3.324 1.158 3.324 3.021 0 2.46-1.061 4.388-2.414 4.388-.33 0-.625-.133-.809-.365-.17-.215-.226-.496-.156-.791.098-.408.227-.829.354-1.238.242-.784.472-1.525.472-2.139 0-1.123-.699-1.878-1.74-1.878-1.274 0-2.272 1.264-2.272 2.878 0 .691.168 1.232.269 1.498l-1.144 4.85c-.31 1.31-.158 2.842-.037 3.672.042.312.3.537.614.537.197 0 .379-.091.514-.268.398-.507 1.361-1.829 1.729-3.158.064-.231.263-1.012.424-1.645.539.39 1.262.633 1.984.633 3.163 0 5.459-2.858 5.459-6.797-.001-2.834-2.365-5.766-6.32-5.766zm.86 11.562c-.83 0-1.581-.455-1.801-.876-.096-.184-.297-.287-.502-.266-.206.024-.375.174-.426.375 0 0-.533 2.109-.644 2.516-.201.73-.626 1.478-1.008 2.053-.053-.711-.054-1.581.126-2.344l1.183-5.007c.026-.112.013-.232-.038-.336-.002-.005-.242-.508-.242-1.233 0-1.053.559-1.878 1.272-1.878.645 0 .74.55.74.878 0 .463-.208 1.134-.427 1.844-.134.43-.269.872-.372 1.302-.142.6-.02 1.184.345 1.644.374.473.955.744 1.593.744 1.946 0 3.414-2.316 3.414-5.388 0-2.405-1.737-4.021-4.324-4.021-2.865 0-5.025 2.106-5.025 4.9 0 .365.043.699.131 1.009l-.662.352c-.171-.462-.26-1.002-.26-1.589 0-2.54 2.127-5.24 6.068-5.24 3.329 0 5.318 2.423 5.318 4.766 0 3.412-1.834 5.795-4.459 5.795z"/>
|
||||
</svg></a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="share-whatsapp" href="whatsapp://send?text={{url absolute="true"}}"><span class="share-label">WhatsApp</span><svg version="1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<path d="M18.652 14.46l-.166-.08c-.019-.01-1.964-.968-2.344-1.104-.435-.16-1.003-.144-1.34.357-.179.268-.722.91-1.006 1.273l-.144-.055-.245-.109c-.465-.2-1.33-.572-2.342-1.467-.938-.831-1.587-1.881-1.795-2.147l.097-.106c.593-.585.777-.956.932-1.266.165-.322.156-.671-.026-1.036-.058-.117-.358-.843-.635-1.511l-.385-.924c-.234-.56-.852-.908-1.612-.908-.601 0-1.165.221-1.509.593-1.806 1.96-1.748 4.33.165 6.856l.059.086c1.673 2.46 3.763 4.271 5.886 5.102 2.213.864 2.989.981 3.457.981.261 0 .44-.043.583-.077l.211-.04c1.317-.119 2.28-1.137 2.705-1.973.38-.749.431-1.458.136-1.949-.147-.241-.383-.354-.682-.496zm-.346 1.99c-.309.608-.993 1.348-1.903 1.43l-.354.063c-.116.028-.207.05-.35.05-.509 0-1.521-.298-3.093-.912-1.937-.757-3.862-2.438-5.423-4.733l-.088-.126c-1.606-2.12-1.683-3.996-.227-5.574.152-.165.456-.271.774-.271.339 0 .616.118.69.295l.383.92c.29.703.608 1.468.664 1.577.048.096.039.111.005.181-.12.242-.245.492-.72.961-.17.168-.623.615-.227 1.285.25.429.944 1.523 1.965 2.428 1.133 1.001 2.13 1.431 2.609 1.637l.196.087c.556.275.978.192 1.325-.202.008-.01.823-.94 1.08-1.386l.191.057c.254.091 1.762.822 2.239 1.06l.179.087.256.109c.088.145.057.528-.171.977zM11.999.18c-6.617 0-12 5.343-12 11.909 0 2.438.737 4.774 2.136 6.772L.78 22.857c-.061.179-.015.376.117.511.132.134.328.183.508.126L5.6 22.161C7.517 23.365 9.724 24 12 24c6.616 0 11.999-5.343 11.999-11.91S18.616.18 11.999.18zM12 23c-2.161 0-4.254-.624-6.053-1.805-.083-.054-.178-.082-.274-.082l-.151.023-3.477 1.104 1.119-3.302c.052-.154.026-.324-.07-.455-1.37-1.872-2.095-4.084-2.095-6.396 0-6.016 4.935-10.909 11-10.909 6.066 0 11 4.895 11 10.91C22.999 18.105 18.065 23 12 23z"/>
|
||||
</svg></a>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
@ -14,16 +14,16 @@
|
||||
<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">{{> "icons/facebook"}}</a>
|
||||
<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">{{> "icons/twitter"}}</a>
|
||||
<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="http://cloud.feedly.com/#subscription/feed/{{@blog.url}}/rss/" target="_blank">{{> "icons/rss"}}</a>
|
||||
<a class="rss-button" href="http://cloud.feedly.com/#subscription/feed/{{@blog.url}}/rss/" target="_blank" rel="noopener">{{> "icons/rss"}}</a>
|
||||
{{/if}}
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
27
post.hbs
27
post.hbs
@ -20,9 +20,9 @@ into the {body} of the default.hbs template --}}
|
||||
<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>
|
||||
{{#if tags}}
|
||||
<span class="date-divider">/</span> <a href="{{@blog.url}}tag/{{tags.[0].slug}}">{{tags.[0].name}}</a>
|
||||
{{/if}}
|
||||
{{#primary_tag}}
|
||||
<span class="date-divider">/</span> <a href="{{url}}">{{name}}</a>
|
||||
{{/primary_tag}}
|
||||
</section>
|
||||
<h1 class="post-full-title">{{title}}</h1>
|
||||
</header>
|
||||
@ -80,7 +80,7 @@ into the {body} of the default.hbs template --}}
|
||||
<script>
|
||||
var disqus_config = function () {
|
||||
this.page.url = '{{url absolute="true"}}';
|
||||
this.page.identifier = 'ghost-{{id}}';
|
||||
this.page.identifier = 'ghost-{{comment_id}}';
|
||||
};
|
||||
(function() {
|
||||
var d = document, s = d.createElement('script');
|
||||
@ -101,11 +101,12 @@ into the {body} of the default.hbs template --}}
|
||||
<aside class="read-next outer">
|
||||
<div class="inner">
|
||||
<div class="read-next-feed">
|
||||
|
||||
{{#get "posts" filter="tags:{{tags.[0].slug}}+id:-{{id}}" limit="3"}}
|
||||
{{#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 ../tags.[0].feature_image}}
|
||||
style="background-image: url({{../tags.[0].feature_image}})"
|
||||
{{#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}}
|
||||
@ -113,21 +114,25 @@ into the {body} of the default.hbs template --}}
|
||||
>
|
||||
<header class="read-next-card-header">
|
||||
<small class="read-next-card-header-sitetitle">— {{@blog.title}} —</small>
|
||||
<h3 class="read-next-card-header-title"><a href="{{@blog.url}}tag/{{../tags.[0].slug}}/">{{../tags.[0].name}}</a></h3>
|
||||
{{#../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 posts}}
|
||||
{{#foreach related_posts}}
|
||||
<li><a href="{{url}}">{{title}}</a></li>
|
||||
{{/foreach}}
|
||||
</ul>
|
||||
</div>
|
||||
<footer class="read-next-card-footer">
|
||||
<a href="{{@blog.url}}tag/{{../tags.[0].slug}}/">{{plural meta.pagination.total empty='No posts' singular='% post' plural='See all % posts'}} →</a>
|
||||
<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}}
|
||||
|
||||
Reference in New Issue
Block a user