mirror of
https://github.com/ViViDboarder/Vivid-Casper.git
synced 2024-12-22 11:37:38 +00:00
Cleanup
This commit is contained in:
John O'Nolan
parent
cf24eccdf2
commit
1365eab4ae
19
.github/ISSUE_TEMPLATE.md
vendored
19
.github/ISSUE_TEMPLATE.md
vendored
@ -1,19 +0,0 @@
|
||||
Do you need help or have a question? Please come chat in our forum: https://forum.ghost.org 👫.
|
||||
|
||||
If you're filing a bug 🐛, please include the following information:
|
||||
|
||||
### Screenshot
|
||||
|
||||
![]()
|
||||
|
||||
### Steps to Reproduce
|
||||
|
||||
1. This is the first step
|
||||
2. This may be the post content used to cause an issue...
|
||||
|
||||
### Technical details
|
||||
|
||||
* Casper Version:
|
||||
* Ghost Version:
|
||||
* Browser Version:
|
||||
* OS Version:
|
||||
16
.github/workflows/deploy-theme.yml
vendored
16
.github/workflows/deploy-theme.yml
vendored
@ -1,16 +0,0 @@
|
||||
name: Deploy Theme
|
||||
on:
|
||||
push:
|
||||
branches:
|
||||
- master
|
||||
- main
|
||||
jobs:
|
||||
deploy:
|
||||
runs-on: ubuntu-18.04
|
||||
steps:
|
||||
- uses: actions/checkout@v2
|
||||
- uses: TryGhost/action-deploy-theme@v1.4.1
|
||||
with:
|
||||
api-url: ${{ secrets.GHOST_ADMIN_API_URL }}
|
||||
api-key: ${{ secrets.GHOST_ADMIN_API_KEY }}
|
||||
theme-name: "casper-master"
|
||||
15
.github/workflows/test.yml
vendored
15
.github/workflows/test.yml
vendored
@ -1,15 +0,0 @@
|
||||
name: Test
|
||||
on:
|
||||
pull_request:
|
||||
push:
|
||||
branches:
|
||||
- master
|
||||
- 'renovate/*'
|
||||
jobs:
|
||||
test:
|
||||
runs-on: ubuntu-latest
|
||||
if: github.event_name == 'push' || (github.event_name == 'pull_request' && !startsWith(github.head_ref, 'renovate/'))
|
||||
steps:
|
||||
- uses: actions/checkout@v2
|
||||
- run: yarn
|
||||
- run: yarn test:ci
|
||||
@ -1,2 +1,2 @@
|
||||
a,abbr,acronym,address,applet,article,aside,audio,big,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,ul,var,video{margin:0;padding:0;border:0;font:inherit;font-size:100%;vertical-align:baseline}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}img{max-width:100%}html{box-sizing:border-box;font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}*,:after,:before{box-sizing:inherit}a{background-color:transparent}a:active,a:hover{outline:0}b,strong{font-weight:700}dfn,em,i{font-style:italic}h1{margin:.67em 0;font-size:2em}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}mark{background-color:#fdffb6}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{margin:0;color:inherit;font:inherit}button{overflow:visible;border:none}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{cursor:pointer;-webkit-appearance:button}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}input{line-height:normal}input:focus{outline:none}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{box-sizing:content-box;-webkit-appearance:textfield}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}legend{padding:0;border:0}textarea{overflow:auto}table{border-spacing:0;border-collapse:collapse}td,th{padding:0}html{overflow-y:scroll;font-size:62.5%;-webkit-tap-highlight-color:rgba(0,0,0,0)}body,html{overflow-x:hidden}body{color:#35373a;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:1.6rem;line-height:1.6em;font-weight:400;font-style:normal;letter-spacing:0;text-rendering:optimizeLegibility;background:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-moz-font-feature-settings:"liga" on}::-moz-selection{text-shadow:none;background:#daf2fd}::selection{text-shadow:none;background:#daf2fd}hr{position:relative;display:block;width:100%;margin:2.5em 0 3.5em;padding:0;height:1px;border:0;border-top:1px solid #f0f0f0}audio,canvas,iframe,img,svg,video{vertical-align:middle}fieldset{margin:0;padding:0;border:0}textarea{resize:vertical}blockquote,dl,ol,p,ul{margin:0 0 1.5em}ol,ul{padding-left:1.3em;padding-right:1.5em}ol ol,ol ul,ul ol,ul ul{margin:.5em 0 1em}ul{list-style:disc}ol{list-style:decimal}ol,ul{max-width:100%}li{margin:.5em 0;padding-left:.3em;line-height:1.6em}dt{float:left;margin:0 20px 0 0;width:120px;color:#daf2fd;font-weight:500;text-align:right}dd{margin:0 0 5px;text-align:left}blockquote{margin:1.5em 0;padding:0 1.6em;border-left:#daf2fd}blockquote p{margin:.8em 0;font-size:1.2em;font-weight:300}blockquote small{display:inline-block;margin:.8em 0 .8em 1.5em;font-size:.9em;opacity:.8}blockquote small:before{content:"\2014 \00A0"}blockquote cite{font-weight:700}blockquote cite a{font-weight:400}a{color:#15171a;text-decoration:none}h1,h2,h3,h4,h5,h6{margin-top:0;line-height:1.15;font-weight:600;text-rendering:optimizeLegibility;letter-spacing:-.01em}h1{margin:0 0 .5em;font-size:5rem;font-weight:700;letter-spacing:-.015em}@media (max-width:600px){h1{font-size:2.2rem}}h2{margin:1.5em 0 .5em;font-size:2.8rem;font-weight:700}@media (max-width:600px){h2{font-size:2.6rem}}h3{margin:1.5em 0 .5em;font-size:1.8rem;font-weight:500}@media (max-width:600px){h3{font-size:1.7rem}}h4{margin:1.5em 0 .5em;font-size:1.6rem}h5,h6{margin:1.5em 0 .5em;font-size:1.4rem}
|
||||
a,abbr,acronym,address,applet,article,aside,audio,big,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,ul,var,video{margin:0;padding:0;border:0;font:inherit;font-size:100%;vertical-align:baseline}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}img{max-width:100%;height:auto}html{box-sizing:border-box;font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}*,:after,:before{box-sizing:inherit}a{background-color:transparent}a:active,a:hover{outline:0}b,strong{font-weight:700}dfn,em,i{font-style:italic}h1{margin:.67em 0;font-size:2em}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}mark{background-color:#fdffb6}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{margin:0;color:inherit;font:inherit}button{overflow:visible;border:none}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{cursor:pointer;-webkit-appearance:button}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}input{line-height:normal}input:focus{outline:none}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{box-sizing:content-box;-webkit-appearance:textfield}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}legend{padding:0;border:0}textarea{overflow:auto}table{border-spacing:0;border-collapse:collapse}td,th{padding:0}html{overflow-y:scroll;font-size:62.5%;-webkit-tap-highlight-color:rgba(0,0,0,0)}body,html{overflow-x:hidden}body{color:#35373a;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:1.6rem;line-height:1.6em;font-weight:400;font-style:normal;letter-spacing:0;text-rendering:optimizeLegibility;background:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-moz-font-feature-settings:"liga" on}::-moz-selection{text-shadow:none;background:#daf2fd}::selection{text-shadow:none;background:#daf2fd}hr{position:relative;display:block;width:100%;margin:2.5em 0 3.5em;padding:0;height:1px;border:0;border-top:1px solid #f0f0f0}audio,canvas,iframe,img,svg,video{vertical-align:middle}fieldset{margin:0;padding:0;border:0}textarea{resize:vertical}blockquote,dl,ol,p,ul{margin:0 0 1.5em}ol,ul{padding-left:1.3em;padding-right:1.5em}ol ol,ol ul,ul ol,ul ul{margin:.5em 0 1em}ul{list-style:disc}ol{list-style:decimal}ol,ul{max-width:100%}li{margin:.5em 0;padding-left:.3em;line-height:1.6em}dt{float:left;margin:0 20px 0 0;width:120px;color:#daf2fd;font-weight:500;text-align:right}dd{margin:0 0 5px;text-align:left}blockquote{margin:1.5em 0;padding:0 1.6em;border-left:#daf2fd}blockquote p{margin:.8em 0;font-size:1.2em;font-weight:300}blockquote small{display:inline-block;margin:.8em 0 .8em 1.5em;font-size:.9em;opacity:.8}blockquote small:before{content:"\2014 \00A0"}blockquote cite{font-weight:700}blockquote cite a{font-weight:400}a{color:#15171a;text-decoration:none}h1,h2,h3,h4,h5,h6{margin-top:0;line-height:1.15;font-weight:600;text-rendering:optimizeLegibility;letter-spacing:-.01em}h1{margin:0 0 .5em;font-size:4.8rem;font-weight:700;letter-spacing:-.015em}@media (max-width:600px){h1{font-size:2.4rem}}h2{margin:1.5em 0 .5em;font-size:2.8rem;font-weight:700}@media (max-width:600px){h2{font-size:2.6rem}}h3{margin:1.5em 0 .5em;font-size:1.8rem;font-weight:500}@media (max-width:600px){h3{font-size:1.7rem}}h4{margin:1.5em 0 .5em;font-size:1.6rem}h5,h6{margin:1.5em 0 .5em;font-size:1.4rem}
|
||||
/*# sourceMappingURL=global.css.map */
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -109,6 +109,7 @@ table {
|
||||
}
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
html {
|
||||
box-sizing: border-box;
|
||||
@ -416,13 +417,13 @@ h6 {
|
||||
|
||||
h1 {
|
||||
margin: 0 0 0.5em 0;
|
||||
font-size: 5rem;
|
||||
font-size: 4.8rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.015em;
|
||||
}
|
||||
@media (max-width: 600px) {
|
||||
h1 {
|
||||
font-size: 2.2rem;
|
||||
font-size: 2.4rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -104,14 +104,23 @@ production stylesheet in assets/built/screen.css
|
||||
|
||||
.site-header-background {
|
||||
position: relative;
|
||||
margin-top: 64px;
|
||||
padding-bottom: 12px;
|
||||
color: #fff;
|
||||
background: var(--ghost-accent-color) no-repeat center center;
|
||||
background-size: cover;
|
||||
background: var(--ghost-accent-color);
|
||||
}
|
||||
|
||||
.site-header-background:before {
|
||||
.site-header-cover {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.site-header-cover:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
@ -123,7 +132,7 @@ production stylesheet in assets/built/screen.css
|
||||
background: rgba(0,0,0,0.18);
|
||||
}
|
||||
|
||||
.site-header-background:after {
|
||||
.site-header-cover:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
@ -133,15 +142,11 @@ production stylesheet in assets/built/screen.css
|
||||
z-index: 10;
|
||||
display: block;
|
||||
height: 140px;
|
||||
background: linear-gradient(rgba(0,0,0,0.15),rgba(0,0,0,0));
|
||||
}
|
||||
|
||||
.site-header-background.no-image:before,
|
||||
.site-header-background.no-image:after {
|
||||
display: none;
|
||||
background: linear-gradient(rgba(0,0,0,0.95),rgba(0,0,0,0));
|
||||
}
|
||||
|
||||
.site-header-content {
|
||||
position: relative;
|
||||
z-index: 100;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@ -150,55 +155,46 @@ production stylesheet in assets/built/screen.css
|
||||
padding: 6vw 3vw;
|
||||
min-height: 200px;
|
||||
max-height: 340px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.site-title {
|
||||
z-index: 10;
|
||||
margin: 0 0 0 -2px;
|
||||
margin: 0 0 0.15em;
|
||||
padding: 0;
|
||||
font-size: 5.0rem;
|
||||
line-height: 1em;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.site-logo {
|
||||
max-height: 55px;
|
||||
}
|
||||
|
||||
.site-description {
|
||||
z-index: 10;
|
||||
margin: 0;
|
||||
padding: 5px 0;
|
||||
font-size: 2.1rem;
|
||||
line-height: 1.4em;
|
||||
font-weight: 400;
|
||||
.site-header-content p {
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
line-height: 1.2em;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.site-header-content p {
|
||||
max-width: 80vmin;
|
||||
font-size: 1.8rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 4.1 Home header
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
.site-home-header {
|
||||
position: relative;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.site-home-header .site-header-background {
|
||||
margin-top: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.site-home-header .site-header-content {
|
||||
padding: 5vw 3vw 6vw;
|
||||
}
|
||||
|
||||
.site-home-header .site-title {
|
||||
font-size: 5.5rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.site-home-header .site-description {
|
||||
font-size: 2.2rem;
|
||||
font-weight: 300;
|
||||
text-align: center;
|
||||
font-size: 2.5rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
|
||||
@ -232,39 +228,6 @@ production stylesheet in assets/built/screen.css
|
||||
}
|
||||
|
||||
|
||||
/* Special header styles for smaller screens */
|
||||
|
||||
@media (max-width: 900px) {
|
||||
.site-header-content {
|
||||
padding-bottom: 9vw;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
.site-home-header .site-title {
|
||||
font-size: 4.2rem;
|
||||
}
|
||||
|
||||
.site-home-header .site-description {
|
||||
font-size: 1.8rem;
|
||||
}
|
||||
|
||||
.site-archive-header .site-header-content {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
min-height: unset;
|
||||
}
|
||||
|
||||
.site-archive-header .site-title {
|
||||
font-size: 4.2rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.site-archive-header .no-image .site-header-content {
|
||||
padding: 12vw 0 20px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* 5. Site Navigation
|
||||
/* ---------------------------------------------------------- */
|
||||
@ -383,7 +346,7 @@ hides that entirely. Slightly hacky code. But nice clean end-result.
|
||||
display: block;
|
||||
padding: 12px 12px;
|
||||
color: #fff;
|
||||
opacity: 0.7;
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
.nav li a:hover {
|
||||
@ -491,18 +454,14 @@ hides that entirely. Slightly hacky code. But nice clean end-result.
|
||||
.subscribe-button {
|
||||
display: block;
|
||||
margin: 0 0 0 10px;
|
||||
padding: 5px 10px;
|
||||
border: #fff 1px solid;
|
||||
color: #fff;
|
||||
font-size: 1.3rem;
|
||||
padding: 8px 15px;
|
||||
color: var(--color-darkgrey);
|
||||
font-weight: 500;
|
||||
letter-spacing: -0.015em;
|
||||
font-size: 1.5rem;
|
||||
line-height: 1em;
|
||||
border-radius: 5px;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.subscribe-button:hover {
|
||||
text-decoration: none;
|
||||
opacity: 1;
|
||||
background: #fff;
|
||||
border-radius: 30px;
|
||||
}
|
||||
|
||||
.site-nav-right .nav + .subscribe-button {
|
||||
@ -564,10 +523,6 @@ hides that entirely. Slightly hacky code. But nice clean end-result.
|
||||
/* 6. Post Feed
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
.posts {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.post-feed {
|
||||
position: relative;
|
||||
display: grid;
|
||||
@ -593,7 +548,6 @@ hides that entirely. Slightly hacky code. But nice clean end-result.
|
||||
flex: 1 1 301px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
min-height: 220px;
|
||||
background-size: cover;
|
||||
}
|
||||
@ -665,7 +619,7 @@ hides that entirely. Slightly hacky code. But nice clean end-result.
|
||||
color: color-mod(var(--color-midgrey) l(-8%));
|
||||
}
|
||||
|
||||
.post-card:not(.post-card-large) .post-card-excerpt p {
|
||||
.post-card-excerpt p {
|
||||
margin-bottom: 1em;
|
||||
display: -webkit-box;
|
||||
overflow-y: hidden;
|
||||
@ -716,17 +670,17 @@ hides that entirely. Slightly hacky code. But nice clean end-result.
|
||||
margin: 0 0 0 -6px;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border: #fff 2px solid;
|
||||
border-radius: 100%;
|
||||
box-shadow: 0 0 0 1px rgba(255,255,255,0.2);
|
||||
}
|
||||
|
||||
.post-card-byline-content {
|
||||
flex: 1 1 50%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 0 0 0 6px;
|
||||
margin: 0 0 0 8px;
|
||||
color: color-mod(var(--color-midgrey) l(+10%));
|
||||
font-size: 1.3rem;
|
||||
font-size: 1.4rem;
|
||||
line-height: 1.2em;
|
||||
font-weight: 400;
|
||||
}
|
||||
@ -736,17 +690,18 @@ hides that entirely. Slightly hacky code. But nice clean end-result.
|
||||
}
|
||||
|
||||
.post-card-byline-content a {
|
||||
color: color-mod(var(--color-darkgrey) l(+20%));
|
||||
color: color-mod(var(--color-darkgrey) l(+15%));
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.post-card-byline-date {
|
||||
font-size: 1.2rem;
|
||||
font-size: 1.3rem;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
.post-card-byline-date .bull {
|
||||
display: inline-block;
|
||||
margin: 0 4px;
|
||||
margin: 0 2px;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
@ -821,6 +776,7 @@ make sure this only happens on large viewports / desktop-ish devices.
|
||||
margin-bottom: 1.5em;
|
||||
font-size: 1.7rem;
|
||||
line-height: 1.55em;
|
||||
-webkit-line-clamp: 8;
|
||||
}
|
||||
}
|
||||
|
||||
@ -947,13 +903,14 @@ headings, text, images and lists. We deal with cards lower down. */
|
||||
}
|
||||
|
||||
/* [id] represents all headings h1-h6, reset all margins */
|
||||
.gh-content [id] {
|
||||
.gh-content > [id] {
|
||||
margin: 0;
|
||||
color: var(--color-darkgrey);
|
||||
}
|
||||
|
||||
/* Add back a top margin to all headings, unless a heading
|
||||
is the very first element in the post content */
|
||||
.gh-content [id]:not(:first-child) {
|
||||
.gh-content > [id]:not(:first-child) {
|
||||
margin: 2em 0 0;
|
||||
}
|
||||
|
||||
@ -963,12 +920,12 @@ is the very first element in the post content */
|
||||
}
|
||||
|
||||
/* A larger margin before/after HRs and blockquotes */
|
||||
.gh-content hr,
|
||||
.gh-content blockquote {
|
||||
.gh-content > hr,
|
||||
.gh-content > blockquote {
|
||||
margin-top: 6vmin;
|
||||
}
|
||||
.gh-content hr + *,
|
||||
.gh-content blockquote + * {
|
||||
.gh-content > hr + *,
|
||||
.gh-content > blockquote + * {
|
||||
margin-top: 6vmin !important;
|
||||
}
|
||||
|
||||
@ -1357,21 +1314,13 @@ Ghost editor. */
|
||||
|
||||
.article-byline-meta {
|
||||
color: color-mod(var(--color-midgrey));
|
||||
font-size: 1.3rem;
|
||||
font-size: 1.4rem;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
|
||||
.article-byline-meta h4 {
|
||||
margin: 0 0 3px;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.article-byline-meta h4 a {
|
||||
color: color-mod(var(--color-darkgrey));
|
||||
}
|
||||
|
||||
.article-byline-meta h4 a:hover {
|
||||
color: var(--color-darkgrey);
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
|
||||
.article-byline-meta .bull {
|
||||
@ -1384,8 +1333,8 @@ Ghost editor. */
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
margin: 0 -4px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border: #fff 2px solid;
|
||||
border-radius: 100%;
|
||||
transition: all 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99) 700ms;
|
||||
@ -1805,10 +1754,6 @@ html.dark-mode img {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
html.dark-mode .site-header-background:before {
|
||||
background: rgba(0,0,0,0.6);
|
||||
}
|
||||
|
||||
html.dark-mode .post-card,
|
||||
html.dark-mode .post-card:hover {
|
||||
border-bottom-color: color-mod(var(--color-darkmode) l(+8%));
|
||||
@ -1838,11 +1783,6 @@ html.dark-mode .post-card-excerpt {
|
||||
color: color-mod(var(--color-midgrey) l(+10%));
|
||||
}
|
||||
|
||||
html.dark-mode .author-avatar,
|
||||
html.dark-mode .static-avatar {
|
||||
border-color: color-mod(var(--color-darkgrey) l(+2%));
|
||||
}
|
||||
|
||||
html.dark-mode .post-full-content {
|
||||
background: var(--color-darkmode);
|
||||
}
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
{{> "site-nav"}}
|
||||
</div>
|
||||
</div>
|
||||
{{> header-background background=cover_image}} {{!--Special header-image.hbs partial to generate the background image--}}
|
||||
<div class="outer site-header-background no-image">
|
||||
<div class="inner">
|
||||
<div class="site-header-content author-header">
|
||||
{{#if profile_image}}
|
||||
|
||||
19
index.hbs
19
index.hbs
@ -3,18 +3,31 @@
|
||||
into the {body} of the default.hbs template --}}
|
||||
|
||||
<header class="site-home-header">
|
||||
{{> header-background background=@site.cover_image}} {{!--Special header-image.hbs partial to generate the background image--}}
|
||||
<div class="outer site-header-background">
|
||||
{{#if @site.cover_image}}
|
||||
{{!-- This is a responsive image, it loads different sizes depending on device
|
||||
https://medium.freecodecamp.org/a-guide-to-responsive-images-with-ready-to-use-templates-c400bd65c433 --}}
|
||||
<img class="site-header-cover"
|
||||
srcset="{{img_url @site.cover_image size="s"}} 300w,
|
||||
{{img_url @site.cover_image size="m"}} 600w,
|
||||
{{img_url @site.cover_image size="l"}} 1000w,
|
||||
{{img_url @site.cover_image size="xl"}} 2000w"
|
||||
sizes="100vw"
|
||||
src="{{img_url @site.cover_image size="xl"}}"
|
||||
alt=""
|
||||
/>
|
||||
{{/if}}
|
||||
<div class="inner">
|
||||
{{> "site-nav"}}
|
||||
<div class="site-header-content">
|
||||
<h1 class="site-title">
|
||||
{{#if @site.logo}}
|
||||
<img class="site-logo" src="{{img_url @site.logo size="l"}}" alt="{{@site.title}}" />
|
||||
<img class="site-logo" src="{{img_url @site.logo size="m"}}" alt="{{@site.title}}" />
|
||||
{{else}}
|
||||
{{@site.title}}
|
||||
{{/if}}
|
||||
</h1>
|
||||
<h2 class="site-description">{{@site.description}}</h2>
|
||||
<p>{{@site.description}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,47 +0,0 @@
|
||||
{{!--
|
||||
Wow what the hell is going on in here even?
|
||||
|
||||
Ok so, several templates use this big header with a giant BG image. Nice idea, but big images
|
||||
have a heavy impact on performance, so it's a good idea to make them responsive. Because we
|
||||
can only get the image dynamically using Handlebars, and we can only set the image to properly
|
||||
be a background image using CSS, we end up with a handful of inline styles.
|
||||
|
||||
If the template in question has a background image, then we render responsive image styles
|
||||
for it, and apply those styles to the <header> tag. Else, we just output a <header> tag
|
||||
with a `no-image` class so we can style it accordingly.
|
||||
--}}
|
||||
|
||||
{{#if background}}
|
||||
|
||||
<style type="text/css">
|
||||
.responsive-header-img {
|
||||
background-image: url({{img_url background size='xl'}});
|
||||
}
|
||||
|
||||
@media(max-width: 1000px) {
|
||||
.responsive-header-img {
|
||||
background-image: url({{img_url background size='l'}});
|
||||
background-image: -webkit-image-set(url({{img_url background size='l'}}) 1x,
|
||||
url({{img_url background size='xl'}}) 2x);
|
||||
background-image: image-set(url({{img_url background size='l'}}) 1x,
|
||||
url({{img_url background size='xl'}}) 2x);
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: 600px) {
|
||||
.responsive-header-img {
|
||||
background-image: url({{img_url background size='m'}});
|
||||
background-image: -webkit-image-set(url({{img_url background size='m'}}) 1x,
|
||||
url({{img_url background size='l'}}) 2x);
|
||||
background-image: image-set(url({{img_url background size='m'}}) 1x,
|
||||
url({{img_url background size='l'}}) 2x);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<div class="outer site-header-background responsive-header-img">
|
||||
|
||||
{{else}}
|
||||
|
||||
<div class="outer site-header-background no-image">
|
||||
|
||||
{{/if}}
|
||||
@ -21,18 +21,14 @@
|
||||
{{navigation type="secondary"}}
|
||||
{{else}}
|
||||
<div class="social-links">
|
||||
{{#if @site.facebook}}
|
||||
<a class="social-link social-link-fb" href="{{facebook_url @site.facebook}}" title="Facebook" target="_blank" rel="noopener">{{> "icons/facebook"}}</a>
|
||||
{{/if}}
|
||||
{{#if @site.twitter}}
|
||||
<a class="social-link social-link-tw" href="{{twitter_url @site.twitter}}" title="Twitter" target="_blank" rel="noopener">{{> "icons/twitter"}}</a>
|
||||
{{/if}}
|
||||
</div>
|
||||
<a class="rss-button" href="https://feedly.com/i/subscription/feed/{{@site.url}}/rss/" title="RSS" target="_blank" rel="noopener">{{> "icons/rss"}}</a>
|
||||
{{/if}}
|
||||
|
||||
{{#unless @member}}
|
||||
<a class="subscribe-button" href="#subscribe">Subscribe</a>
|
||||
<a class="subscribe-button" href="#/portal">Subscribe</a>
|
||||
{{else}}
|
||||
<a class="subscribe-button" href="#/portal/account">Account</a>
|
||||
{{/unless}}
|
||||
|
||||
3
post.hbs
3
post.hbs
@ -98,7 +98,7 @@ into the {body} tag of the default.hbs template --}}
|
||||
This query gets the latest 3 posts on the site, but adds a filter to
|
||||
exclude the post we're currently on from being included. --}}
|
||||
|
||||
{{#get "posts" filter="id:-{{id}}" limit="3" as |more_posts|}}
|
||||
{{#get "posts" filter="id:-{{id}}" include="authors" limit="3" as |more_posts|}}
|
||||
{{#if more_posts}}
|
||||
{{#foreach more_posts}}
|
||||
{{> "post-card"}}
|
||||
@ -109,6 +109,7 @@ into the {body} tag of the default.hbs template --}}
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
|
||||
{{/post}}
|
||||
|
||||
|
||||
|
||||
2
tag.hbs
2
tag.hbs
@ -8,7 +8,7 @@
|
||||
{{> "site-nav"}}
|
||||
</div>
|
||||
</div>
|
||||
{{> header-background background=feature_image}} {{!--Special header-image.hbs partial to generate the background image--}}
|
||||
<div class="outer site-header-background">
|
||||
<div class="inner site-header-content">
|
||||
<h1 class="site-title">{{name}}</h1>
|
||||
<h2 class="site-description">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user