Port theme

This commit is contained in:
John O'Nolan 2020-05-27 14:06:36 +07:00
parent d36ed367bf
commit fc20244408
46 changed files with 99 additions and 8546 deletions

View file

@ -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

View file

@ -1,58 +1,3 @@
# Ghost Starter Theme
# Bear Ghost Theme
A starter framework for Ghost themes! Fork this repository and start your development here with all the main things you need to develop a custom Ghost theme.
 
# First time using a Ghost theme?
Ghost uses a simple templating language called [Handlebars](http://handlebarsjs.com/) for its themes.
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 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
Styles are compiled using Gulp/PostCSS to polyfill future CSS spec. You'll need [Node](https://nodejs.org/), [Yarn](https://yarnpkg.com/) and [Gulp](https://gulpjs.com) installed globally. After that, from the theme's root directory:
```bash
# Install
yarn
# Run build & watch for changes
$ 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)
# Copyright & License
Copyright (c) 2013-2020 Ghost Foundation - Released under the [MIT license](LICENSE).
A minimal theme for Ghost.

View file

@ -1,2 +0,0 @@
$(function(n){var i=1,t=window.location.pathname,o=n(document),r=n(".post-feed"),a=300,s=!1,c=!1,l=window.scrollY,w=window.innerHeight,d=o.height();function u(){l=window.scrollY,e()}function v(){w=window.innerHeight,d=o.height(),e()}function e(){s||requestAnimationFrame(f),s=!0}function f(){if(t=function(e){var n=/(?:page\/)(\d)(?:\/)$/i;return(e=e.replace(/#(.*)$/g,"").replace("////g","/")).match(n)&&(i=parseInt(e.match(n)[1]),e=e.replace(n,"")),e}(t),!c)if(l+w<=d-a)s=!1;else{if(i>=maxPages)return window.removeEventListener("scroll",u,{passive:!0}),void window.removeEventListener("resize",v);c=!0;var e=t+"page/"+(i+=1)+"/";n.get(e,function(e){var n=document.createRange().createContextualFragment(e).querySelectorAll(".post");n.length&&[].forEach.call(n,function(e){r[0].appendChild(e)})}).fail(function(e){404===e.status&&(window.removeEventListener("scroll",u,{passive:!0}),window.removeEventListener("resize",v))}).always(function(){d=o.height(),s=c=!1})}}window.addEventListener("scroll",u,{passive:!0}),window.addEventListener("resize",v),f()});
//# sourceMappingURL=infinitescroll.js.map

File diff suppressed because one or more lines are too long

View file

@ -1,2 +0,0 @@
!function(d){"use strict";d.fn.fitVids=function(t){var i={customSelector:null,ignore:null};if(!document.getElementById("fit-vids-style")){var e=document.head||document.getElementsByTagName("head")[0],r=document.createElement("div");r.innerHTML='<p>x</p><style id="fit-vids-style">.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%;}</style>',e.appendChild(r.childNodes[1])}return t&&d.extend(i,t),this.each(function(){var t=['iframe[src*="player.vimeo.com"]','iframe[src*="youtube.com"]','iframe[src*="youtube-nocookie.com"]','iframe[src*="kickstarter.com"][src*="video.html"]',"object","embed"];i.customSelector&&t.push(i.customSelector);var r=".fitvidsignore";i.ignore&&(r=r+", "+i.ignore);var e=d(this).find(t.join(","));(e=(e=e.not("object object")).not(r)).each(function(){var t=d(this);if(!(0<t.parents(r).length||"embed"===this.tagName.toLowerCase()&&t.parent("object").length||t.parent(".fluid-width-video-wrapper").length)){t.css("height")||t.css("width")||!isNaN(t.attr("height"))&&!isNaN(t.attr("width"))||(t.attr("height",9),t.attr("width",16));var e=("object"===this.tagName.toLowerCase()||t.attr("height")&&!isNaN(parseInt(t.attr("height"),10))?parseInt(t.attr("height"),10):t.height())/(isNaN(parseInt(t.attr("width"),10))?t.width():parseInt(t.attr("width"),10));if(!t.attr("name")){var i="fitvid"+d.fn.fitVids._count;t.attr("name",i),d.fn.fitVids._count++}t.wrap('<div class="fluid-width-video-container"><div class="fluid-width-video-wrapper"></div></div>').parent(".fluid-width-video-wrapper").css("padding-top",100*e+"%"),t.removeAttr("height").removeAttr("width")}})})},d.fn.fitVids._count=0}(window.jQuery||window.Zepto);
//# sourceMappingURL=jquery.fitvids.js.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

View file

@ -1,2 +0,0 @@
/*# sourceMappingURL=vars.css.map */

View file

@ -1 +0,0 @@
{"version":3,"sources":[],"names":[],"mappings":"","file":"vars.css"}

View file

@ -1,68 +0,0 @@
/* Buttons
/* ---------------------------------------------------------- */
.gh-button {
display: inline-block;
min-width: 75px;
height: var(--height);
padding: 0 2rem;
border: 0;
border-radius: var(--radius);
cursor: pointer;
font-family: var(--font-sans-serif);
font-size: 1.4rem;
font-weight: var(--font-normal);
line-height: var(--height);
text-align: center;
text-decoration: none;
white-space: nowrap;
appearance: none;
transition: 0.4s ease;
}
.gh-button.gh-button-fit {
width: 100%;
}
.gh-button.gh-button-small {
height: calc(var(--height) * 0.9);
line-height: calc(var(--height) * 0.9);
padding: 0 1.5rem;
font-size: 1.2rem;
}
.gh-button.gh-button-large {
height: calc(var(--height) * 1.2);
line-height: calc(var(--height) * 1.2);
padding: 0 2.5rem;
font-size: 1.7rem;
}
.gh-button.gh-button-disabled,
.gh-button:disabled {
pointer-events: none;
opacity: 0.4;
}
.gh-button {
color: var(--color-primary) !important;
background-color: transparent;
box-shadow: inset 0 0 0 2px var(--color-primary);
}
.gh-button:hover {
text-decoration: none;
color: color(var(--color-primary) l(-15%)) !important;
box-shadow: inset 0 0 0 2px color(var(--color-primary) l(-10%));
transition: 0.2s ease;
}
.gh-button.gh-button-primary {
color: #fff !important;
background-color: var(--color-primary);
box-shadow: none;
}
.gh-button.gh-button-primary:hover {
background-color: color(var(--color-primary) l(-10%));
}

View file

@ -1,108 +0,0 @@
/* Forms
/* ---------------------------------------------------------- */
.gh-input,
.gh-textarea {
background: var(--color-bg);
border-radius: var(--radius);
border: none;
border: solid 1px var(--color-border);
color: inherit;
display: block;
outline: 0;
padding: 0 0.6em;
text-decoration: none;
width: 100%;
}
.gh-input:focus {
border-color: var(--color-primary);
}
.gh-select {
height: var(--height);
padding-right: var(--height);
text-overflow: ellipsis;
}
.gh-select option {
color: var(--color-primary);
background: var(--color-bg);
}
.gh-select:focus::-ms-value {
background-color: transparent;
}
.gh-select::-ms-expand {
display: none;
}
.gh-input,
.gh-select {
height: var(--height);
}
.gh-textarea {
padding: 0.3em 0.6em;
resize: vertical;
}
.gh-check {
display: block;
margin-right: -2em;
opacity: 0;
width: 1em;
z-index: -1;
}
.gh-check + label,
.gh-check + label {
display: flex;
align-items: center;
color: var(--color-base);
cursor: pointer;
font-size: 1em;
font-weight: var(--font-normal);
padding-left: calc((var(--height) * 0.6) + 0.75em);
padding-right: 2rem;
position: relative;
user-select: none;
}
.gh-check + label:before,
.gh-check + label:before {
background: var(--color-bg);
border-radius: var(--radius);
border: solid 1px var(--color-border);
content: '';
display: inline-block;
height: calc(var(--height) * 0.6);
line-height: calc(var(--height) * 0.56);
text-align: center;
width: calc(var(--height) * 0.6);
margin-right: 1rem;
}
.gh-check:checked + label:before,
.gh-check:checked + label:before {
background: var(--color-primary);
border-color: var(--color-primary);
color: var(--color-bg);
content: '✓';
}
.gh-check:focus + label:before,
.gh-check:focus + label:before {
border-color: var(--color-primary);
box-shadow: 0 0 0 1px var(--color-primary);
}
.gh-check + label:before {
border-radius: var(--radius);
}
.gh-check + label:before {
border-radius: 100%;
}

View file

@ -1,197 +0,0 @@
/* Reset
/* ---------------------------------------------------------- */
*,
*::before,
*::after {
box-sizing: border-box;
}
html {
overflow-x: hidden;
overflow-y: scroll;
font-size: 62.5%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body {
min-height: 100vh;
margin: 0;
padding: 0;
color: color(var(--color-base) l(+20%));
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;
background: #fff;
scroll-behavior: smooth;
overflow-x: hidden;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
p,
ul,
ol,
li,
dl,
dd,
hr,
pre,
form,
table,
video,
figure,
figcaption,
blockquote {
margin: 0;
padding: 0;
}
ul[class],
ol[class] {
padding: 0;
list-style: none;
}
img {
display: block;
max-width: 100%;
}
input,
button,
select,
textarea {
font: inherit;
}
fieldset {
margin: 0;
padding: 0;
border: 0;
}
label {
display: block;
font-size: 0.9em;
font-weight: 700;
}
hr {
position: relative;
display: block;
width: 100%;
height: 1px;
border: 0;
border-top: 1px solid currentcolor;
opacity: 0.2;
}
::selection {
text-shadow: none;
background: #cbeafb;
}
mark {
background-color: #fdffb6;
}
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;
}
li:not([class]) + li:not([class]) {
margin-top: 1em;
}
a:not([class]) {
color: color(var(--color-primary) l(-5%));
text-decoration-skip-ink: auto;
}
a[class] {
color: inherit;
text-decoration: none;
transition: 0.4s ease;
}
a[class]:hover {
transition: 0.2s ease;
}
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 0;
line-height: 1.15em;
font-weight: 700;
}
h1 {
font-size: 4.6rem;
letter-spacing: -0.5px;
}
@media (max-width: 500px) {
h1 {
font-size: 2.7rem;
}
}
h2 {
font-size: 3.6rem;
}
@media (max-width: 500px) {
h2 {
font-size: 2.2rem;
}
}
h3 {
font-size: 3.2rem;
}
@media (max-width: 500px) {
h3 {
font-size: 1.8rem;
}
}
h4 {
font-size: 2.6rem;
}
h5 {
font-size: 2.4rem;
}
h6 {
font-size: 2.2rem;
}
/* Remove all animations and transitions for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
* {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
scroll-behavior: auto !important;
}
}

View file

@ -1,26 +0,0 @@
.gh-powered {
display: inline-flex;
align-items: center;
padding: 6px 9px 6px 6px;
border: rgba(0,0,0,0.15) 1px solid;
font-size: 13px;
line-height: 13px;
letter-spacing: -0.1px;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
font-weight: 500;
color: #131313 !important;
background: #fff;
border-radius: 6px;
}
.gh-powered:hover {
border: rgba(0,0,0,0.3) 1px solid;
color: #131313 !important;
text-decoration: none !important;
}
.gh-powered svg {
height: 18px;
width: 18px;
margin: 0 6px 0 0;
}

View file

@ -1,397 +0,0 @@
/* Content grid
/* ---------------------------------------------------------- */
.gh-canvas {
display: grid;
grid-template-columns:
[full-start]
minmax(calc(calc(100% - 1200px) / 2), 1fr)
[wide-start]
auto
[main-start]
720px
[main-end]
auto
[wide-end]
minmax(calc(calc(100% - 1200px) / 2), 1fr)
[full-end]
;
}
@media (max-width: 1296px) {
.gh-canvas {
grid-template-columns:
[full-start]
4vw
[wide-start]
auto
[main-start]
720px
[main-end]
auto
[wide-end]
4vw
[full-end]
;
}
}
@media (max-width: 778px) {
.gh-canvas {
grid-template-columns:
[full-start]
4vw
[wide-start]
0
[main-start]
auto
[main-end]
0
[wide-end]
4vw
[full-end]
;
}
}
.gh-canvas > * {
grid-column: main-start / main-end;
}
.kg-width-wide {
grid-column: wide-start / wide-end;
}
.kg-width-full {
grid-column: full-start / full-end;
}
.kg-width-full img {
width: 100%;
}
/* Content & Typography
/* ---------------------------------------------------------- */
.gh-content > * + * {
margin-top: 4vmin;
}
.gh-content > [id] + * {
margin-top: 1.5rem;
}
.gh-content [id]:not(:first-child) {
margin: 1.5em 0 0;
}
.gh-content [id] + .kg-card,
.gh-content blockquote + .kg-card {
margin-top: 6vmin;
}
.gh-canvas > blockquote,
.gh-canvas > ol,
.gh-canvas > ul,
.gh-canvas > dl,
.gh-canvas > p {
font-family: var(--font-serif);
font-weight: 400;
font-size: 2rem;
line-height: 1.6em;
}
.gh-content > ul,
.gh-content > ol,
.gh-content > dl {
padding-left: 1.9em;
}
.gh-content hr {
margin-top: 6vmin;
}
.gh-content hr + * {
margin-top: 6vmin !important;
}
.gh-content blockquote {
position: relative;
font-style: italic;
}
.gh-content blockquote::before {
content: "";
position: absolute;
left: -1.5em;
top: 0;
bottom: 0;
width: 0.3rem;
background: var(--color-primary);
}
@media (max-width: 650px) {
.gh-canvas blockquote,
.gh-canvas ol,
.gh-canvas ul,
.gh-canvas dl,
.gh-canvas p {
font-size: 1.8rem;
}
.gh-content blockquote::before {
left: -4vw;
}
}
/* Cards
/* ---------------------------------------------------------- */
:not(.kg-card):not([id]) + .kg-card {
margin-top: 6vmin;
}
.kg-card + :not(.kg-card):not([id]) {
margin-top: 6vmin;
}
.kg-card figcaption {
padding: 1.5rem 1.5rem 0;
text-align: center;
color: rgba(0,0,0,0.5);
font-weight: 600;
font-size: 1.3rem;
line-height: 1.4em;
}
.kg-card figcaption strong {
color: rgba(0,0,0,0.8);
}
.gh-canvas :not(pre) code {
vertical-align: middle;
padding: 0.15em 0.4em 0.15em;
border: #e1eaef 1px solid;
font-weight: 400 !important;
font-size: 0.9em;
line-height: 1em;
color: #dc0050;
background: #f0f6f9;
border-radius: 0.25em;
}
.gh-canvas > pre {
overflow: scroll;
padding: 16px 20px;
background: rgba(255,255,255,0.8);
border-radius: 5px;
box-shadow: 0 2px 6px -2px rgba(0,0,0,.1), 0 0 1px rgba(0,0,0,.4);
}
.kg-embed-card {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
}
.kg-image-card img {
margin: auto;
}
/* Galleries
/* ---------------------------------------------------------- */
.kg-gallery-card + .kg-gallery-card {
margin-top: 0.75em;
}
.kg-gallery-container {
position: relative;
}
.kg-gallery-row {
display: flex;
flex-direction: row;
justify-content: center;
}
.kg-gallery-image img {
display: block;
margin: 0;
width: 100%;
height: 100%;
}
.kg-gallery-row:not(:first-of-type) {
margin: 0.75em 0 0 0;
}
.kg-gallery-image:not(:first-of-type) {
margin: 0 0 0 0.75em;
}
/* Bookmark Cards
/* ---------------------------------------------------------- */
.kg-bookmark-card,
.kg-bookmark-publisher {
position: relative;
}
.kg-bookmark-container,
.kg-bookmark-container:hover {
display: flex;
flex-wrap: wrap;
flex-direction: row-reverse;
color: currentColor;
background: rgba(255,255,255,0.6);
font-family: var(--font-sans-serif);
text-decoration: none;
border-radius: 5px;
box-shadow: 0 2px 6px -2px rgba(0, 0, 0, 0.1), 0 0 1px rgba(0, 0, 0, 0.4);
overflow: hidden;
}
.kg-bookmark-content {
flex-basis: 0;
flex-grow: 999;
padding: 20px;
order: 1;
}
.kg-bookmark-title {
font-weight: 600;
font-size: 1.5rem;
line-height: 1.3em;
}
.kg-bookmark-description {
display: -webkit-box;
max-height: 45px;
margin: 0.5em 0 0 0;
font-size: 1.4rem;
line-height: 1.55em;
overflow: hidden;
opacity: 0.8;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.kg-bookmark-metadata {
margin-top: 20px;
}
.kg-bookmark-metadata {
display: flex;
align-items: center;
font-weight: 500;
font-size: 1.3rem;
line-height: 1.3em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.kg-bookmark-description {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
.kg-bookmark-icon {
display: inline-block;
width: 16px;
height: 16px;
}
.kg-bookmark-thumbnail {
display: flex;
flex-basis: 24rem;
flex-grow: 1;
justify-content: flex-end;
}
.kg-bookmark-thumbnail img {
max-width: 100%;
height: auto;
vertical-align: bottom;
object-fit: cover;
}
.kg-bookmark-author {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.kg-bookmark-publisher::before {
content: "•";
margin: 0 .5em;
}
/* Card captions
/* ---------------------------------------------------------- */
.kg-width-full.kg-card-hascaption {
display: grid;
grid-template-columns: inherit;
}
.kg-width-wide.kg-card-hascaption img {
grid-column: wide-start / wide-end;
}
.kg-width-full.kg-card-hascaption img {
grid-column: 1 / -1;
}
.kg-width-full.kg-card-hascaption figcaption {
grid-column: main-start / main-end;
}
/* Tables
/* ---------------------------------------------------------- */
.gh-content table {
border-collapse: collapse;
width: 100%;
}
.gh-content th {
padding: 0.5em 0.8em;
text-align: left;
font-size: .75em;
text-transform: uppercase;
}
.gh-content td {
padding: 0.4em 0.7em;
}
.gh-content tbody tr:nth-child(2n + 1) {
background-color: rgba(0,0,0,0.1);
padding: 1px;
}
.gh-content tbody tr:nth-child(2n + 2) td:last-child {
box-shadow:
inset 1px 0 rgba(0,0,0,0.1),
inset -1px 0 rgba(0,0,0,0.1);
}
.gh-content tbody tr:nth-child(2n + 2) td {
box-shadow: inset 1px 0 rgba(0,0,0,0.1);
}
.gh-content tbody tr:last-child {
border-bottom: 1px solid rgba(0,0,0,.1);
}

View file

@ -1,60 +0,0 @@
/* Error Templates
/* ---------------------------------------------------------- */
.gh-error {
flex: 1 0 auto;
display: flex;
flex-direction: column;
justify-content: center;
padding-bottom: 2vmin;
}
.gh-error-content {
flex: 1 0 auto;
text-align: center;
}
.gh-error-code {
margin: 0;
font-size: 14vmin;
}
.gh-error-description {
max-width: 600px;
margin: 0 auto;
padding: 0 2rem;
font-size: 4vmin;
line-height: 1.2em;
font-weight: 300;
opacity: 0.6;
}
.gh-error-link {
display: block;
margin-top: 4vmin;
font-size: 1.6rem;
}
.gh-error-stack {
max-width: 600px;
margin: 0 auto 0;
padding: 8vmin 0;
text-align: left;
}
.gh-error-stack-list {
margin: 4vmin 0 0;
font-size: 1.4rem;
}
.gh-error-stack-list > li {
padding: 2rem 0;
margin: 0;
border-top: rgba(0,0,0,0.1) 1px solid;
}
.gh-error-stack-function {
margin: 0 0 0.5em;
font-size: 1.8rem;
color: red;
}

View file

@ -1,57 +0,0 @@
/* Global Footer
/* ---------------------------------------------------------- */
.gh-foot {
display: flex;
align-items: center;
justify-content: center;
padding: 8vmin 4vw;
}
.gh-foot .gh-container {
width: auto;
}
.gh-foot a {
color: inherit;
}
.gh-foot-menu {
display: flex;
align-items: center;
justify-content: center;
}
.gh-foot-menu .nav {
display: inline-flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
list-style: none;
font-size: 1.8rem;
}
.gh-foot-menu .nav li {
margin: 0 1.5vmin;
padding: 0;
}
.gh-foot-menu .nav a {
display: inline-block;
padding: 3px 0;
text-decoration: none;
box-shadow: 0 -1px 0 0 currentcolor inset;
}
.gh-foot-meta {
margin: 2rem 0;
font-size: 1.5rem;
text-align: center;
opacity: 0.5;
}
@media (max-width: 700px) {
.gh-foot-menu .nav {
font-size: 1.6rem;
}
}

View file

@ -1,328 +0,0 @@
/* Global Header
/* ---------------------------------------------------------- */
.gh-head {
padding: 3vw 4vw;
font-size: 1.6rem;
line-height: 1.3em;
background: inherit;
}
.gh-head a {
color: inherit;
text-decoration: none;
}
.gh-head-inner {
display: grid;
grid-gap: 40px;
grid-template-columns: 1fr auto 1fr;
grid-auto-flow: row dense;
}
/* Brand
/* ---------------------------------------------------------- */
.gh-head-brand {
grid-column-start: 2;
display: flex;
align-items: center;
max-width: 200px;
text-align: center;
word-break: break-all;
}
.gh-head-logo {
display: block;
padding: 10px 0;
font-weight: 600;
font-size: 2.2rem;
line-height: 1.2em;
}
.gh-head-logo img {
max-height: 40px;
}
/* Primary Navigation
/* ---------------------------------------------------------- */
.gh-head-menu {
display: flex;
align-items: center;
}
.gh-head-menu .nav {
display: inline-flex;
flex-wrap: wrap;
align-items: center;
list-style: none;
}
.gh-head-menu .nav li {
margin: 0 1.5vw 0 0;
padding: 0;
}
.gh-head-menu .nav a {
display: inline-block;
padding: 5px 0;
}
.gh-head-menu .nav-current a {
box-shadow: 0 -1px 0 0 currentcolor inset;
}
/* Secondary Navigation
/* ---------------------------------------------------------- */
.gh-head-actions {
display: flex;
justify-content: flex-end;
align-items: center;
list-style: none;
text-align: right;
}
.gh-head-actions-list {
display: inline-flex;
flex-wrap: wrap;
justify-content: flex-end;
align-items: center;
}
.gh-head-actions-list a:not([class]) {
display: inline-block;
margin: 0 0 0 1.5vw;
padding: 5px 0;
}
/* Mobile Menu Trigger
/* ---------------------------------------------------------- */
.gh-burger {
position: relative;
display: none;
cursor: pointer;
}
.gh-burger-box {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 33px;
height: 33px;
}
.gh-burger-inner {
width: 100%;
height: 100%;
}
.gh-burger-box::before {
position: absolute;
display: block;
top: 0;
left: 0;
bottom: 0;
margin: auto;
content: '';
width: 100%;
height: 1px;
background: currentcolor;
transition: transform 300ms cubic-bezier(.2,.6,.3,1), width 300ms cubic-bezier(.2,.6,.3,1);
will-change: transform, width;
}
.gh-burger-inner::before,
.gh-burger-inner::after {
position: absolute;
display: block;
top: 0;
left: 0;
bottom: 0;
margin: auto;
content: '';
width: 100%;
height: 1px;
background: currentcolor;
transition: transform 250ms cubic-bezier(.2,.7,.3,1), width 250ms cubic-bezier(.2,.7,.3,1);
will-change: transform, width;
}
.gh-burger-inner::before {
transform: translatey(-6px);
}
.gh-burger-inner::after {
transform: translatey(6px);
}
body:not(.gh-head-open) .gh-burger:hover .gh-burger-inner::before {
transform: translatey(-8px);
}
body:not(.gh-head-open) .gh-burger:hover .gh-burger-inner::after {
transform: translatey(8px);
}
.gh-head-open .gh-burger-box::before {
width: 0;
transform: translatex(19px);
transition: transform 200ms cubic-bezier(.2,.7,.3,1), width 200ms cubic-bezier(.2,.7,.3,1);
}
.gh-head-open .gh-burger-inner::before {
width: 26px;
transform: translatex(6px) rotate(135deg);
}
.gh-head-open .gh-burger-inner::after {
width: 26px;
transform: translatex(6px) rotate(-135deg);
}
/* Layout Variants
/* ---------------------------------------------------------- */
.gh-head-brandnavactions .gh-head-brand {
grid-column-start: 1;
}
.gh-head-brandnav .gh-container {
grid-gap: 0;
grid-template-columns: auto max-content max-content;
}
.gh-head-brandnav .gh-head-brand {
grid-column-start: 1;
}
.gh-head-brandnav .gh-head-menu {
margin-left: 40px;
}
.gh-head-brandnav .gh-head-menu .nav li {
margin: 0 0 0 1.5vw;
padding: 0;
}
/* Center Stacked */
.gh-head-stacked .gh-container {
grid-template-columns: 1fr;
grid-gap: 2vmin;
}
.gh-head-stacked .gh-head-brand {
grid-column-start: 1;
width: 100%;
max-width: none;
display: flex;
justify-content: center;
text-align: center;
}
.gh-head-stacked .gh-head-menu,
.gh-head-stacked .gh-head-actions,
.gh-head-stacked .gh-head-actions-list {
justify-content: center;
}
.gh-head-stacked .gh-head-actions a:first-child svg {
margin-left: 0;
}
/* Mobile Menu
/* ---------------------------------------------------------- */
/* IDs needed to ensure sufficient specificity */
@media (max-width: 900px) {
.gh-burger {
display: inline-block;
}
#gh-head {
transition: all 0.4s ease-out;
overflow: hidden;
}
#gh-head .gh-head-inner {
height: 100%;
grid-template-columns: 1fr;
}
#gh-head .gh-head-brand {
position: relative;
z-index: 10;
grid-column-start: auto;
max-width: none;
display: flex;
align-items: center;
justify-content: space-between;
user-select: none;
}
#gh-head .gh-head-logo {
font-size: 2.2rem;
}
#gh-head .gh-head-logo img {
max-height: 40px;
}
#gh-head .gh-head-menu {
align-self: center;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
margin: 0 0 10vh 0;
font-weight: 300;
font-size: 3.6rem;
line-height: 1.1em;
}
#gh-head .gh-head-menu .nav li {
margin: 5px 0;
}
#gh-head .gh-head-menu .nav a {
padding: 8px 0;
}
#gh-head .gh-head-menu .nav {
display: flex;
flex-direction: column;
align-items: center;
}
#gh-head .gh-head-actions {
padding: 20px 0;
justify-content: center;
text-align: left;
}
#gh-head .gh-head-actions a {
margin: 0 10px;
}
/* Hide collapsed content */
#gh-head .gh-head-actions,
#gh-head .gh-head-menu {
display: none;
}
/* Open the menu */
.gh-head-open {
overflow: hidden;
height: 100vh;
}
.gh-head-open #gh-head {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 900;
overflow-y: scroll;
}
.gh-head-open #gh-head .gh-head-inner {
grid-template-rows: auto 1fr auto;
}
.gh-head-open #gh-head .gh-head-actions,
.gh-head-open #gh-head .gh-head-menu {
display: flex;
}
}
@media (max-width: 600px) {
#gh-head .gh-head-menu {
font-size: 6vmin;
}
}

View file

@ -1,141 +0,0 @@
/* Members Auth Template
/* ---------------------------------------------------------- */
.gh-auth-form {
width: 100%;
max-width: 600px;
margin: 0 auto 10vmin;
text-align: center;
}
.gh-auth-title {
margin: 0 0 0.1em;
font-size: 4.2rem;
}
.gh-auth-form p {
margin: 10px 0 4vmin 0;
font-size: 1.7rem;
color: rgba(0,0,0,0.6)
}
.gh-auth-form p small {
display: inline-block;
margin: 15px 0 0 0;
font-size: 1.4rem;
}
.gh-auth-box {
display: flex;
align-items: center;
justify-content: space-between;
max-width: 460px;
margin: 0 auto;
}
.gh-auth-box .gh-button {
margin-left: 10px;
}
@media (max-width: 600px) {
.gh-auth-box {
flex-direction: column;
max-width: 400px;
}
.gh-auth-box .gh-button {
width: 100%;
margin: 15px 0 0 0;
}
}
/* Members Forms
/* ---------------------------------------------------------- */
form[data-members-form] .gh-button-loader,
form[data-members-form] .message-success,
form[data-members-form] .message-error {
display: none;
}
.gh-button-content {
min-width: 100px;
}
.message-success svg,
.message-error svg {
position: relative;
top: -1px;
margin-right: 5px;
height: 15px;
width: 15px;
}
.message-success svg {
fill: #fff;
}
.message-error svg {
fill: red;
}
form[data-members-form].success .message-success,
form[data-members-form].error .message-error {
position: fixed;
top: 20px;
left: 4vw;
right: 4vw;
z-index: 9999;
max-width: calc(1400px - 8vw);
margin: 0 auto;
padding: 10px 0;
color: #fff;
font-size: 1.4rem;
line-height: 1.5em;
font-weight: 500;
text-align: center;
background: var(--color-base);
border-radius: var(--radius);
}
form[data-members-form].success .message-success {
background: var(--color-success);
}
form[data-members-form].error .message-error {
color: red;
background: #fff;
box-shadow: red 0 0 0 1px;
}
form[data-members-form] .gh-button {
position: relative;
min-width: 120px;
}
/*-- Loading --*/
/* Hide button text */
form[data-members-form].loading .gh-button-content {
visibility: hidden;
}
/* Show loading spinner */
form[data-members-form].loading .gh-button-loader {
display: inline-block;
position: absolute;
left: 50%;
bottom: -30%;
margin: 0 0 0 -19px;
transform: scale(0.6);
}
.gh-button-loader svg path,
.gh-button-loader svg rect{
fill: #fff;
}
/*-- Show success message on success --*/
form[data-members-form].success .message-success {
display: block;
}
/*-- Show error message on error --*/
form[data-members-form].error .message-error {
display: block;
}

View file

@ -1,50 +0,0 @@
/* Read More
/* ---------------------------------------------------------- */
.gh-readmore {
padding: 8vmin 4vw;
font-size: 2.6rem;
}
.gh-readmore-inner {
display: grid;
grid-gap: 8vmin;
grid-template-columns: 1fr 1fr;
}
.gh-readmore-prev {
justify-content: flex-end;
text-align: right;
}
.gh-readmore a {
display: flex;
color: currentColor;
text-decoration: none;
}
.gh-readmore h4 {
width: 100%;
font-size: inherit;
}
.gh-readmore svg {
display: inline-block;
vertical-align: middle;
height: 1em;
margin: 0.15em 0 0;
}
.gh-readmore svg + h4,
.gh-readmore h4 + svg {
margin-left: 2vmin;
}
@media (max-width: 700px) {
.gh-readmore {
font-size: 1.6rem;
}
.gh-readmore svg {
margin: 0.1em 0 0;
}
}

View file

@ -1,238 +0,0 @@
/*
This is a development CSS file which is compiled to a minified
production stylesheet in assets/built/screen.css using: gulp dev
*/
/* Lib - Local component imports
/* ---------------------------------------------------------- */
/* Base components */
@import "vars.css";
@import "components/global.css";
@import "components/forms.css";
@import "components/buttons.css";
/* Ghost components */
@import "ghost/header.css";
@import "ghost/content.css";
@import "ghost/readmore.css";
@import "ghost/members.css";
@import "ghost/errors.css";
@import "ghost/footer.css";
@import "ghost/badge.css";
/* Main - Your styles here! Edit below
/* ---------------------------------------------------------- */
html,
.gh-viewport {
display: flex;
flex-direction: column;
min-height: 100vh;
background: #fff;
}
.gh-main {
flex: 1 0 auto;
display: flex;
flex-direction: column;
}
.gh-page {
padding: 0 4vw;
}
.gh-article {
padding: 8vmin 0;
}
.gh-postfeed {
padding: 8vmin 0;
}
.gh-container {
width: 100%;
max-width: 1200px;
margin: 0 auto;
}
.gh-head-actions a {
display: inline-flex;
align-items: center;
margin: 0;
padding: 10px;
}
.gh-head-actions a svg {
height: 1.8rem;
fill: currentcolor;
}
.gh-head-actions a:first-child svg {
margin-left: 20px;
}
.gh-head-actions a:last-child svg {
height: 2rem;
}
/* Index
/* ---------------------------------------------------------- */
.gh-card:not(:first-child) {
margin: 8vmin auto 0;
}
.gh-card-link {
display: flex;
flex-direction: column;
}
.gh-card-image {
width: 100%;
max-height: 700px;
object-fit: cover;
margin-bottom: 4vmin;
}
.gh-card-meta {
display: block;
margin: 0 0 1rem;
font-size: 1.4rem;
line-height: 1.2em;
letter-spacing: 0.5px;
text-transform: uppercase;
opacity: 0.8;
}
.gh-card-content {
max-width: 720px;
margin: 0 auto;
text-align: center;
font-size: 1.6rem;
}
.gh-card-content p {
margin: 1.2rem 0;
padding: 0 6vmin;
}
.gh-card-content > strong {
display: inline-block;
padding: 1px 0;
font-weight: 500;
box-shadow: 0 -1px 0 0 inset currentColor;
opacity: 0.5;
}
/* Page
/* ---------------------------------------------------------- */
.gh-page-head {
margin: 0 auto;
padding: 8vmin 0 4vmin;
text-align: center;
}
.gh-page-image {
margin: 4vmin 0 0 0;
}
.gh-page-head > p {
max-width: 720px;
margin: 0.3em auto 0;
padding: 0 6vmin;
font-size: 1.3em;
line-height: 1.4em;
opacity: 0.5;
}
@media (max-width: 700px) {
.gh-page-head > p {
font-size: 1.6rem;
}
}
/* Post
/* ---------------------------------------------------------- */
.gh-header {
padding: 0 0 8vmin 0;
text-align: center;
}
.gh-post-meta {
display: block;
margin: 0 0 1rem;
font-size: 1.4rem;
letter-spacing: 0.5px;
text-transform: uppercase;
opacity: 0.8;
}
.gh-excerpt {
margin: 1rem 0 0 0;
}
.gh-feature-image {
grid-column: wide-start / wide-end;
width: 100%;
margin: 8vmin 0 0;
}
.gh-post-footer {
margin: 2rem 0;
}
/* Author Archive
/* ---------------------------------------------------------- */
.gh-author-image {
height: 12vmin;
width: 12vmin;
margin: 0 auto 1.5em;
border-radius: 100%;
overflow: hidden;
object-fit: cover;
}
.gh-author-meta {
margin: 2vmin 0 0 0;
font-size: 1.2em;
}
.gh-author-links {
display: flex;
align-items: center;
justify-content: center;
}
.gh-author-links a {
position: relative;
display: inline-flex;
align-items: center;
margin: 0 0.75vmin;
}
.gh-author-links a + a:before {
display: block;
content: "";
margin: 0 1.25vmin 0 0;
height: 1em;
width: 1px;
background: rgba(0,0,0,0.3);
transform: rotate(20deg);
}
@media (max-width: 700px) {
.gh-author-meta {
font-size: 1.6rem;
}
}

View file

@ -1,33 +0,0 @@
/* Variables
/* ---------------------------------------------------------- */
:root {
/* Colours */
--color-primary: #3eb0ef;
--color-base: #131313;
--color-border: #ddd;
--color-bg: #f5f5f5;
/* Fonts */
--font-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
--font-serif: Georgia, Times, serif;
--font-mono: Menlo, Courier, monospace;
--font-light: 100;
--font-normal: 400;
--font-bold: 700;
--font-heavy: 800;
/* Breakpoints */
--xlarge: 1680px;
--large: 1280px;
--medium: 980px;
--small: 740px;
--xsmall: 480px;
/* Sizes */
--height: 4rem;
--margin: 2rem;
--radius: 0.5rem;
}

View file

@ -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();
});

View file

@ -1,89 +0,0 @@
/*jshint browser:true */
/*!
* FitVids 1.3
*
*
* 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 MIT license
*
*/
;(function( $ ){
'use strict';
$.fn.fitVids = function( options ) {
var settings = {
customSelector: null,
ignore: null
};
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-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]);
}
if ( options ) {
$.extend( settings, options );
}
return this.each(function(){
var selectors = [
'iframe[src*="player.vimeo.com"]',
'iframe[src*="youtube.com"]',
'iframe[src*="youtube-nocookie.com"]',
'iframe[src*="kickstarter.com"][src*="video.html"]',
'object',
'embed'
];
if (settings.customSelector) {
selectors.push(settings.customSelector);
}
var ignoreList = '.fitvidsignore';
if(settings.ignore) {
ignoreList = ignoreList + ', ' + settings.ignore;
}
var $allVideos = $(this).find(selectors.join(','));
$allVideos = $allVideos.not('object object'); // SwfObj conflict patch
$allVideos = $allVideos.not(ignoreList); // Disable FitVids on this video.
$allVideos.each(function(){
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.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(),
width = !isNaN(parseInt($this.attr('width'), 10)) ? parseInt($this.attr('width'), 10) : $this.width(),
aspectRatio = height / width;
if(!$this.attr('name')){
var videoName = 'fitvid' + $.fn.fitVids._count;
$this.attr('name', videoName);
$.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.removeAttr('height').removeAttr('width');
});
});
};
// Internal counter for unique video names.
$.fn.fitVids._count = 0;
// Works with either jQuery or Zepto
})( window.jQuery || window.Zepto );

Binary file not shown.

Before

Width:  |  Height:  |  Size: 13 KiB

View file

@ -1,46 +0,0 @@
{{!< default}}
<div class="gh-page">
<div class="gh-container">
{{#author}}
<header class="gh-page-head">
{{#if profile_image}}
<img class="gh-author-image" src="{{profile_image}}" alt="{{name}}" />
{{/if}}
<h1>{{name}}</h1>
{{#if bio}}
<p>{{bio}}</p>
{{/if}}
<div class="gh-author-meta">
<div class="gh-author-links">
{{#if website}}
<a href="{{website}}" target="_blank" rel="noopener">Website</a>
{{/if}}
{{#if twitter}}
<a href="{{twitter_url}}" target="_blank" rel="noopener">Twitter</a>
{{/if}}
{{#if facebook}}
<a href="{{facebook_url}}" target="_blank" rel="noopener">Facebook</a>
{{/if}}
</div>
</div>
{{#if cover_image}}
<img class="gh-page-image" src="{{cover_image}}" alt="{{name}}" />
{{/if}}
</header>
{{/author}}
<div class="gh-postfeed">
{{#foreach posts}}
{{> "card"}} {{!-- partials/card.hbs --}}
{{/foreach}}
</div>
</div>
</div>

View file

@ -1,116 +1,86 @@
<!DOCTYPE html>
<html lang="{{@site.lang}}">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<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"}}" />
<title>{{meta_title}}</title>
{{ghost_head}}
{{!-- Outputs SEO meta+structured data and important settings, should always be in <head> --}}
<style>
body {
font-family: Verdana, sans-serif;
margin: auto;
padding: 20px;
max-width: 720px;
text-align: left;
background-color: white;
word-wrap: break-word;
overflow-wrap: break-word;
}
a {
/* color: #eba613; */
color: #3273dc;
}
h2 a {
font-weight: 400;
color: #000;
text-decoration: none;
}
nav a {
margin-right: 10px;
}
textarea {
width: 100%;
font-size: 0.8em;
}
table {
width: 100%;
}
img {
max-width: 100%;
}
pre code {
background-color: #eee;
border-left: 1px solid #999;
display: block;
padding: 15px;
white-space: pre-wrap;
}
footer {
padding: 25px;
text-align: center;
}
</style>
</head>
<body class="{{body_class}}">
<div class="gh-viewport">
<header id="gh-head" class="gh-head">
<nav class="gh-head-inner gh-container">
<div class="gh-head-brand">
<a class="gh-head-logo" href="{{@site.url}}">
{{#if @site.logo}}
<img src="{{@site.logo}}" alt="{{@site.title}}" />
{{else}}
{{@site.title}}
{{/if}}
</a>
<a class="gh-burger" role="button">
<div class="gh-burger-box">
<div class="gh-burger-inner"></div>
</div>
</a>
</div>
<div class="gh-head-menu">
{{navigation}}
</div>
<div class="gh-head-actions">
<div class="gh-head-actions-list">
{{#if @site.facebook}}
<a href="{{facebook_url @site.facebook}}" title="Facebook" target="_blank" rel="noopener">{{> "icons/facebook"}}</a>
{{/if}}
{{#if @site.twitter}}
<a href="{{twitter_url @site.twitter}}" title="Twitter" target="_blank" rel="noopener">{{> "icons/twitter"}}</a>
{{/if}}
<a href="https://feedly.com/i/subscription/feed/{{@site.url}}/rss/" title="RSS" target="_blank" rel="noopener">{{> "icons/rss"}}</a>
</div>
</div>
</nav>
<header>
<h2>{{@site.title}}</h2>
{{navigation}}
</header>
<main class="gh-main">
<main>
{{{body}}}
{{!-- All content gets inserted here, index.hbs, post.hbs, etc --}}
</main>
<footer class="gh-foot">
<div class="gh-container">
<div class="gh-foot-menu">
{{navigation}}
</div>
<div class="gh-foot-meta">
Published with <a href="https://ghost.org" target="_blank" rel="noopener">Ghost</a>
</div>
</div>
<footer>
Made with <a href="https://ghost.org">Ghost</a>
</footer>
</div>
{{!-- <foot> --}}
<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
{{#if pagination.pages}}
<script>
var maxPages = parseInt('{{pagination.pages}}');
</script>
<script src="{{asset "built/infinitescroll.js"}}"></script>
{{/if}}
<script>
$(document).ready(function () {
// Mobile Menu Trigger
$('.gh-burger').click(function () {
$('body').toggleClass('gh-head-open');
});
});
</script>
{{#is "post, page"}}
<script src="{{asset "built/jquery.fitvids.js"}}"></script>
<script>
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%';
});
$(document).ready(function () {
var $postContent = $(".gh-content");
$postContent.fitVids();
});
</script>
{{/is}}
{{ghost_foot}}
{{!-- Outputs important scripts - should always be included before closing body tag --}}
</body>
</html>

View file

@ -1,34 +1,19 @@
{{!< default}}
<section class="gh-page gh-error">
<div class="gh-container">
<h1>{{statusCode}}</h1>
<p>{{message}}</p>
<section class="gh-error-content">
<h1 class="gh-error-code">{{statusCode}}</h1>
<p class="gh-error-description">{{message}}</p>
<p class="gh-error-link"><a href="{{@site.url}}">Go to the front page →</a></p>
{{#if errorDetails}}
<section class="gh-error-stack">
<h4>Theme errors:</h4>
<ul class="gh-error-stack-list">
{{#foreach errorDetails}}
<li>
<h5 class="gh-error-stack-function">{{{rule}}}</h5>
{{#foreach failures}}
<span class="gh-error-stack-file"><strong>Ref:</strong> {{ref}}</span><br>
<span class="gh-error-stack-file"><strong>Message:</strong> {{message}}</span>
{{/foreach}}
</li>
{{/foreach}}
</ul>
</section>
{{/if}}
</section>
</div>
</section>
{{#if errorDetails}}
<ul>
{{#foreach errorDetails}}
<li>
<h5>{{{rule}}}</h5>
{{#foreach failures}}
<span><strong>Ref:</strong> {{ref}}</span><br>
<span><strong>Message:</strong> {{message}}</span>
{{/foreach}}
</li>
{{/foreach}}
</ul>
{{/if}}

View file

@ -1,89 +0,0 @@
const {series, watch, src, dest, parallel} = require('gulp');
const pump = require('pump');
// gulp plugins and utils
var livereload = require('gulp-livereload');
var postcss = require('gulp-postcss');
var zip = require('gulp-zip');
var uglify = require('gulp-uglify');
var beeper = require('beeper');
// 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');
function serve(done) {
livereload.listen();
done();
}
const handleError = (done) => {
return function (err) {
if (err) {
beeper();
}
return done(err);
};
};
function hbs(done) {
pump([
src(['*.hbs', '**/**/*.hbs', '!node_modules/**/*.hbs']),
livereload()
], handleError(done));
}
function css(done) {
var processors = [
easyimport,
customProperties({preserve: false}),
colorFunction(),
autoprefixer(),
cssnano()
];
pump([
src('assets/css/*.css', {sourcemaps: true}),
postcss(processors),
dest('assets/built/', {sourcemaps: '.'}),
livereload()
], handleError(done));
}
function js(done) {
pump([
src('assets/js/*.js', {sourcemaps: true}),
uglify(),
dest('assets/built/', {sourcemaps: '.'}),
livereload()
], handleError(done));
}
function zipper(done) {
var targetDir = 'dist/';
var themeName = require('./package.json').name;
var filename = themeName + '.zip';
pump([
src([
'**',
'!node_modules', '!node_modules/**',
'!dist', '!dist/**'
]),
zip(filename),
dest(targetDir)
], handleError(done));
}
const cssWatcher = () => watch('assets/css/**', css);
const hbsWatcher = () => watch(['*.hbs', '**/**/*.hbs', '!node_modules/**/*.hbs'], hbs);
const watcher = parallel(cssWatcher, hbsWatcher);
const build = series(css, js);
const dev = series(build, serve, watcher);
exports.build = build;
exports.zip = series(build, zipper);
exports.default = dev;

View file

@ -1,15 +1,17 @@
{{!< default}}
<div class="gh-page">
<div class="gh-container">
<ul>
{{#foreach posts}}
<div class="gh-postfeed">
{{#foreach posts}}
<li>
#{{@number}}
<i>
<time datetime="{{date format="YYYY-MM-DD"}}" pubdate>
- {{date format="D MMM, YYYY"}} -
</time>
</i>
<a href="{{url}}">{{title}}</a>
</li>
{{> "card"}} {{!-- partials/card.hbs --}}
{{/foreach}}
</div>
</div>
</div>
{{/foreach}}
</ul>

View file

@ -1,37 +0,0 @@
{{!< ../default}}
<div class="gh-page">
<div class="gh-container">
{{#if @member.paid}}
{{!-- Logged in, paying member: Show account info --}}
<div class="account-box">
<h2 class="account-box-title">Nice, you're a subscriber!</h2>
<p>Hey! <strong>{{@member.email}}</strong> has an active {{@site.title}} account with access to all areas. You're all set, but if you need any help, get in touch with us and we'd be happy to help.</p>
</div>
{{else if @member}}
{{!-- Logged in, not paying: Link to checkout --}}
<div class="account-box">
<h1 class="account-box-title">Currently, you're not a subscriber</h1>
<p>Hey there! <strong>{{@member.email}}</strong> is subscribed to free updates from {{@site.title}}, but doesn't have a paid subscription to unlock full access.</p>
<div class="authbox-signup">
<a class="button primary" href="/signup/">
<span class="button-content">Subscribe now</span>
</a>
</div>
</div>
{{else}}
{{!-- Not logged in: Redirect to signin --}}
<script>window.location = '{{@site.url}}/signin/';</script>
{{/if}}
</div>
</div>
<style>.pico-cta{display:none;}</style>

View file

@ -1,34 +0,0 @@
{{!< ../default}}
<div class="gh-page">
<div class="gh-container">
{{#if @member}}
{{!-- Logged in: Redirect home --}}
<script>window.location = '{{@site.url}}';</script>
{{else}}
{{!-- Not logged in: Signin form --}}
<form class="gh-auth-form" data-members-form="signin">
<h1 class="gh-auth-title">Welcome back!</h1>
<p>Sign into your account again for full access</p>
<div class="gh-auth-box">
<input class="gh-input" data-members-email type="email" placeholder="Your email address" required="true" autocomplete="false" />
<button class="gh-button gh-button-primary" type="submit">
<span class="gh-button-content">Sign in</span>
<span class="gh-button-loader">{{> "icons/loader"}}</span>
</button>
</div>
<p><small>Don't have an account yet? <a href="/signup/">Sign up</a></small></p>
<div class="message-success"><strong>Great!</strong> Check your inbox and click the link to complete signin</div>
<div class="message-error">Please enter a valid email address!</div>
</form>
{{/if}}
</div>
</div>
<style>.pico-cta{display:none;}</style>

View file

@ -1,75 +0,0 @@
{{!< ../default}}
<div class="gh-page">
<div class="gh-container">
{{#if @member.paid}}
{{!-- Logged in, paying member: Redirect home --}}
<script>window.location = '{{@site.url}}';</script>
{{else if @member}}
{{!-- Logged in, not paying: Check out --}}
<div class="gh-checkout-form">
<h1 class="gh-checkout-title">Choose your subscription</h1>
<p>Unlock full access to {{@site.title}} and see the entire library of members-only content & updates</p>
<div class="gh-checkout-box">
<div class="gh-checkout-plan">
<header class="gh-checkout-plan-header">
<h3>Monthly</h3>
<span>$</span><strong>{{@price.monthly}}</strong> / month
</header>
<div class="gh-checkout-plan-content">
<ul>
<li>Full access to all private posts</li>
<li>Regular updates with new content</li>
<li>Support independent publishing</li>
<li>Simple, secure card payment</li>
</ul>
<a class="button primary fit" href="javascript:void(0)" data-members-plan="Monthly">Choose this plan</a>
</div>
</div>
<div class="gh-checkout-plan">
<header class="gh-checkout-plan-header">
<h3>Yearly</h3>
<span>$</span><strong>{{@price.yearly}}</strong> / year
</header>
<div class="gh-checkout-plan-content">
<ul>
<li>Full access to all private posts</li>
<li>Regular updates with new content</li>
<li>Support independent publishing</li>
<li>Simple, secure card payment</li>
<li>One easy payment instead of 12!</li>
</ul>
<a class="button primary fit" href="javascript:void(0)" data-members-plan="Yearly">Choose this plan</a>
</div>
</div>
</div>
</div>
{{else}}
{{!-- Not logged in: Sign up --}}
<form class="gh-auth-form" data-members-form="signup">
<h1 class="gh-auth-title">Signup to {{@site.title}}</h1>
<p>{{@site.description}}</p>
<div class="gh-auth-box">
<input class="gh-input" data-members-email type="email" placeholder="Type your email..." required="true" autocomplete="false" />
<button class="gh-button gh-button-primary" type="submit">
<span class="gh-button-content">Continue</span>
<span class="gh-button-loader">{{> "icons/loader"}}</span>
</button>
</div>
<p><small>Already have an account? <a href="/signin/">Sign in</a></small></p>
<div class="message-success"><strong>Great!</strong> Check your inbox and click the link to confirm your subscription</div>
<div class="message-error">Please enter a valid email address!</div>
</form>
{{/if}}
</div>
</div>
<style>.pico-cta{display:none;}</style>

View file

@ -1,23 +1,8 @@
{{!< default}}
{{#post}}
<article class="gh-article {{post_class}}">
<header class="gh-header gh-canvas">
<h1 class="gh-title">{{title}}</h1>
{{#if custom_excerpt}}
<p class="gh-excerpt">{{custom_excerpt}}</p>
{{/if}}
{{#if feature_image}}
<img class="gh-feature-image" src="{{feature_image}}" alt="{{title}}" />
{{/if}}
</header>
<div class="gh-content gh-canvas">
{{content}}
</div>
</article>
{{/post}}
<content>
<h1>{{title}}</h1>
{{content}}
</content>
{{/post}}

View file

@ -1,25 +0,0 @@
{{!--
Re-usable card for linking to posts
--}}
<article class="gh-card {{post_class}} {{#if feature_image}}with-image{{else}}no-image{{/if}}">
<a class="gh-card-link" href="{{url}}">
{{#if feature_image}}
<img class="gh-card-image"
srcset="{{img_url feature_image size="s"}} 300w,
{{img_url feature_image size="m"}} 600w,
{{img_url feature_image size="l"}} 1000w,
{{img_url feature_image size="xl"}} 2000w"
sizes="(max-width: 1000px) 400px, 700px"
src="{{img_url feature_image size="m"}}"
alt="{{title}}"
/>
{{/if}}
<div class="gh-card-content">
<span class="gh-card-meta"><time datetime="{{date format="YYYY-MM-DD"}}">{{date format="D MMM YYYY"}}</time> <span class="bull">&bull;</span> {{reading_time}}</span>
<h2 class="gh-card-title">{{title}}</h2>
<p>{{excerpt}}</p>
<strong>Read more</strong>
</div>
</a>
</article>

View file

@ -1 +0,0 @@
<svg viewBox="0 0 17 27" xmlns="http://www.w3.org/2000/svg"><path d="M15.54 2.426l-13.143 11.5 13.143 11.5" stroke-width="3" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"/></svg>

Before

Width:  |  Height:  |  Size: 233 B

View file

@ -1 +0,0 @@
<svg viewBox="0 0 18 27" xmlns="http://www.w3.org/2000/svg"><path d="M2.397 25.426l13.143-11.5-13.143-11.5" stroke-width="3" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"/></svg>

Before

Width:  |  Height:  |  Size: 234 B

View file

@ -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

View file

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1024 1018"><defs><path d="M.06.04H1024v1017.74H.06z"/></defs><g fill="none" fill-rule="evenodd"><path d="M1024 512C1024 229.23 794.77 0 512 0S0 229.23 0 512c0 255.554 187.231 467.37 432 505.78V660H302V512h130V399.2C432 270.88 508.438 200 625.39 200 681.407 200 740 210 740 210v126h-64.562C611.835 336 592 375.467 592 415.957V512h142l-22.7 148H592v357.78c244.769-38.41 432-250.226 432-505.78" fill="currentColor" /></g></svg>

Before

Width:  |  Height:  |  Size: 520 B

View file

@ -1,11 +0,0 @@
<svg version="1.1" id="loader-1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
y="0px" width="40px" height="40px" viewBox="0 0 40 40" enable-background="new 0 0 40 40" xml:space="preserve">
<path opacity="0.2" fill="#000" d="M20.201,5.169c-8.254,0-14.946,6.692-14.946,14.946c0,8.255,6.692,14.946,14.946,14.946
s14.946-6.691,14.946-14.946C35.146,11.861,28.455,5.169,20.201,5.169z M20.201,31.749c-6.425,0-11.634-5.208-11.634-11.634
c0-6.425,5.209-11.634,11.634-11.634c6.425,0,11.633,5.209,11.633,11.634C31.834,26.541,26.626,31.749,20.201,31.749z" />
<path fill="#000" d="M26.013,10.047l1.654-2.866c-2.198-1.272-4.743-2.012-7.466-2.012h0v3.312h0
C22.32,8.481,24.301,9.057,26.013,10.047z">
<animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0 20 20" to="360 20 20"
dur="0.5s" repeatCount="indefinite" />
</path>
</svg>

Before

Width:  |  Height:  |  Size: 923 B

View file

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22"><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

View file

@ -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

View file

@ -1,53 +1,8 @@
{{!< default}}
{{#post}}
<article class="gh-article {{post_class}}">
<header class="gh-header gh-canvas">
<span class="gh-post-meta"><time datetime="{{date format="YYYY-MM-DD"}}">{{date format="D MMM YYYY"}}</time> <span class="bull">&bull;</span> {{reading_time}}</span>
<h1 class="gh-title">{{title}}</h1>
{{#if custom_excerpt}}
<p class="gh-excerpt">{{custom_excerpt}}</p>
{{/if}}
{{#if feature_image}}
<img class="gh-feature-image" src="{{feature_image}}" alt="{{title}}" />
{{/if}}
</header>
<div class="gh-content gh-canvas">
{{content}}
</div>
<footer class="gh-footer gh-canvas">
<div class="gh-post-authors">
Written by {{#foreach authors}}<a href="{{url}}">{{name}}</a>{{/foreach}}
</div>
{{!--
<section class="gh-post-comments">
If you want to embed comments, this is a good place to do it!
</section>
--}}
</footer>
</article>
<aside class="gh-readmore">
<div class="gh-readmore-inner gh-container">
<div class="gh-readmore-next">
{{#next_post}}<a href="{{url}}">{{> "icons/arrow-left"}} <h4>{{title}}</h4></a>{{/next_post}}
</div>
<div class="gh-readmore-prev">
{{#prev_post}}<a href="{{url}}">
<h4>{{title}}</h4> {{> "icons/arrow-right"}}
</a>{{/prev_post}}
</div>
</div>
</aside>
<content>
<h1>{{title}}</h1>
{{content}}
</content>
{{/post}}

View file

@ -1,8 +0,0 @@
{
"extends": [
"@tryghost:theme"
],
"node": {
"supportPolicy": ["lts_latest"]
}
}

35
tag.hbs
View file

@ -1,35 +0,0 @@
{{!< default}}
<div class="gh-page">
<div class="gh-container">
{{#tag}}
<header class="gh-page-head">
<h1>{{name}}</h1>
<p>
{{#if description}}
{{description}}
{{else}}
A collection of {{plural ../pagination.total empty='posts' singular='% post' plural='% posts'}}
{{/if}}
</p>
{{#if feature_image}}
<img class="gh-page-image" src="{{feature_image}}" alt="{{name}}" />
{{/if}}
</header>
{{/tag}}
<div class="gh-postfeed">
{{#foreach posts}}
{{> "card"}} {{!-- partials/card.hbs --}}
{{/foreach}}
</div>
</div>
</div>

5987
yarn.lock

File diff suppressed because it is too large Load diff