mirror of
https://github.com/GenZmeY/casper-i18n.git
synced 2025-07-12 16:56:06 +00:00
Compare commits
30 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| a7d5c885bd | |||
| 9bc5c92628 | |||
| 0f3651c23f | |||
| d739bb52a4 | |||
| 8d17e9a452 | |||
| e4e6bb9c5a | |||
| d2375a3917 | |||
| 577b92811c | |||
| 2f385ba5f1 | |||
| b024b544e4 | |||
| 9caeb2a2e7 | |||
| 12d139aa7d | |||
| 690e1bad1f | |||
| c63804006d | |||
| 65d0104224 | |||
| ba10cb1516 | |||
| d7ca6fd2f6 | |||
| 10f11bb14f | |||
| 7d4f93bf23 | |||
| 11f61782ad | |||
| fd108b1b40 | |||
| 33005666ca | |||
| 1767ca59b8 | |||
| 5cafa756ef | |||
| 08e5cbe021 | |||
| 615d8a9001 | |||
| f08f07fd7e | |||
| 2565c16916 | |||
| 4b66223bb3 | |||
| 35e91ecee9 |
19
.github/ISSUE_TEMPLATE.md
vendored
Normal file
19
.github/ISSUE_TEMPLATE.md
vendored
Normal file
@ -0,0 +1,19 @@
|
||||
Do you need help or have a question? Please come chat in Slack: https://ghost.org/slack 👫.
|
||||
|
||||
If you're filing a bug 🐛, please include the following information:
|
||||
|
||||
### Screenshot
|
||||
|
||||
![]()
|
||||
|
||||
### Steps to Reproduce
|
||||
|
||||
1. This is the first step
|
||||
2. This may be the post content used to cause an issue...
|
||||
|
||||
### Technical details
|
||||
|
||||
* Casper Version:
|
||||
* Ghost Version:
|
||||
* Browser Version:
|
||||
* OS Version:
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
240
assets/css/csscomb.json
Normal file
240
assets/css/csscomb.json
Normal file
@ -0,0 +1,240 @@
|
||||
{
|
||||
"remove-empty-rulesets": true,
|
||||
"always-semicolon": true,
|
||||
"color-case": "lower",
|
||||
"block-indent": " ",
|
||||
"color-shorthand": true,
|
||||
"element-case": "lower",
|
||||
"eof-newline": true,
|
||||
"leading-zero": true,
|
||||
"quotes": "double",
|
||||
"space-before-colon": "",
|
||||
"space-after-colon": " ",
|
||||
"space-before-combinator": " ",
|
||||
"space-after-combinator": " ",
|
||||
"space-between-declarations": "\n",
|
||||
"space-before-opening-brace": " ",
|
||||
"space-after-opening-brace": "\n",
|
||||
"space-after-selector-delimiter": "\n",
|
||||
"space-before-selector-delimiter": "",
|
||||
"space-before-closing-brace": "\n",
|
||||
"strip-spaces": true,
|
||||
"tab-size": 4,
|
||||
"unitless-zero": true,
|
||||
"sort-order": [ [
|
||||
"content",
|
||||
"visibility",
|
||||
"position",
|
||||
"top",
|
||||
"right",
|
||||
"bottom",
|
||||
"left",
|
||||
"z-index",
|
||||
"order",
|
||||
"flex",
|
||||
"flex-grow",
|
||||
"flex-shrink",
|
||||
"flex-basis",
|
||||
"align-self",
|
||||
"display",
|
||||
"flex-flow",
|
||||
"flex-direction",
|
||||
"justify-content",
|
||||
"align-items",
|
||||
"align-content",
|
||||
"flex-wrap",
|
||||
"flex-order",
|
||||
"flex-pack",
|
||||
"flex-align",
|
||||
"float",
|
||||
"clear",
|
||||
"box-sizing",
|
||||
"width",
|
||||
"height",
|
||||
"min-width",
|
||||
"min-height",
|
||||
"max-width",
|
||||
"max-height",
|
||||
"overflow",
|
||||
"overflow-x",
|
||||
"overflow-y",
|
||||
"clip",
|
||||
"margin",
|
||||
"margin-top",
|
||||
"margin-right",
|
||||
"margin-bottom",
|
||||
"margin-left",
|
||||
"padding",
|
||||
"padding-top",
|
||||
"padding-right",
|
||||
"padding-bottom",
|
||||
"padding-left",
|
||||
"outline",
|
||||
"outline-width",
|
||||
"outline-style",
|
||||
"outline-color",
|
||||
"outline-offset",
|
||||
"border",
|
||||
"border-spacing",
|
||||
"border-collapse",
|
||||
"border-width",
|
||||
"border-style",
|
||||
"border-color",
|
||||
"border-top",
|
||||
"border-top-width",
|
||||
"border-top-style",
|
||||
"border-top-color",
|
||||
"border-right",
|
||||
"border-right-width",
|
||||
"border-right-style",
|
||||
"border-right-color",
|
||||
"border-bottom",
|
||||
"border-bottom-width",
|
||||
"border-bottom-style",
|
||||
"border-bottom-color",
|
||||
"border-left",
|
||||
"border-left-width",
|
||||
"border-left-style",
|
||||
"border-left-color",
|
||||
"border-image",
|
||||
"border-image-source",
|
||||
"border-image-slice",
|
||||
"border-image-width",
|
||||
"border-image-outset",
|
||||
"border-image-repeat",
|
||||
"border-top-image",
|
||||
"border-right-image",
|
||||
"border-bottom-image",
|
||||
"border-left-image",
|
||||
"border-corner-image",
|
||||
"border-top-left-image",
|
||||
"border-top-right-image",
|
||||
"border-bottom-right-image",
|
||||
"border-bottom-left-image",
|
||||
"table-layout",
|
||||
"caption-side",
|
||||
"empty-cells",
|
||||
"list-style",
|
||||
"list-style-position",
|
||||
"list-style-type",
|
||||
"list-style-image",
|
||||
"quotes",
|
||||
"counter-increment",
|
||||
"counter-reset",
|
||||
"vertical-align",
|
||||
"stroke",
|
||||
"fill",
|
||||
"stroke-width",
|
||||
"stroke-opacity",
|
||||
"color",
|
||||
"font",
|
||||
"font-family",
|
||||
"font-size",
|
||||
"line-height",
|
||||
"font-weight",
|
||||
"font-style",
|
||||
"font-variant",
|
||||
"font-size-adjust",
|
||||
"font-stretch",
|
||||
"text-rendering",
|
||||
"font-feature-settings",
|
||||
"letter-spacing",
|
||||
"hyphens",
|
||||
"text-align",
|
||||
"text-align-last",
|
||||
"text-decoration",
|
||||
"text-emphasis",
|
||||
"text-emphasis-position",
|
||||
"text-emphasis-style",
|
||||
"text-emphasis-color",
|
||||
"text-indent",
|
||||
"text-justify",
|
||||
"text-outline",
|
||||
"text-transform",
|
||||
"text-wrap",
|
||||
"text-overflow",
|
||||
"text-overflow-ellipsis",
|
||||
"text-overflow-mode",
|
||||
"text-shadow",
|
||||
"white-space",
|
||||
"word-spacing",
|
||||
"word-wrap",
|
||||
"word-break",
|
||||
"tab-size",
|
||||
"user-select",
|
||||
"src",
|
||||
"resize",
|
||||
"cursor",
|
||||
"nav-index",
|
||||
"nav-up",
|
||||
"nav-right",
|
||||
"nav-down",
|
||||
"nav-left",
|
||||
"background",
|
||||
"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader",
|
||||
"background-color",
|
||||
"background-image",
|
||||
"background-size",
|
||||
"background-attachment",
|
||||
"background-position",
|
||||
"background-position-x",
|
||||
"background-position-y",
|
||||
"background-clip",
|
||||
"background-origin",
|
||||
"background-repeat",
|
||||
"border-radius",
|
||||
"border-top-left-radius",
|
||||
"border-top-right-radius",
|
||||
"border-bottom-right-radius",
|
||||
"border-bottom-left-radius",
|
||||
"box-decoration-break",
|
||||
"box-shadow",
|
||||
"opacity",
|
||||
"filter:progid:DXImageTransform.Microsoft.Alpha(Opacity",
|
||||
"filter",
|
||||
"transition",
|
||||
"transition-delay",
|
||||
"transition-timing-function",
|
||||
"transition-duration",
|
||||
"transition-property",
|
||||
"transform",
|
||||
"transform-origin",
|
||||
"animation",
|
||||
"animation-name",
|
||||
"animation-duration",
|
||||
"animation-play-state",
|
||||
"animation-timing-function",
|
||||
"animation-delay",
|
||||
"animation-iteration-count",
|
||||
"animation-direction",
|
||||
"animation-fill-mode",
|
||||
"pointer-events",
|
||||
"unicode-bidi",
|
||||
"direction",
|
||||
"columns",
|
||||
"column-span",
|
||||
"column-width",
|
||||
"column-count",
|
||||
"column-fill",
|
||||
"column-gap",
|
||||
"column-rule",
|
||||
"column-rule-width",
|
||||
"column-rule-style",
|
||||
"column-rule-color",
|
||||
"break-before",
|
||||
"break-inside",
|
||||
"break-after",
|
||||
"page-break-before",
|
||||
"page-break-inside",
|
||||
"page-break-after",
|
||||
"orphans",
|
||||
"widows",
|
||||
"zoom",
|
||||
"max-zoom",
|
||||
"min-zoom",
|
||||
"user-zoom",
|
||||
"orientation",
|
||||
"-webkit-overflow-scrolling",
|
||||
"-ms-overflow-scrolling"
|
||||
] ]
|
||||
}
|
||||
@ -36,8 +36,8 @@ body {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-position: center center;
|
||||
background-size: cover;
|
||||
background-position: center center;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
@ -51,6 +51,17 @@ body {
|
||||
/* 2. Layout - Page building blocks
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
.site-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.site-main {
|
||||
z-index: 100;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
/* Full width page blocks */
|
||||
.outer {
|
||||
position: relative;
|
||||
@ -59,9 +70,9 @@ body {
|
||||
|
||||
/* Centered content container blocks */
|
||||
.inner {
|
||||
margin: 0 auto;
|
||||
max-width: 1040px;
|
||||
width: 100%;
|
||||
max-width: 1040px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
/* Usage:
|
||||
@ -81,12 +92,12 @@ body {
|
||||
.home-template .post-feed,
|
||||
.tag-template .post-feed,
|
||||
.author-template .post-feed {
|
||||
margin-top: -110px;
|
||||
margin-top: -70px;
|
||||
padding-top: 0;
|
||||
}
|
||||
.home-template .site-nav {
|
||||
position: relative;
|
||||
top: -70px;
|
||||
z-index: 300;
|
||||
}
|
||||
}
|
||||
|
||||
@ -134,15 +145,13 @@ body {
|
||||
}
|
||||
|
||||
.site-header-content {
|
||||
position: relative;
|
||||
z-index: 100;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 10vw 4vw;
|
||||
min-height: 200px;
|
||||
max-height: 450px;
|
||||
padding: 10vw 4vw;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@ -151,6 +160,7 @@ body {
|
||||
padding: 0;
|
||||
font-size: 3.8rem;
|
||||
font-weight: 700;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.site-logo {
|
||||
@ -164,6 +174,7 @@ body {
|
||||
font-weight: 300;
|
||||
letter-spacing: 0.5px;
|
||||
opacity: 0.8;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
@ -181,12 +192,12 @@ body {
|
||||
|
||||
.site-nav {
|
||||
position: relative;
|
||||
z-index: 100;
|
||||
z-index: 300;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
overflow-y: hidden;
|
||||
height: 40px;
|
||||
overflow-y: hidden;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
@ -199,7 +210,6 @@ body {
|
||||
padding-bottom: 80px;
|
||||
letter-spacing: 0.4px;
|
||||
white-space: nowrap;
|
||||
|
||||
-webkit-overflow-scrolling: touch;
|
||||
-ms-overflow-scrolling: touch;
|
||||
}
|
||||
@ -216,6 +226,7 @@ The knock-on effect of this is ugly browser-scroll bars at the bottom, so 80px o
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
margin-right: 24px;
|
||||
padding: 9px 0;
|
||||
color: #fff;
|
||||
font-size: 1.7rem;
|
||||
line-height: 1em;
|
||||
@ -337,19 +348,19 @@ The knock-on effect of this is ugly browser-scroll bars at the bottom, so 80px o
|
||||
}
|
||||
|
||||
.rss-button svg {
|
||||
margin-bottom: 1px;
|
||||
height: 2.1rem;
|
||||
margin-bottom: 1px;
|
||||
fill: #fff;
|
||||
}
|
||||
|
||||
@media (max-width: 700px) {
|
||||
.site-header {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
.site-nav-left {
|
||||
padding-left: 4vw;
|
||||
margin-right: 0;
|
||||
padding-left: 4vw;
|
||||
}
|
||||
.site-nav-right {
|
||||
display: none;
|
||||
@ -362,7 +373,6 @@ The knock-on effect of this is ugly browser-scroll bars at the bottom, so 80px o
|
||||
|
||||
.post-feed {
|
||||
position: relative;
|
||||
z-index: 200;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin: 0 -20px;
|
||||
@ -373,9 +383,9 @@ The knock-on effect of this is ugly browser-scroll bars at the bottom, so 80px o
|
||||
flex: 1 1 300px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 300px;
|
||||
overflow: hidden;
|
||||
margin: 0 20px 40px;
|
||||
min-height: 300px;
|
||||
background: #fff center center;
|
||||
background-size: cover;
|
||||
border-radius: 5px;
|
||||
@ -391,6 +401,9 @@ The knock-on effect of this is ugly browser-scroll bars at the bottom, so 80px o
|
||||
|
||||
.post-card-image-link {
|
||||
position: relative;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
border-radius: 5px 5px 0 0;
|
||||
}
|
||||
|
||||
.post-card-image {
|
||||
@ -442,10 +455,11 @@ The knock-on effect of this is ugly browser-scroll bars at the bottom, so 80px o
|
||||
}
|
||||
|
||||
.author-profile-image {
|
||||
margin-right: 5px;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
margin-right: 5px;
|
||||
border-radius: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.post-card-author {
|
||||
@ -533,9 +547,9 @@ The first (most recent) post in the list is styled to be bigger than the others
|
||||
/* ^ Required to make .post-full-content:before/after z-index stacking work */
|
||||
|
||||
.post-full-header {
|
||||
max-width: 1040px;
|
||||
margin: 0 auto;
|
||||
padding: 6vw 3vw 3vw;
|
||||
max-width: 1040px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@ -564,8 +578,8 @@ The first (most recent) post in the list is styled to be bigger than the others
|
||||
}
|
||||
|
||||
.post-full-image {
|
||||
margin: 0 -10vw -165px;
|
||||
height: 800px;
|
||||
margin: 0 -10vw -165px;
|
||||
background: var(--lightgrey) center center;
|
||||
background-size: cover;
|
||||
border-radius: 5px;
|
||||
@ -573,8 +587,8 @@ The first (most recent) post in the list is styled to be bigger than the others
|
||||
|
||||
@media (max-width: 1170px) {
|
||||
.post-full-image {
|
||||
margin: 0 -4vw -100px;
|
||||
height: 600px;
|
||||
margin: 0 -4vw -100px;
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
@ -587,9 +601,9 @@ The first (most recent) post in the list is styled to be bigger than the others
|
||||
|
||||
.post-full-content {
|
||||
position: relative;
|
||||
min-height: 230px;
|
||||
margin: 0 auto;
|
||||
padding: 70px 100px 0;
|
||||
min-height: 230px;
|
||||
font-family: Georgia, serif;
|
||||
font-size: 2.2rem;
|
||||
line-height: 1.6em;
|
||||
@ -699,8 +713,8 @@ The first (most recent) post in the list is styled to be bigger than the others
|
||||
.post-full-content img,
|
||||
.post-full-content video {
|
||||
display: block;
|
||||
margin: 1.5em auto;
|
||||
max-width: 1040px;
|
||||
margin: 1.5em auto;
|
||||
}
|
||||
@media (max-width: 1040px) {
|
||||
.post-full-content img,
|
||||
@ -709,15 +723,40 @@ The first (most recent) post in the list is styled to be bigger than the others
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
If an image url has #full on the end, give it special wide styles.
|
||||
|
||||
/* Full bleed images (#full)
|
||||
Super neat trick courtesy of @JoelDrapper
|
||||
|
||||
Usage (In Ghost edtior):
|
||||
|
||||
|
||||
|
||||
*/
|
||||
.post-full-content img[src$="#full"] {
|
||||
width: 100vw;
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
|
||||
/* Image captions
|
||||
|
||||
Usage (In Ghost editor):
|
||||
|
||||
|
||||
<small>Your image caption</small>
|
||||
|
||||
*/
|
||||
.post-full-content br + small {
|
||||
display: block;
|
||||
margin-top: -3em;
|
||||
margin-bottom: 1.5em;
|
||||
}
|
||||
|
||||
|
||||
.post-full-content iframe {
|
||||
margin: 0 auto 1.5em;
|
||||
}
|
||||
|
||||
.post-full-content blockquote {
|
||||
margin: 0 0 1.5em 0;
|
||||
padding: 1.5em 0;
|
||||
@ -737,9 +776,9 @@ Super neat trick courtesy of @JoelDrapper
|
||||
}
|
||||
|
||||
@media (min-width: 1000px) {
|
||||
.post-full-content blockquote {
|
||||
max-width: 1060px;
|
||||
.post-full-content blockquote:not(:first-of-type) {
|
||||
width: 100vw;
|
||||
max-width: 1060px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -757,10 +796,10 @@ Super neat trick courtesy of @JoelDrapper
|
||||
}
|
||||
|
||||
.post-full-content pre {
|
||||
max-width: 100%;
|
||||
overflow-x: auto;
|
||||
margin: 1.5em 0 3em;
|
||||
padding: 20px;
|
||||
max-width: 100%;
|
||||
border: color(var(--darkgrey) l(-10%)) 1px solid;
|
||||
color: var(--whitegrey);
|
||||
font-size: 1.4rem;
|
||||
@ -790,9 +829,9 @@ Super neat trick courtesy of @JoelDrapper
|
||||
top: -15px;
|
||||
left: 50%;
|
||||
display: block;
|
||||
margin-left: -10px;
|
||||
width: 1px;
|
||||
height: 30px;
|
||||
margin-left: -10px;
|
||||
background: color(var(--lightgrey) l(+10%));
|
||||
box-shadow: #fff 0 0 0 5px;
|
||||
transform: rotate(45deg);
|
||||
@ -804,6 +843,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
.post-full-content h4,
|
||||
.post-full-content h5,
|
||||
.post-full-content h6 {
|
||||
margin-top: -75px;
|
||||
padding-top: 75px;
|
||||
color: color(var(--darkgrey) l(-5%));
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
|
||||
}
|
||||
@ -885,47 +926,48 @@ Super neat trick courtesy of @JoelDrapper
|
||||
|
||||
/* Tables */
|
||||
.post-full-content table {
|
||||
display: table;
|
||||
width: 100%;
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
max-width: 100%;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
margin: 0.5em 0 2.5em;
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
vertical-align: top;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
|
||||
font-size: 1.6rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.post-full-content table {
|
||||
-webkit-overflow-scrolling: touch;
|
||||
background: radial-gradient(ellipse at left, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 75%) 0 center, radial-gradient(ellipse at right, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 75%) 100% center;
|
||||
background-size: 10px 100%, 10px 100%;
|
||||
background-attachment: scroll, scroll;
|
||||
background-repeat: no-repeat;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
.post-full-content table td:first-child {
|
||||
background-image: linear-gradient(to right, rgba(255,255,255, 1) 50%, rgba(255,255,255, 0) 100%);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 20px 100%;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.post-full-content table td:last-child {
|
||||
background-image: linear-gradient(to left, rgba(255,255,255, 1) 50%, rgba(255,255,255, 0) 100%);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 100% 0;
|
||||
background-size: 20px 100%;
|
||||
background-position: 100% 0;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.post-full-content table th {
|
||||
font-size: 1.2rem;
|
||||
letter-spacing: 0.2px;
|
||||
color: var(--darkgrey);
|
||||
font-size: 1.2rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.2px;
|
||||
text-align: left;
|
||||
text-transform: uppercase;
|
||||
background: color(var(--whitegrey) l(+4%));
|
||||
background-color: color(var(--whitegrey) l(+4%));
|
||||
}
|
||||
|
||||
.post-full-content table th,
|
||||
@ -934,16 +976,6 @@ Super neat trick courtesy of @JoelDrapper
|
||||
border: color(var(--whitegrey) l(-1%) s(-5%)) 1px solid;
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
.post-full-content table {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
max-width: 100%;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* 7.1. Subscribe Form
|
||||
/* ---------------------------------------------------------- */
|
||||
@ -978,8 +1010,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 0 auto;
|
||||
max-width: 420px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.subscribe-form .form-group {
|
||||
@ -988,8 +1020,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
|
||||
.subscribe-email {
|
||||
display: block;
|
||||
padding: 10px;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
border: color(var(--lightgrey) l(+7%)) 1px solid;
|
||||
color: var(--midgrey);
|
||||
font-size: 1.8rem;
|
||||
@ -1009,9 +1041,9 @@ Super neat trick courtesy of @JoelDrapper
|
||||
|
||||
.subscribe-form button {
|
||||
display: inline-block;
|
||||
height: 41px;
|
||||
margin: 0 0 0 10px;
|
||||
padding: 0 20px;
|
||||
height: 41px;
|
||||
outline: none;
|
||||
color: #fff;
|
||||
font-size: 1.5rem;
|
||||
@ -1066,9 +1098,9 @@ Super neat trick courtesy of @JoelDrapper
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
max-width: 840px;
|
||||
margin: 0 auto;
|
||||
padding: 3vw 0 6vw 0;
|
||||
max-width: 840px;
|
||||
}
|
||||
|
||||
.author-card {
|
||||
@ -1077,9 +1109,9 @@ Super neat trick courtesy of @JoelDrapper
|
||||
}
|
||||
|
||||
.author-card .author-profile-image {
|
||||
margin-right: 15px;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.author-card-name {
|
||||
@ -1131,8 +1163,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
.post-full-comments {
|
||||
margin: 0 auto;
|
||||
max-width: 840px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
|
||||
@ -1217,9 +1249,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
|
||||
.read-next-divider svg {
|
||||
width: 40px;
|
||||
fill: transparent;
|
||||
stroke: #fff;
|
||||
|
||||
fill: transparent;
|
||||
stroke-width: 0.5px;
|
||||
stroke-opacity: 0.65;
|
||||
}
|
||||
@ -1237,8 +1268,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
flex-direction: column;
|
||||
margin: 0 auto;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
list-style: none;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.read-next-card-content li {
|
||||
@ -1254,9 +1285,9 @@ Super neat trick courtesy of @JoelDrapper
|
||||
display: block;
|
||||
padding: 20px 0;
|
||||
border-bottom: rgba(255,255,255,0.3) 1px solid;
|
||||
vertical-align: top;
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
vertical-align: top;
|
||||
transition: opacity 0.3s ease;
|
||||
}
|
||||
|
||||
@ -1318,6 +1349,7 @@ Super neat trick courtesy of @JoelDrapper
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: var(--darkgrey);
|
||||
line-height: 1.1em;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@ -1326,8 +1358,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
}
|
||||
|
||||
.floating-header-logo img {
|
||||
margin: 0 10px 0 0;
|
||||
max-height: 20px;
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
|
||||
.floating-header-divider {
|
||||
@ -1378,9 +1410,9 @@ Super neat trick courtesy of @JoelDrapper
|
||||
}
|
||||
|
||||
.floating-header-share-label svg {
|
||||
margin: 0 5px 0 10px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin: 0 5px 0 10px;
|
||||
stroke: rgba(0,0,0,0.7);
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
@ -1427,6 +1459,10 @@ Super neat trick courtesy of @JoelDrapper
|
||||
background-color: var(--blue);
|
||||
}
|
||||
|
||||
.progress::-moz-progress-bar {
|
||||
background-color: var(--blue);
|
||||
}
|
||||
|
||||
.progress-container {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
@ -1485,16 +1521,18 @@ Super neat trick courtesy of @JoelDrapper
|
||||
|
||||
.site-header-content .author-profile-image {
|
||||
flex-shrink: 0;
|
||||
margin: 0 0 20px 0;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
margin: 0 0 20px 0;
|
||||
box-shadow: rgba(255,255,255,0.1) 0 0 0 6px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.site-header-content .author-bio {
|
||||
flex-shrink: 0;
|
||||
margin: 5px 0 10px 0;
|
||||
z-index: 10;
|
||||
max-width: 600px;
|
||||
margin: 5px 0 10px 0;
|
||||
font-size: 2rem;
|
||||
line-height: 1.3em;
|
||||
font-weight: 300;
|
||||
@ -1504,6 +1542,7 @@ Super neat trick courtesy of @JoelDrapper
|
||||
|
||||
.site-header-content .author-meta {
|
||||
flex-shrink: 0;
|
||||
z-index: 10;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
@ -1645,8 +1684,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
}
|
||||
|
||||
.subscribe-overlay-description {
|
||||
margin: 0 auto 50px;
|
||||
max-width: 650px;
|
||||
margin: 0 auto 50px;
|
||||
font-family: Georgia, serif;
|
||||
font-size: 3rem;
|
||||
line-height: 1.3em;
|
||||
@ -1658,8 +1697,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 0 auto;
|
||||
max-width: 500px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.subscribe-overlay .form-group {
|
||||
@ -1668,8 +1707,8 @@ Super neat trick courtesy of @JoelDrapper
|
||||
|
||||
.subscribe-overlay .subscribe-email {
|
||||
display: block;
|
||||
padding: 14px 20px;
|
||||
width: 100%;
|
||||
padding: 14px 20px;
|
||||
border: none;
|
||||
color: var(--midgrey);
|
||||
font-size: 2rem;
|
||||
@ -1690,9 +1729,9 @@ Super neat trick courtesy of @JoelDrapper
|
||||
|
||||
.subscribe-overlay button {
|
||||
display: inline-block;
|
||||
height: 52px;
|
||||
margin: 0 0 0 15px;
|
||||
padding: 0 25px;
|
||||
height: 52px;
|
||||
outline: none;
|
||||
color: #fff;
|
||||
font-size: 1.7rem;
|
||||
|
||||
@ -1,10 +1,12 @@
|
||||
/*jshint browser:true */
|
||||
/*!
|
||||
* FitVids 1.1
|
||||
* FitVids 1.3
|
||||
*
|
||||
* Copyright 2013, Chris Coyier - http://css-tricks.com + Dave Rupert - http://daverupert.com
|
||||
*
|
||||
* Copyright 2017, Chris Coyier + Dave Rupert + Ghost Foundation
|
||||
* This is an unofficial release, ported by John O'Nolan
|
||||
* Credit to Thierry Koblentz - http://www.alistapart.com/articles/creating-intrinsic-ratios-for-video/
|
||||
* Released under the WTFPL license - http://sam.zoy.org/wtfpl/
|
||||
* Released under the MIT license
|
||||
*
|
||||
*/
|
||||
|
||||
@ -21,7 +23,7 @@
|
||||
if(!document.getElementById('fit-vids-style')) {
|
||||
// appendStyles: https://github.com/toddmotto/fluidvids/blob/master/dist/fluidvids.js
|
||||
var head = document.head || document.getElementsByTagName('head')[0];
|
||||
var css = '.fluid-width-video-wrapper{width:100%;position:relative;padding:0;}.fluid-width-video-wrapper iframe,.fluid-width-video-wrapper object,.fluid-width-video-wrapper embed {position:absolute;top:0;left:0;width:100%;height:100%;}';
|
||||
var css = '.fluid-width-video-container{flex-grow: 1;width:100%;}.fluid-width-video-wrapper{width:100%;position:relative;padding:0;}.fluid-width-video-wrapper iframe,.fluid-width-video-wrapper object,.fluid-width-video-wrapper embed {position:absolute;top:0;left:0;width:100%;height:100%;}';
|
||||
var div = document.createElement("div");
|
||||
div.innerHTML = '<p>x</p><style id="fit-vids-style">' + css + '</style>';
|
||||
head.appendChild(div.childNodes[1]);
|
||||
@ -74,7 +76,7 @@
|
||||
$this.attr('name', videoName);
|
||||
$.fn.fitVids._count++;
|
||||
}
|
||||
$this.wrap('<div class="fluid-width-video-wrapper"></div>').parent('.fluid-width-video-wrapper').css('padding-top', (aspectRatio * 100)+'%');
|
||||
$this.wrap('<div class="fluid-width-video-container"><div class="fluid-width-video-wrapper"></div></div>').parent('.fluid-width-video-wrapper').css('padding-top', (aspectRatio * 100)+'%');
|
||||
$this.removeAttr('height').removeAttr('width');
|
||||
});
|
||||
});
|
||||
|
||||
56
error-404.hbs
Normal file
56
error-404.hbs
Normal file
@ -0,0 +1,56 @@
|
||||
{{!--
|
||||
This error template is used for all 404 errors, which might occur on your site.
|
||||
It's a good idea to keep this template as minimal as possible in terms of both file size and complexity.
|
||||
--}}
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<title>{{meta_title}}</title>
|
||||
<meta name="HandheldFriendly" content="True" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="stylesheet" type="text/css" href="{{asset "built/screen.css"}}" />
|
||||
</head>
|
||||
<body class="error-template">
|
||||
<div class="site-wrapper">
|
||||
|
||||
<header class="site-header outer {{#if feature_image}}" style="background-image: url({{feature_image}}){{else}}no-cover{{/if}}">
|
||||
<div class="inner">
|
||||
<nav class="site-nav-center">
|
||||
{{#if @blog.logo}}
|
||||
<a class="site-nav-logo" href="{{@blog.url}}"><img src="{{@blog.logo}}" alt="{{@blog.title}}" /></a>
|
||||
{{else}}
|
||||
<a class="site-nav-logo" href="{{@blog.url}}">{{@blog.title}}</a>
|
||||
{{/if}}
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main id="site-main" class="site-main outer" role="main">
|
||||
<div class="inner">
|
||||
|
||||
<section class="error-message">
|
||||
<h1 class="error-code">{{code}}</h1>
|
||||
<p class="error-description">{{message}}</p>
|
||||
<a class="error-link" href="{{@blog.url}}">Go to the front page →</a>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
{{#get "posts" limit="3"}}
|
||||
<aside class="outer">
|
||||
<div class="inner">
|
||||
<div class="post-feed">
|
||||
{{#foreach posts}}
|
||||
{{> "post-card"}}
|
||||
{{/foreach}}
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
{{/get}}
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
17
error.hbs
17
error.hbs
@ -1,5 +1,7 @@
|
||||
{{!--
|
||||
This error template is used for all 400/500 errors which might occur on your site. It's a good idea to keep this template as minimal as possible in terms of both file size and complexity. You'll notice that we *don't* use any JavsScript, or ghost_head / ghost_foot in this file.
|
||||
This error template is used for all 400/500 errors, except 404, which might occur on your site.
|
||||
It's a good idea to keep this template as minimal as possible in terms of both file size and complexity.
|
||||
You'll notice that we *don't* use any JavsScript, or ghost_head / ghost_foot in this file.
|
||||
--}}
|
||||
|
||||
<!DOCTYPE html>
|
||||
@ -56,19 +58,6 @@ This error template is used for all 400/500 errors which might occur on your sit
|
||||
|
||||
</div>
|
||||
</main>
|
||||
|
||||
{{#get "posts" limit="3"}}
|
||||
<aside class="outer">
|
||||
<div class="inner">
|
||||
<div class="post-feed">
|
||||
{{#foreach posts}}
|
||||
{{> "post-card"}}
|
||||
{{/foreach}}
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
{{/get}}
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -2,9 +2,9 @@
|
||||
"name": "casper",
|
||||
"description": "The default personal blogging theme for Ghost. Beautiful, minimal and responsive.",
|
||||
"demo": "https://demo.ghost.io",
|
||||
"version": "2.0.1",
|
||||
"version": "2.0.6",
|
||||
"engines": {
|
||||
"ghost": ">=1.0.0"
|
||||
"ghost": ">=1.2.0"
|
||||
},
|
||||
"license": "MIT",
|
||||
"screenshots": {
|
||||
|
||||
@ -7,8 +7,8 @@
|
||||
<div class="post-card-content">
|
||||
<a class="post-card-content-link" href="{{url}}">
|
||||
<header class="post-card-header">
|
||||
{{#if tags}}
|
||||
<span class="post-card-tags">{{tags.[0].name}}</span>
|
||||
{{#if primary_tag}}
|
||||
<span class="post-card-tags">{{primary_tag.name}}</span>
|
||||
{{/if}}
|
||||
<h2 class="post-card-title">{{title}}</h2>
|
||||
</header>
|
||||
|
||||
22
post.hbs
22
post.hbs
@ -20,9 +20,9 @@ into the {body} of the default.hbs template --}}
|
||||
<header class="post-full-header">
|
||||
<section class="post-full-meta">
|
||||
<time class="post-full-meta-date" datetime="{{date format="YYYY-MM-DD"}}">{{date format="D MMMM YYYY"}}</time>
|
||||
{{#if tags}}
|
||||
<span class="date-divider">/</span> <a href="{{@blog.url}}/tag/{{tags.[0].slug}}">{{tags.[0].name}}</a>
|
||||
{{/if}}
|
||||
{{#primary_tag}}
|
||||
<span class="date-divider">/</span> <a href="{{url}}">{{name}}</a>
|
||||
{{/primary_tag}}
|
||||
</section>
|
||||
<h1 class="post-full-title">{{title}}</h1>
|
||||
</header>
|
||||
@ -102,10 +102,11 @@ into the {body} of the default.hbs template --}}
|
||||
<div class="inner">
|
||||
<div class="read-next-feed">
|
||||
|
||||
{{#get "posts" filter="tags:{{tags.[0].slug}}+id:-{{id}}" limit="3"}}
|
||||
{{#get "posts" filter="tags:{{primary_tag.slug}}+id:-{{id}}" limit="3" as |related_posts|}}
|
||||
{{#if related_posts}}
|
||||
<article class="read-next-card"
|
||||
{{#if ../tags.[0].feature_image}}
|
||||
style="background-image: url({{../tags.[0].feature_image}})"
|
||||
{{#if ../primary_tag.feature_image}}
|
||||
style="background-image: url({{../primary_tag.feature_image}})"
|
||||
{{else}}
|
||||
{{#if @blog.cover_image}}
|
||||
style="background-image: url({{@blog.cover_image}})"{{/if}}
|
||||
@ -113,20 +114,23 @@ into the {body} of the default.hbs template --}}
|
||||
>
|
||||
<header class="read-next-card-header">
|
||||
<small class="read-next-card-header-sitetitle">— {{@blog.title}} —</small>
|
||||
<h3 class="read-next-card-header-title"><a href="{{@blog.url}}/tag/{{../tags.[0].slug}}/">{{../tags.[0].name}}</a></h3>
|
||||
{{#../primary_tag}}
|
||||
<h3 class="read-next-card-header-title"><a href="{{url}}">{{name}}</a></h3>
|
||||
{{/../primary_tag}}
|
||||
</header>
|
||||
<div class="read-next-divider">{{> "icons/infinity"}}</div>
|
||||
<div class="read-next-card-content">
|
||||
<ul>
|
||||
{{#foreach posts}}
|
||||
{{#foreach related_posts}}
|
||||
<li><a href="{{url}}">{{title}}</a></li>
|
||||
{{/foreach}}
|
||||
</ul>
|
||||
</div>
|
||||
<footer class="read-next-card-footer">
|
||||
<a href="{{@blog.url}}/tag/{{../tags.[0].slug}}/">{{plural meta.pagination.total empty='No posts' singular='% post' plural='See all % posts'}} →</a>
|
||||
<a href="{{#../primary_tag}}{{url}}{{/../primary_tag}}">{{plural meta.pagination.total empty='No posts' singular='% post' plural='See all % posts'}} →</a>
|
||||
</footer>
|
||||
</article>
|
||||
{{/if}}
|
||||
{{/get}}
|
||||
|
||||
{{!-- If there's a next post, display it using the same markup included from - partials/post-card.hbs --}}
|
||||
|
||||
Reference in New Issue
Block a user