Initial commit
This commit is contained in:
commit
1b10a2e2a7
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
|
||||
15
.github/workflows/deploy-theme.yml
vendored
Normal file
15
.github/workflows/deploy-theme.yml
vendored
Normal file
@ -0,0 +1,15 @@
|
||||
name: Deploy Theme
|
||||
on:
|
||||
push:
|
||||
branches:
|
||||
- master
|
||||
jobs:
|
||||
deploy:
|
||||
runs-on: ubuntu-18.04
|
||||
steps:
|
||||
- uses: actions/checkout@v2
|
||||
- name: Deploy Ghost Theme
|
||||
uses: TryGhost/action-deploy-theme@v1.4.0
|
||||
with:
|
||||
api-url: ${{ secrets.GHOST_ADMIN_API_URL }}
|
||||
api-key: ${{ secrets.GHOST_ADMIN_API_KEY }}
|
||||
24
.gitignore
vendored
Normal file
24
.gitignore
vendored
Normal file
@ -0,0 +1,24 @@
|
||||
b-cov
|
||||
*.seed
|
||||
*.log
|
||||
*.csv
|
||||
*.dat
|
||||
*.out
|
||||
*.pid
|
||||
*.gz
|
||||
|
||||
pids
|
||||
logs
|
||||
results
|
||||
|
||||
npm-debug.log
|
||||
node_modules
|
||||
package-lock.json
|
||||
|
||||
.idea/*
|
||||
*.iml
|
||||
projectFilesBackup
|
||||
|
||||
.DS_Store
|
||||
|
||||
dist/
|
||||
22
LICENSE
Normal file
22
LICENSE
Normal file
@ -0,0 +1,22 @@
|
||||
Copyright (c) 2013-2020 Ghost Foundation
|
||||
|
||||
Permission is hereby granted, free of charge, to any person
|
||||
obtaining a copy of this software and associated documentation
|
||||
files (the "Software"), to deal in the Software without
|
||||
restriction, including without limitation the rights to use,
|
||||
copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the
|
||||
Software is furnished to do so, subject to the following
|
||||
conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be
|
||||
included in all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
|
||||
OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
||||
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
|
||||
HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
|
||||
WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
|
||||
OTHER DEALINGS IN THE SOFTWARE.
|
||||
61
README.md
Normal file
61
README.md
Normal file
@ -0,0 +1,61 @@
|
||||
# Ghost Starter 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.
|
||||
- [Color Mod](https://github.com/jonathantneal/postcss-color-mod-function)
|
||||
|
||||
|
||||
|
||||
# Copyright & License
|
||||
|
||||
Copyright (c) 2013-2020 Ghost Foundation - Released under the [MIT license](LICENSE).
|
||||
2
assets/built/infinitescroll.js
Normal file
2
assets/built/infinitescroll.js
Normal file
@ -0,0 +1,2 @@
|
||||
$(function(t){var o=1,r=window.location.pathname,a=t(document),s=t(".gh-postfeed"),c=300,l=!1,w=!1,d=window.scrollY,v=window.innerHeight,u=a.height();function f(){d=window.scrollY,e()}function g(){v=window.innerHeight,u=a.height(),e()}function e(){l||requestAnimationFrame(n),l=!0}function n(){var e,n;if(n=/(?:page\/)(\d)(?:\/)$/i,(e=(e=r).replace(/#(.*)$/g,"").replace("////g","/")).match(n)&&(o=parseInt(e.match(n)[1]),e=e.replace(n,"")),r=e,!w)if(d+v<=u-c)l=!1;else{if(o>=maxPages)return window.removeEventListener("scroll",f,{passive:!0}),void window.removeEventListener("resize",g);w=!0;var i=r+"page/"+(o+=1)+"/";t.get(i,function(e){var n=document.createRange().createContextualFragment(e).querySelectorAll(".post");n.length&&[].forEach.call(n,function(e){s[0].appendChild(e)})}).fail(function(e){404===e.status&&(window.removeEventListener("scroll",f,{passive:!0}),window.removeEventListener("resize",g))}).always(function(){u=a.height(),l=w=!1})}}window.addEventListener("scroll",f,{passive:!0}),window.addEventListener("resize",g),n()});
|
||||
//# sourceMappingURL=infinitescroll.js.map
|
||||
1
assets/built/infinitescroll.js.map
Normal file
1
assets/built/infinitescroll.js.map
Normal file
File diff suppressed because one or more lines are too long
2
assets/built/jquery-3.4.1.min.js
vendored
Normal file
2
assets/built/jquery-3.4.1.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
assets/built/jquery-3.4.1.min.js.map
Normal file
1
assets/built/jquery-3.4.1.min.js.map
Normal file
File diff suppressed because one or more lines are too long
2
assets/built/jquery.fitvids.js
Normal file
2
assets/built/jquery.fitvids.js
Normal file
@ -0,0 +1,2 @@
|
||||
!function(o){"use strict";o.fn.fitVids=function(t){var e,i,d={customSelector:null,ignore:null};return document.getElementById("fit-vids-style")||(e=document.head||document.getElementsByTagName("head")[0],(i=document.createElement("div")).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(i.childNodes[1])),t&&o.extend(d,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"];d.customSelector&&t.push(d.customSelector);var r=".fitvidsignore";d.ignore&&(r=r+", "+d.ignore);var e=o(this).find(t.join(","));(e=(e=e.not("object object")).not(r)).each(function(){var t,e,i=o(this);0<i.parents(r).length||"embed"===this.tagName.toLowerCase()&&i.parent("object").length||i.parent(".fluid-width-video-wrapper").length||(i.css("height")||i.css("width")||!isNaN(i.attr("height"))&&!isNaN(i.attr("width"))||(i.attr("height",9),i.attr("width",16)),t=("object"===this.tagName.toLowerCase()||i.attr("height")&&!isNaN(parseInt(i.attr("height"),10))?parseInt(i.attr("height"),10):i.height())/(isNaN(parseInt(i.attr("width"),10))?i.width():parseInt(i.attr("width"),10)),i.attr("name")||(e="fitvid"+o.fn.fitVids._count,i.attr("name",e),o.fn.fitVids._count++),i.wrap('<div class="fluid-width-video-container"><div class="fluid-width-video-wrapper"></div></div>').parent(".fluid-width-video-wrapper").css("padding-top",100*t+"%"),i.removeAttr("height").removeAttr("width"))})})},o.fn.fitVids._count=0}(window.jQuery||window.Zepto);
|
||||
//# sourceMappingURL=jquery.fitvids.js.map
|
||||
1
assets/built/jquery.fitvids.js.map
Normal file
1
assets/built/jquery.fitvids.js.map
Normal file
File diff suppressed because one or more lines are too long
2
assets/built/screen.css
Normal file
2
assets/built/screen.css
Normal file
File diff suppressed because one or more lines are too long
1
assets/built/screen.css.map
Normal file
1
assets/built/screen.css.map
Normal file
File diff suppressed because one or more lines are too long
2
assets/built/vars.css
Normal file
2
assets/built/vars.css
Normal file
@ -0,0 +1,2 @@
|
||||
:root{--color-primary:#3eb0ef;--color-base:#131313;--color-border:#ddd;--color-bg:#f5f5f5;--color-success:#80b912;--color-error:#f05230;--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;--xlarge:1680px;--large:1280px;--medium:980px;--small:740px;--xsmall:480px;--height:4rem;--margin:2rem;--radius:0.5rem}
|
||||
/*# sourceMappingURL=vars.css.map */
|
||||
1
assets/built/vars.css.map
Normal file
1
assets/built/vars.css.map
Normal file
@ -0,0 +1 @@
|
||||
{"version":3,"sources":["vars.css"],"names":[],"mappings":"AAGA,MAGI,uBAAwB,CACxB,oBAAqB,CACrB,mBAAoB,CACpB,kBAAmB,CACnB,uBAAwB,CACxB,qBAAsB,CAGtB,yJAAoK,CACpK,gCAAmC,CACnC,mCAAsC,CACtC,gBAAiB,CACjB,iBAAkB,CAClB,eAAgB,CAChB,gBAAiB,CAGjB,eAAgB,CAChB,cAAe,CACf,cAAe,CACf,aAAc,CACd,cAAe,CAGf,aAAc,CACd,aAAc,CACd,eAEJ","file":"vars.css","sourcesContent":["/* Variables\n/* ---------------------------------------------------------- */\n\n:root {\n\n /* Colours */\n --color-primary: #3eb0ef;\n --color-base: #131313;\n --color-border: #ddd;\n --color-bg: #f5f5f5;\n --color-success: #80b912;\n --color-error: #f05230;\n\n /* Fonts */\n --font-sans-serif: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Roboto\", \"Oxygen\", \"Ubuntu\", \"Cantarell\", \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\", sans-serif;\n --font-serif: Georgia, Times, serif;\n --font-mono: Menlo, Courier, monospace;\n --font-light: 100;\n --font-normal: 400;\n --font-bold: 700;\n --font-heavy: 800;\n\n /* Breakpoints */\n --xlarge: 1680px;\n --large: 1280px;\n --medium: 980px;\n --small: 740px;\n --xsmall: 480px;\n\n /* Sizes */\n --height: 4rem;\n --margin: 2rem;\n --radius: 0.5rem;\n\n}\n"]}
|
||||
68
assets/css/components/buttons.css
Normal file
68
assets/css/components/buttons.css
Normal file
@ -0,0 +1,68 @@
|
||||
/* 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-mod(var(--color-primary) l(-15%)) !important;
|
||||
box-shadow: inset 0 0 0 2px color-mod(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-mod(var(--color-primary) l(-10%));
|
||||
}
|
||||
108
assets/css/components/forms.css
Normal file
108
assets/css/components/forms.css
Normal file
@ -0,0 +1,108 @@
|
||||
/* 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%;
|
||||
}
|
||||
197
assets/css/components/global.css
Normal file
197
assets/css/components/global.css
Normal file
@ -0,0 +1,197 @@
|
||||
/* 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-mod(var(--color-base) l(+20%));
|
||||
font-family: var(--font-sans-serif);
|
||||
font-size: 1.5rem;
|
||||
line-height: 1.6em;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
background: #fff;
|
||||
scroll-behavior: smooth;
|
||||
-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;
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
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;
|
||||
}
|
||||
|
||||
ul:not([class]) li + li {
|
||||
margin-top: 0.6em;
|
||||
}
|
||||
|
||||
a:not([class]) {
|
||||
color: color-mod(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;
|
||||
}
|
||||
}
|
||||
24
assets/css/ghost/badge.css
Normal file
24
assets/css/ghost/badge.css
Normal file
@ -0,0 +1,24 @@
|
||||
a.gh-powered,
|
||||
a.gh-powered:hover {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 6px 9px 6px 6px;
|
||||
border: none;
|
||||
font-size: 12px;
|
||||
line-height: 12px;
|
||||
letter-spacing: -0.3px;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
color: #383838;
|
||||
background: #fff;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 0 1px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.08);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
a.gh-powered svg {
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
margin: 0 6px 0 0;
|
||||
}
|
||||
397
assets/css/ghost/content.css
Normal file
397
assets/css/ghost/content.css
Normal file
@ -0,0 +1,397 @@
|
||||
|
||||
|
||||
/* 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]
|
||||
4vmin
|
||||
[wide-start]
|
||||
auto
|
||||
[main-start]
|
||||
720px
|
||||
[main-end]
|
||||
auto
|
||||
[wide-end]
|
||||
4vmin
|
||||
[full-end]
|
||||
;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 778px) {
|
||||
.gh-canvas {
|
||||
grid-template-columns:
|
||||
[full-start]
|
||||
4vmin
|
||||
[wide-start]
|
||||
0
|
||||
[main-start]
|
||||
auto
|
||||
[main-end]
|
||||
0
|
||||
[wide-end]
|
||||
4vmin
|
||||
[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]:not(:first-child) {
|
||||
margin: 1.5em 0 0;
|
||||
}
|
||||
|
||||
.gh-content > [id] + * {
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
||||
.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: -4vmin;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Cards
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
.gh-content :not(.kg-card):not([id]) + .kg-card {
|
||||
margin-top: 6vmin;
|
||||
}
|
||||
|
||||
.gh-content .kg-card + :not(.kg-card) {
|
||||
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);
|
||||
}
|
||||
60
assets/css/ghost/errors.css
Normal file
60
assets/css/ghost/errors.css
Normal file
@ -0,0 +1,60 @@
|
||||
/* 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;
|
||||
}
|
||||
57
assets/css/ghost/footer.css
Normal file
57
assets/css/ghost/footer.css
Normal file
@ -0,0 +1,57 @@
|
||||
/* Global Footer
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
.gh-foot {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 8vmin 4vmin;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
}
|
||||
328
assets/css/ghost/header.css
Normal file
328
assets/css/ghost/header.css
Normal file
@ -0,0 +1,328 @@
|
||||
/* Global Header
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
.gh-head {
|
||||
padding: 3vmin 4vmin;
|
||||
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.5vmin 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.5vmin;
|
||||
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.5vmin;
|
||||
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;
|
||||
}
|
||||
}
|
||||
141
assets/css/ghost/members.css
Normal file
141
assets/css/ghost/members.css
Normal file
@ -0,0 +1,141 @@
|
||||
/* 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: var(--color-error);
|
||||
}
|
||||
|
||||
form[data-members-form].success .message-success,
|
||||
form[data-members-form].error .message-error {
|
||||
position: fixed;
|
||||
top: 20px;
|
||||
left: 4vmin;
|
||||
right: 4vmin;
|
||||
z-index: 9999;
|
||||
max-width: calc(1400px - 8vmin);
|
||||
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: var(--color-error);
|
||||
background: #fff;
|
||||
box-shadow: var(--color-error) 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;
|
||||
}
|
||||
50
assets/css/ghost/readmore.css
Normal file
50
assets/css/ghost/readmore.css
Normal file
@ -0,0 +1,50 @@
|
||||
/* Read More
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
.gh-readmore {
|
||||
padding: 8vmin 4vmin;
|
||||
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;
|
||||
}
|
||||
}
|
||||
238
assets/css/screen.css
Normal file
238
assets/css/screen.css
Normal file
@ -0,0 +1,238 @@
|
||||
/*
|
||||
|
||||
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 4vmin;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
}
|
||||
35
assets/css/vars.css
Normal file
35
assets/css/vars.css
Normal file
@ -0,0 +1,35 @@
|
||||
/* Variables
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
:root {
|
||||
|
||||
/* Colours */
|
||||
--color-primary: #3eb0ef;
|
||||
--color-base: #131313;
|
||||
--color-border: #ddd;
|
||||
--color-bg: #f5f5f5;
|
||||
--color-success: #80b912;
|
||||
--color-error: #f05230;
|
||||
|
||||
/* 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;
|
||||
|
||||
}
|
||||
115
assets/js/infinitescroll.js
Normal file
115
assets/js/infinitescroll.js
Normal file
@ -0,0 +1,115 @@
|
||||
/* 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 = $('.gh-postfeed');
|
||||
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();
|
||||
});
|
||||
2
assets/js/jquery-3.4.1.min.js
vendored
Normal file
2
assets/js/jquery-3.4.1.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
89
assets/js/jquery.fitvids.js
Normal file
89
assets/js/jquery.fitvids.js
Normal file
@ -0,0 +1,89 @@
|
||||
/*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 );
|
||||
BIN
assets/screenshot-desktop.jpg
Normal file
BIN
assets/screenshot-desktop.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
46
author.hbs
Normal file
46
author.hbs
Normal file
@ -0,0 +1,46 @@
|
||||
{{!< 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 visibility="all"}}
|
||||
|
||||
{{> "card"}} {{!-- partials/card.hbs --}}
|
||||
|
||||
{{/foreach}}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
115
default.hbs
Normal file
115
default.hbs
Normal file
@ -0,0 +1,115 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="{{@site.lang}}">
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="{{asset "built/screen.css"}}" />
|
||||
|
||||
<title>{{meta_title}}</title>
|
||||
|
||||
{{ghost_head}}
|
||||
{{!-- Outputs important meta data and settings, should always be in <head> --}}
|
||||
|
||||
</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>
|
||||
|
||||
<main class="gh-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>
|
||||
|
||||
</div>
|
||||
|
||||
{{!-- <foot> --}}
|
||||
|
||||
<script src="{{asset "built/jquery-3.4.1.min.js"}}"></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>
|
||||
34
error.hbs
Normal file
34
error.hbs
Normal file
@ -0,0 +1,34 @@
|
||||
|
||||
{{!< default}}
|
||||
|
||||
<section class="gh-page gh-error">
|
||||
<div class="gh-container">
|
||||
|
||||
<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>
|
||||
87
gulpfile.js
Normal file
87
gulpfile.js
Normal file
@ -0,0 +1,87 @@
|
||||
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-mod-function');
|
||||
var cssnano = require('cssnano');
|
||||
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,
|
||||
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;
|
||||
15
index.hbs
Normal file
15
index.hbs
Normal file
@ -0,0 +1,15 @@
|
||||
{{!< default}}
|
||||
|
||||
<div class="gh-page">
|
||||
<div class="gh-container">
|
||||
|
||||
<div class="gh-postfeed">
|
||||
{{#foreach posts visibility="all"}}
|
||||
|
||||
{{> "card"}} {{!-- partials/card.hbs --}}
|
||||
|
||||
{{/foreach}}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
35
members/account.hbs
Normal file
35
members/account.hbs
Normal file
@ -0,0 +1,35 @@
|
||||
{{!< ../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>
|
||||
32
members/signin.hbs
Normal file
32
members/signin.hbs
Normal file
@ -0,0 +1,32 @@
|
||||
{{!< ../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 aria-label="Email Address" class="gh-input" data-members-email type="email" placeholder="Your email address" required="true" autocomplete="false" autofocus />
|
||||
<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>
|
||||
73
members/signup.hbs
Normal file
73
members/signup.hbs
Normal file
@ -0,0 +1,73 @@
|
||||
{{!< ../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 aria-label="Email Address" class="gh-input" data-members-email type="email" placeholder="youremail@example.com" required="true" autocomplete="false" autofocus />
|
||||
<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>
|
||||
87
package.json
Normal file
87
package.json
Normal file
@ -0,0 +1,87 @@
|
||||
{
|
||||
"name": "ghost-starter-theme",
|
||||
"description": "A custom theme for ghost",
|
||||
"demo": "https://starter.ghost.io",
|
||||
"version": "1.0.0",
|
||||
"engines": {
|
||||
"ghost": ">=3.0.0",
|
||||
"ghost-api": "v3"
|
||||
},
|
||||
"license": "MIT",
|
||||
"screenshots": {
|
||||
"desktop": "assets/screenshot-desktop.jpg"
|
||||
},
|
||||
"scripts": {
|
||||
"dev": "gulp",
|
||||
"zip": "gulp zip",
|
||||
"test": "gscan .",
|
||||
"test:ci": "gscan --fatal --verbose .",
|
||||
"pretest": "gulp build",
|
||||
"preship": "yarn test",
|
||||
"ship": "STATUS=$(git status --porcelain); echo $STATUS; if [ -z \"$STATUS\" ]; then yarn version && git push --follow-tags; fi"
|
||||
},
|
||||
"author": {
|
||||
"name": "Ghost Foundation",
|
||||
"email": "hello@ghost.org",
|
||||
"url": "https://ghost.org"
|
||||
},
|
||||
"gpm": {
|
||||
"type": "theme",
|
||||
"categories": [
|
||||
"Minimal",
|
||||
"Magazine"
|
||||
]
|
||||
},
|
||||
"keywords": [
|
||||
"ghost",
|
||||
"theme",
|
||||
"ghost-theme"
|
||||
],
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/TryGhost/Starter.git"
|
||||
},
|
||||
"bugs": "https://github.com/TryGhost/Starter/issues",
|
||||
"contributors": "https://github.com/TryGhost/Starter/graphs/contributors",
|
||||
"devDependencies": {
|
||||
"autoprefixer": "9.8.3",
|
||||
"cssnano": "4.1.10",
|
||||
"gscan": "3.5.4",
|
||||
"gulp": "4.0.2",
|
||||
"gulp-livereload": "4.0.2",
|
||||
"gulp-postcss": "8.0.0",
|
||||
"gulp-sourcemaps": "2.6.5",
|
||||
"gulp-uglify": "3.0.2",
|
||||
"gulp-util": "3.0.8",
|
||||
"gulp-watch": "5.0.1",
|
||||
"gulp-zip": "5.0.2",
|
||||
"postcss-color-mod-function": "3.0.3",
|
||||
"postcss-easy-import": "3.0.0"
|
||||
},
|
||||
"browserslist": [
|
||||
"defaults"
|
||||
],
|
||||
"config": {
|
||||
"posts_per_page": 15,
|
||||
"image_sizes": {
|
||||
"xxs": {
|
||||
"width": 30
|
||||
},
|
||||
"xs": {
|
||||
"width": 100
|
||||
},
|
||||
"s": {
|
||||
"width": 300
|
||||
},
|
||||
"m": {
|
||||
"width": 600
|
||||
},
|
||||
"l": {
|
||||
"width": 1200
|
||||
},
|
||||
"xl": {
|
||||
"width": 2000
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
23
page.hbs
Normal file
23
page.hbs
Normal file
@ -0,0 +1,23 @@
|
||||
{{!< 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}}
|
||||
25
partials/card.hbs
Normal file
25
partials/card.hbs
Normal file
@ -0,0 +1,25 @@
|
||||
{{!--
|
||||
Re-usable card for linking to posts
|
||||
--}}
|
||||
|
||||
<article class="gh-card {{post_class}}">
|
||||
<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">•</span> {{reading_time}}</span>
|
||||
<h2 class="gh-card-title">{{title}}</h2>
|
||||
<p>{{excerpt}}</p>
|
||||
<strong>Read more</strong>
|
||||
</div>
|
||||
</a>
|
||||
</article>
|
||||
1
partials/icons/arrow-left.hbs
Normal file
1
partials/icons/arrow-left.hbs
Normal file
@ -0,0 +1 @@
|
||||
<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>
|
||||
|
After Width: | Height: | Size: 233 B |
1
partials/icons/arrow-right.hbs
Normal file
1
partials/icons/arrow-right.hbs
Normal file
@ -0,0 +1 @@
|
||||
<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>
|
||||
|
After Width: | Height: | Size: 234 B |
1
partials/icons/avatar.hbs
Normal file
1
partials/icons/avatar.hbs
Normal file
@ -0,0 +1 @@
|
||||
<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>
|
||||
|
After Width: | Height: | Size: 308 B |
1
partials/icons/facebook.hbs
Normal file
1
partials/icons/facebook.hbs
Normal file
@ -0,0 +1 @@
|
||||
<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>
|
||||
|
After Width: | Height: | Size: 520 B |
11
partials/icons/loader.hbs
Normal file
11
partials/icons/loader.hbs
Normal file
@ -0,0 +1,11 @@
|
||||
<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>
|
||||
|
After Width: | Height: | Size: 923 B |
1
partials/icons/rss.hbs
Normal file
1
partials/icons/rss.hbs
Normal file
@ -0,0 +1 @@
|
||||
<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>
|
||||
|
After Width: | Height: | Size: 263 B |
1
partials/icons/twitter.hbs
Normal file
1
partials/icons/twitter.hbs
Normal file
@ -0,0 +1 @@
|
||||
<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>
|
||||
|
After Width: | Height: | Size: 888 B |
62
post.hbs
Normal file
62
post.hbs
Normal file
@ -0,0 +1,62 @@
|
||||
{{!< 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">•</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"
|
||||
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) 1000px, 2000px"
|
||||
loading="lazy"
|
||||
src="{{img_url feature_image size="xl"}}"
|
||||
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>
|
||||
|
||||
{{/post}}
|
||||
8
renovate.json
Normal file
8
renovate.json
Normal file
@ -0,0 +1,8 @@
|
||||
{
|
||||
"extends": [
|
||||
"@tryghost:theme"
|
||||
],
|
||||
"node": {
|
||||
"supportPolicy": ["lts_latest"]
|
||||
}
|
||||
}
|
||||
35
tag.hbs
Normal file
35
tag.hbs
Normal file
@ -0,0 +1,35 @@
|
||||
{{!< 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 visibility="all"}}
|
||||
|
||||
{{> "card"}} {{!-- partials/card.hbs --}}
|
||||
|
||||
{{/foreach}}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
Loading…
Reference in New Issue
Block a user