Author profile

This commit is contained in:
John O'Nolan 2021-03-04 17:22:45 -05:00
parent b5d0589222
commit 7617c7baf2
11 changed files with 195 additions and 272 deletions

View File

@ -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%;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.8rem}}h2{margin:1.5em 0 .5em;font-size:2.8rem;font-weight:700}@media (max-width:600px){h2{font-size:2.3rem}}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{font-size:62.5%;-webkit-tap-highlight-color:rgba(0,0,0,0)}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.8rem}}h2{margin:1.5em 0 .5em;font-size:2.8rem;font-weight:700}@media (max-width:600px){h2{font-size:2.3rem}}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 */ /*# 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

View File

@ -255,14 +255,11 @@ th {
========================================================================== */ ========================================================================== */
html { html {
overflow-x: hidden;
overflow-y: scroll;
font-size: 62.5%; font-size: 62.5%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
} }
body { body {
overflow-x: hidden;
color: #35373A; color: #35373A;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
font-size: 1.6rem; font-size: 1.6rem;

View File

@ -49,7 +49,6 @@ production stylesheet in assets/built/screen.css
--ghost-accent-color: {value}; --ghost-accent-color: {value};
You can use this variale throughout your styles You can use this variale throughout your styles
*/ */
/* Fonts */ /* Fonts */
@ -332,8 +331,11 @@ production stylesheet in assets/built/screen.css
padding: 5px 0; padding: 5px 0;
} }
.gh-social a { .gh-social {
margin: 0 1.5vmin 0 0; margin: 0 1.5vmin 0 0;
}
.gh-social a {
opacity: 0.8 opacity: 0.8
} }
.gh-social a:hover { .gh-social a:hover {
@ -967,6 +969,7 @@ is the very first element in the post content */
/* A larger margin before/after HRs and blockquotes */ /* A larger margin before/after HRs and blockquotes */
.gh-content > hr, .gh-content > hr,
.gh-content > blockquote { .gh-content > blockquote {
position: relative;
margin-top: 6vmin; margin-top: 6vmin;
} }
.gh-content > hr + *, .gh-content > hr + *,
@ -997,19 +1000,20 @@ is the very first element in the post content */
padding-left: 1.9em; padding-left: 1.9em;
} }
.gh-content blockquote { .gh-content > blockquote {
position: relative; position: relative;
font-style: italic; font-style: italic;
padding: 0;
} }
.gh-content blockquote::before { .gh-content > blockquote::before {
content: ""; content: "";
position: absolute; position: absolute;
left: -1.5em; left: -1.5em;
top: 0; top: 0;
bottom: 0; bottom: 0;
width: 0.3rem; width: 0.3rem;
background: var(--color-primary); background: var(--ghost-accent-color);
} }
.gh-content :not(pre) code { .gh-content :not(pre) code {
@ -1470,6 +1474,10 @@ Ghost editor. */
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
.read-more .post-card-byline-content a {
color: #fff;
}
@media (max-width: 1000px) { @media (max-width: 1000px) {
.read-more { .read-more {
@ -1492,154 +1500,92 @@ Ghost editor. */
/* 8. Author Template /* 8. Author Template
/* ---------------------------------------------------------- */ /* ---------------------------------------------------------- */
.author-header {
display: flex; .author-template .posts {
flex-direction: row; position: relative;
justify-content: flex-start; height: 100%;
align-items: flex-start; display: grid;
padding: 10vw 0 10px; grid-template-columns: 200px 1fr 1fr;
grid-gap: 4vmin;
} }
.site-archive-header .author-header { .author-template .posts .post-feed {
align-items: center; grid-column: 2 / 4;
grid-template-columns: 1fr 1fr;
} }
.site-archive-header .no-image .author-header { .author-profile {
padding-bottom: 20px; padding: 4vmin 0;
} }
.author-header-content { .author-profile-content {
display: flex; height: auto;
flex-direction: column; position: sticky;
justify-content: center; top: 4vmin;
margin: 5px 0 0 30px;
}
.site-header-content .author-profile-image {
z-index: 10;
flex-shrink: 0;
margin: -4px 0 0;
width: 110px;
height: 110px;
box-shadow: rgba(255,255,255,0.1) 0 0 0 6px;
}
.author-header-content .author-bio {
z-index: 10;
flex-shrink: 0;
margin: 6px 0 0;
max-width: 46em;
font-size: 2.0rem;
line-height: 1.3em;
font-weight: 400;
opacity: 0.8;
}
.author-header-content .author-meta {
z-index: 10;
flex-shrink: 0;
display: flex;
align-items: center;
margin: 0 0 0 1px;
font-size: 1.4rem; font-size: 1.4rem;
font-weight: 400; line-height: 1.4em;
letter-spacing: 0.2px; }
.author-profile-pic {
display: block;
width: 150px;
height: 150px;
object-fit: cover;
margin: 0 0 2rem;
}
.author-profile h1 {
margin: 0 0 0.3em;
font-size: 2rem;
}
.author-profile p {
color: color-mod(var(--color-midgrey) l(-8%));
}
.author-profile-location {
margin: 0 0 1.5em;
font-weight: 700;
}
.author-profile-social-link {
display: block;
padding: 0 0 5px;
font-size: 1.3rem;
color: color-mod(var(--color-midgrey) l(-8%));
text-overflow: ellipsis;
overflow: hidden;
max-width: 100%;
white-space: nowrap; white-space: nowrap;
} }
.author-header-content .social-link:first-of-type { .author-profile-social-link:hover {
padding-left: 4px;
}
.no-image .author-header-content .author-bio {
color: var(--color-midgrey);
opacity: 1.0;
}
.no-image .author-header-content .author-meta {
color: var(--color-midgrey);
opacity: 1.0;
}
.author-social-link a {
color: #fff;
font-weight: 600;
}
.no-image .author-social-link a {
color: var(--color-darkgrey); color: var(--color-darkgrey);
} }
.author-social-link a:hover { @media (max-width: 900px) {
opacity: 1; .author-template .posts .post-feed {
} grid-template-columns: 1fr;
.author-social-link {
display: inline-block;
margin: 0;
padding: 6px 0;
}
.author-location + .author-stats:before,
.author-stats + .author-social-link:before,
.author-social-link + .author-social-link:before {
content: "\2022";
display: inline-block;
margin: 0 12px;
color: #fff;
opacity: 0.6;
}
.no-image .author-location + .author-stats:before,
.no-image .author-stats + .author-social-link:before,
.no-image .author-social-link + .author-social-link:before {
color: var(--color-midgrey);
}
@media (max-width: 700px) {
.author-location,
.author-stats,
.author-stats + .author-social-link:first-of-type:before {
display: none;
} }
} }
@media (max-width: 500px) { @media (max-width: 650px) {
.author-header { .author-template .posts {
padding: 10px 0 0; grid-template-columns: 1fr;
grid-gap: 0;
} }
.author-template .posts .post-feed {
.no-image .author-header { grid-column: 1 / auto;
padding-bottom: 10px;
} }
.author-profile {
.author-header-content { padding-right: 0;
}
.author-profile-content {
display: flex;
flex-direction: column;
align-items: center; align-items: center;
margin: 16px 0 0 0;
}
.site-header-content .author-profile-image {
width: 96px;
height: 96px;
}
.author-header-content .author-bio {
font-size: 1.8rem;
line-height: 1.3em;
letter-spacing: 0;
text-align: center; text-align: center;
} }
.author-header-content .author-meta {
margin-top: 8px;
}
.author-location + .author-stats:before,
.author-stats + .author-social-link:before,
.author-social-link + .author-social-link:before {
display: inline;
margin: 0 6px;
}
} }
@ -1650,37 +1596,23 @@ Ghost editor. */
padding: 14vw 4vw 6vw; padding: 14vw 4vw 6vw;
} }
.site-nav-center {
display: flex;
justify-content: center;
align-items: center;
padding: 10px 0;
text-align: center;
}
.site-nav-center .site-nav-logo {
margin-right: 0;
}
.error-message { .error-message {
padding-bottom: 10vw; padding-bottom: 10vw;
border-bottom: 1px solid color-mod(var(--color-lightgrey) l(+10%));
text-align: center; text-align: center;
} }
.error-code { .error-code {
margin: 0; margin: 0;
color: var(--color-lightgrey); color: var(--ghost-accent-color);
font-size: 12vw; font-size: 12vw;
line-height: 1em; line-height: 1em;
letter-spacing: -5px; letter-spacing: -5px;
opacity: 0.75;
} }
.error-description { .error-description {
margin: 0; margin: 0;
color: var(--color-midgrey); color: var(--color-midgrey);
font-size: 3rem; font-size: 3.2rem;
line-height: 1.3em; line-height: 1.3em;
font-weight: 400; font-weight: 400;
} }
@ -1730,62 +1662,79 @@ Ghost editor. */
.site-footer { .site-footer {
position: relative; position: relative;
margin: 40px 0 0 0; margin: 40px 0 0 0;
padding-top: 40px; padding: 40px 4vmin 140px;
padding-bottom: 140px;
color: #fff; color: #fff;
background: color-mod(var(--color-darkgrey) l(-5%)); background: color-mod(var(--color-darkgrey) l(-5%));
} }
.site-footer-content { .site-footer .inner {
display: flex; display: grid;
flex-wrap: wrap; grid-gap: 40px;
justify-content: space-between; grid-template-columns: auto 1fr auto;
align-items: center;
color: rgba(255,255,255,0.7); color: rgba(255,255,255,0.7);
font-size: 1.3rem; font-size: 1.3rem;
} }
.site-footer-content a { .site-footer .copyright a {
color: #fff;
letter-spacing: -0.015em;
font-weight: 500;
}
.site-footer a {
color: rgba(255,255,255,0.7); color: rgba(255,255,255,0.7);
} }
.site-footer-content a:hover { .site-footer a:hover {
color: rgba(255,255,255,1); color: rgba(255,255,255,1);
text-decoration: none; text-decoration: none;
} }
.site-footer-nav { .site-footer-nav ul {
display: flex; display: flex;
justify-content: center;
flex-wrap: wrap;
margin: 0 0 20px;
padding: 0;
list-style: none;
}
.site-footer-nav li {
display: inline-flex;
align-items: center;
padding: 0;
margin: 0;
line-height: 2em;
} }
.site-footer-nav a { .site-footer-nav a {
position: relative; position: relative;
margin-left: 20px; display: inline-flex;
align-items: center;
margin-left: 10px;
} }
.site-footer-nav a:before { .site-footer-nav li:not(:first-child) a:before {
content: ""; content: "";
position: absolute;
top: 11px;
left: -11px;
display: block; display: block;
width: 2px; width: 2px;
height: 2px; height: 2px;
margin: 0 10px 0 0;
background: #fff; background: #fff;
border-radius: 100%; border-radius: 100%;
} }
.site-footer-nav a:first-of-type:before { @media (max-width: 800px) {
display: none; .site-footer .inner {
max-width: 500px;
grid-template-columns: 1fr;
grid-gap: 0;
text-align: center;
} }
.site-footer .copyright,
@media (max-width: 650px) { .site-footer .copyright a {
.site-footer-content { color: #fff;
flex-direction: column; font-size: 1.5rem;
}
.site-footer-nav a:first-child {
margin-left: 0;
} }
} }
@ -1818,10 +1767,6 @@ html.dark-mode .post-card:hover {
border-bottom-color: color-mod(var(--color-darkmode) l(+8%)); border-bottom-color: color-mod(var(--color-darkmode) l(+8%));
} }
html.dark-mode .author-profile-image {
background: var(--color-darkmode);
}
html.dark-mode .post-card-byline-content a { html.dark-mode .post-card-byline-content a {
color: rgba(255, 255, 255, 0.75); color: rgba(255, 255, 255, 0.75);
} }
@ -1958,10 +1903,6 @@ html.dark-mode .site-archive-header .no-image {
background: var(--color-darkmode); background: var(--color-darkmode);
} }
html.dark-mode .site-header-content .author-profile-image {
box-shadow: 0 0 0 6px hsla(0,0%,100%,0.04);
}
html.dark-mode .subscribe-form { html.dark-mode .subscribe-form {
border: none; border: none;
background: linear-gradient(color-mod(var(--color-darkmode) l(-6%)), color-mod(var(--color-darkmode) l(-3%))); background: linear-gradient(color-mod(var(--color-darkmode) l(-6%)), color-mod(var(--color-darkmode) l(-3%)));
@ -1997,3 +1938,18 @@ html.dark-mode .subscribe-form .error .message-error {
html.dark-mode .subscribe-form .success .message-success { html.dark-mode .subscribe-form .success .message-success {
color: color-mod(var(--color-green) l(+5%) s(-5%)); color: color-mod(var(--color-green) l(+5%) s(-5%));
} }
/*
Hey! You reached the end.
Hope you enjoyed this CSS file, if you have any suggestions
for improvements that might be useful for everyone who uses
this theme, you can find the open source repository for it
here: https://github.com/tryghost/casper
Or, if you've just scrolled all the way to the bottom of the
file to add some of your own styles. Well, you've come to
the right place. Onward!
*/

View File

@ -2,56 +2,48 @@
{{!-- The tag above means - insert everything in this file into the {body} of the default.hbs template --}} {{!-- The tag above means - insert everything in this file into the {body} of the default.hbs template --}}
{{#author}}
{{!-- Everything inside the #author tags pulls data from the author --}}
<div class="outer site-header-background no-image">
<div class="inner">
<div class="site-header-content author-header">
{{#if profile_image}}
<img class="author-profile-image" src="{{profile_image}}" alt="{{name}}" />
{{else}}
<span class="author-profile-image">{{> "icons/avatar"}}</span>
{{/if}}
<div class="author-header-content">
<h1 class="site-title">{{name}}</h1>
{{#if bio}}
<h2 class="author-bio">{{bio}}</h2>
{{/if}}
<div class="author-meta">
{{#if location}}
<div class="author-location">{{location}}</div>
{{/if}}
<div class="author-stats">
{{plural ../pagination.total empty='No posts' singular='% post' plural='% posts'}}
</div>
{{#if website}}
<span class="author-social-link"><a href="{{website}}" target="_blank" rel="noopener">Website</a></span>
{{/if}}
{{#if twitter}}
<span class="author-social-link"><a href="{{twitter_url}}" target="_blank" rel="noopener">Twitter</a></span>
{{/if}}
{{#if facebook}}
<span class="author-social-link"><a href="{{facebook_url}}" target="_blank" rel="noopener">Facebook</a></span>
{{/if}}
</div>
</div>
</div>
</div>
</div>
{{/author}}
{{!-- The main content area --}}
<section class="outer"> <section class="outer">
<div class="inner posts"> <div class="inner posts">
<header class="author-profile">
{{#author}}
{{!-- Everything inside the #author tags pulls data from the author --}}
<div class="author-profile-content">
{{#if profile_image}}
<img class="author-profile-pic" src="{{profile_image}}" alt="{{name}}" />
{{else}}
<span class="author-profile-pic">{{> "icons/avatar"}}</span>
{{/if}}
<h1>{{name}}</h1>
{{#if bio}}<p>{{bio}}</p>{{/if}}
<div class="author-profile-meta">
{{#if location}}
<div class="author-profile-location">📍 {{location}}</div>
{{/if}}
{{#if website}}
<a class="author-profile-social-link" href="{{website}}" target="_blank" rel="noopener">{{website}}</a>
{{/if}}
{{#if twitter}}
<a class="author-profile-social-link" href="{{twitter_url}}" target="_blank" rel="noopener">{{twitter_url}}</a>
{{/if}}
{{#if facebook}}
<a class="author-profile-social-link" href="{{facebook_url}}" target="_blank" rel="noopener">{{facebook_url}}</a>
{{/if}}
</div>
</div>
{{/author}}
</header>
<div class="post-feed"> <div class="post-feed">
{{#foreach posts}} {{#foreach posts}}
{{!-- The tag below includes the markup for each post - partials/post-card.hbs --}} {{!-- The tag below includes the markup for each post - partials/post-card.hbs --}}
{{> "post-card"}} {{> "post-card"}}
{{/foreach}} {{/foreach}}
</div> </div>

View File

@ -64,14 +64,12 @@
{{!-- The global footer at the very bottom of the screen --}} {{!-- The global footer at the very bottom of the screen --}}
<footer class="site-footer outer"> <footer class="site-footer outer">
<div class="site-footer-content inner"> <div class="inner">
<section class="copyright"><a href="{{@site.url}}">{{@site.title}}</a> &copy; {{date format="YYYY"}}</section> <section class="copyright"><a href="{{@site.url}}">{{@site.title}}</a> &copy; {{date format="YYYY"}}</section>
<nav class="site-footer-nav"> <nav class="site-footer-nav">
<a href="{{@site.url}}">Latest Posts</a> {{navigation type="secondary"}}
{{#if @site.facebook}}<a href="{{facebook_url @site.facebook}}" target="_blank" rel="noopener">Facebook</a>{{/if}}
{{#if @site.twitter}}<a href="{{twitter_url @site.twitter}}" target="_blank" rel="noopener">Twitter</a>{{/if}}
<a href="https://ghost.org/" target="_blank" rel="noopener">Powered by Ghost</a>
</nav> </nav>
<div><a href="https://ghost.org/" target="_blank" rel="noopener">Powered by Ghost</a></div>
</div> </div>
</footer> </footer>
@ -92,6 +90,8 @@ $(document).ready(function () {
$('.gh-burger').click(function () { $('.gh-burger').click(function () {
$('body').toggleClass('gh-head-open'); $('body').toggleClass('gh-head-open');
}); });
// FitVids - Makes video embeds responsive
$(".gh-content").fitVids();
}); });
</script> </script>

View File

@ -19,13 +19,19 @@ Keep this template as lightweight as you can!
<p class="error-description">{{message}}</p> <p class="error-description">{{message}}</p>
<a class="error-link" href="{{@site.url}}">Go to the front page →</a> <a class="error-link" href="{{@site.url}}">Go to the front page →</a>
</section> </section>
{{#get "posts" limit="3" include="authors,tags"}}
<div class="post-feed">
{{#foreach posts}}
{{> "post-card"}}
{{/foreach}}
</div>
{{/get}}
</div> </div>
</section> </section>
{{!-- Given that people landing on this page didn't find what they
were looking for, let's give them some alternative stuff to read. --}}
<aside class="read-more-wrap">
<div class="read-more inner">
{{#get "posts" include="authors" limit="3" as |more_posts|}}
{{#if more_posts}}
{{#foreach more_posts}}
{{> "post-card"}}
{{/foreach}}
{{/if}}
{{/get}}
</div>
</aside>

View File

@ -41,13 +41,3 @@ into the {body} tag of the default.hbs template --}}
</article> </article>
{{/post}} {{/post}}
{{!-- Scripts - Extra functionality for the post template --}}
<script>
$(document).ready(function () {
// FitVids - Makes video embeds responsive
var $postContent = $(".gh-content");
$postContent.fitVids();
});
</script>

View File

@ -114,22 +114,4 @@ into the {body} tag of the default.hbs template --}}
</div> </div>
</aside> </aside>
{{/post}} {{/post}}
{{!-- Scripts - Extra functionality for the post template --}}
<script>
$(document).ready(function () {
// FitVids - Makes video embeds responsive
var $postContent = $(".gh-content");
$postContent.fitVids();
// StickyNavTitle - Shows post title in navbar when scrolling
Casper.stickyNavTitle({
navSelector: '.site-nav-main',
titleSelector: '.article-title',
activeClass: 'nav-post-title-active'
});
});
</script>