Author profile
This commit is contained in:
John O'Nolan
parent
b5d0589222
commit
7617c7baf2
11 changed files with 195 additions and 272 deletions
|
|
@ -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 */
|
||||
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
|
|
@ -255,14 +255,11 @@ th {
|
|||
========================================================================== */
|
||||
|
||||
html {
|
||||
overflow-x: hidden;
|
||||
overflow-y: scroll;
|
||||
font-size: 62.5%;
|
||||
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
body {
|
||||
overflow-x: hidden;
|
||||
color: #35373A;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
|
||||
font-size: 1.6rem;
|
||||
|
|
|
|||
|
|
@ -49,7 +49,6 @@ production stylesheet in assets/built/screen.css
|
|||
--ghost-accent-color: {value};
|
||||
|
||||
You can use this variale throughout your styles
|
||||
|
||||
*/
|
||||
|
||||
/* Fonts */
|
||||
|
|
@ -332,8 +331,11 @@ production stylesheet in assets/built/screen.css
|
|||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.gh-social a {
|
||||
.gh-social {
|
||||
margin: 0 1.5vmin 0 0;
|
||||
}
|
||||
|
||||
.gh-social a {
|
||||
opacity: 0.8
|
||||
}
|
||||
.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 */
|
||||
.gh-content > hr,
|
||||
.gh-content > blockquote {
|
||||
position: relative;
|
||||
margin-top: 6vmin;
|
||||
}
|
||||
.gh-content > hr + *,
|
||||
|
|
@ -997,19 +1000,20 @@ is the very first element in the post content */
|
|||
padding-left: 1.9em;
|
||||
}
|
||||
|
||||
.gh-content blockquote {
|
||||
.gh-content > blockquote {
|
||||
position: relative;
|
||||
font-style: italic;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.gh-content blockquote::before {
|
||||
.gh-content > blockquote::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: -1.5em;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 0.3rem;
|
||||
background: var(--color-primary);
|
||||
background: var(--ghost-accent-color);
|
||||
}
|
||||
|
||||
.gh-content :not(pre) code {
|
||||
|
|
@ -1470,6 +1474,10 @@ Ghost editor. */
|
|||
color: rgba(255, 255, 255, 0.6);
|
||||
}
|
||||
|
||||
.read-more .post-card-byline-content a {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 1000px) {
|
||||
.read-more {
|
||||
|
|
@ -1492,154 +1500,92 @@ Ghost editor. */
|
|||
|
||||
/* 8. Author Template
|
||||
/* ---------------------------------------------------------- */
|
||||
.author-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
padding: 10vw 0 10px;
|
||||
|
||||
.author-template .posts {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
display: grid;
|
||||
grid-template-columns: 200px 1fr 1fr;
|
||||
grid-gap: 4vmin;
|
||||
}
|
||||
|
||||
.site-archive-header .author-header {
|
||||
align-items: center;
|
||||
.author-template .posts .post-feed {
|
||||
grid-column: 2 / 4;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
|
||||
.site-archive-header .no-image .author-header {
|
||||
padding-bottom: 20px;
|
||||
.author-profile {
|
||||
padding: 4vmin 0;
|
||||
}
|
||||
|
||||
.author-header-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
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;
|
||||
.author-profile-content {
|
||||
height: auto;
|
||||
position: sticky;
|
||||
top: 4vmin;
|
||||
font-size: 1.4rem;
|
||||
font-weight: 400;
|
||||
letter-spacing: 0.2px;
|
||||
line-height: 1.4em;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.author-header-content .social-link:first-of-type {
|
||||
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 {
|
||||
.author-profile-social-link:hover {
|
||||
color: var(--color-darkgrey);
|
||||
}
|
||||
|
||||
.author-social-link a:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.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: 900px) {
|
||||
.author-template .posts .post-feed {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
.author-header {
|
||||
padding: 10px 0 0;
|
||||
@media (max-width: 650px) {
|
||||
.author-template .posts {
|
||||
grid-template-columns: 1fr;
|
||||
grid-gap: 0;
|
||||
}
|
||||
|
||||
.no-image .author-header {
|
||||
padding-bottom: 10px;
|
||||
.author-template .posts .post-feed {
|
||||
grid-column: 1 / auto;
|
||||
}
|
||||
|
||||
.author-header-content {
|
||||
.author-profile {
|
||||
padding-right: 0;
|
||||
}
|
||||
.author-profile-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.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 {
|
||||
padding-bottom: 10vw;
|
||||
border-bottom: 1px solid color-mod(var(--color-lightgrey) l(+10%));
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.error-code {
|
||||
margin: 0;
|
||||
color: var(--color-lightgrey);
|
||||
color: var(--ghost-accent-color);
|
||||
font-size: 12vw;
|
||||
line-height: 1em;
|
||||
letter-spacing: -5px;
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
.error-description {
|
||||
margin: 0;
|
||||
color: var(--color-midgrey);
|
||||
font-size: 3rem;
|
||||
font-size: 3.2rem;
|
||||
line-height: 1.3em;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
|
@ -1730,62 +1662,79 @@ Ghost editor. */
|
|||
.site-footer {
|
||||
position: relative;
|
||||
margin: 40px 0 0 0;
|
||||
padding-top: 40px;
|
||||
padding-bottom: 140px;
|
||||
padding: 40px 4vmin 140px;
|
||||
color: #fff;
|
||||
background: color-mod(var(--color-darkgrey) l(-5%));
|
||||
}
|
||||
|
||||
.site-footer-content {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.site-footer .inner {
|
||||
display: grid;
|
||||
grid-gap: 40px;
|
||||
grid-template-columns: auto 1fr auto;
|
||||
color: rgba(255,255,255,0.7);
|
||||
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);
|
||||
}
|
||||
|
||||
.site-footer-content a:hover {
|
||||
.site-footer a:hover {
|
||||
color: rgba(255,255,255,1);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.site-footer-nav {
|
||||
.site-footer-nav ul {
|
||||
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 {
|
||||
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: "";
|
||||
position: absolute;
|
||||
top: 11px;
|
||||
left: -11px;
|
||||
display: block;
|
||||
width: 2px;
|
||||
height: 2px;
|
||||
margin: 0 10px 0 0;
|
||||
background: #fff;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
.site-footer-nav a:first-of-type:before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (max-width: 650px) {
|
||||
.site-footer-content {
|
||||
flex-direction: column;
|
||||
@media (max-width: 800px) {
|
||||
.site-footer .inner {
|
||||
max-width: 500px;
|
||||
grid-template-columns: 1fr;
|
||||
grid-gap: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.site-footer-nav a:first-child {
|
||||
margin-left: 0;
|
||||
.site-footer .copyright,
|
||||
.site-footer .copyright a {
|
||||
color: #fff;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -1818,10 +1767,6 @@ html.dark-mode .post-card:hover {
|
|||
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 {
|
||||
color: rgba(255, 255, 255, 0.75);
|
||||
}
|
||||
|
|
@ -1958,10 +1903,6 @@ html.dark-mode .site-archive-header .no-image {
|
|||
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 {
|
||||
border: none;
|
||||
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 {
|
||||
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!
|
||||
|
||||
*/
|
||||
|
|
|
|||
78
author.hbs
78
author.hbs
|
|
@ -2,56 +2,48 @@
|
|||
{{!-- 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">
|
||||
<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">
|
||||
{{#foreach posts}}
|
||||
|
||||
{{!-- The tag below includes the markup for each post - partials/post-card.hbs --}}
|
||||
{{> "post-card"}}
|
||||
|
||||
{{/foreach}}
|
||||
</div>
|
||||
|
||||
|
|
|
|||
10
default.hbs
10
default.hbs
|
|
@ -64,14 +64,12 @@
|
|||
|
||||
{{!-- The global footer at the very bottom of the screen --}}
|
||||
<footer class="site-footer outer">
|
||||
<div class="site-footer-content inner">
|
||||
<div class="inner">
|
||||
<section class="copyright"><a href="{{@site.url}}">{{@site.title}}</a> © {{date format="YYYY"}}</section>
|
||||
<nav class="site-footer-nav">
|
||||
<a href="{{@site.url}}">Latest Posts</a>
|
||||
{{#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>
|
||||
{{navigation type="secondary"}}
|
||||
</nav>
|
||||
<div><a href="https://ghost.org/" target="_blank" rel="noopener">Powered by Ghost</a></div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
|
@ -92,6 +90,8 @@ $(document).ready(function () {
|
|||
$('.gh-burger').click(function () {
|
||||
$('body').toggleClass('gh-head-open');
|
||||
});
|
||||
// FitVids - Makes video embeds responsive
|
||||
$(".gh-content").fitVids();
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -19,13 +19,19 @@ Keep this template as lightweight as you can!
|
|||
<p class="error-description">{{message}}</p>
|
||||
<a class="error-link" href="{{@site.url}}">Go to the front page →</a>
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{{#get "posts" limit="3" include="authors,tags"}}
|
||||
<div class="post-feed">
|
||||
{{#foreach posts}}
|
||||
{{> "post-card"}}
|
||||
{{!-- 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}}
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/get}}
|
||||
</div>
|
||||
</section>
|
||||
</aside>
|
||||
12
page.hbs
12
page.hbs
|
|
@ -40,14 +40,4 @@ into the {body} tag of the default.hbs template --}}
|
|||
|
||||
</article>
|
||||
|
||||
{{/post}}
|
||||
|
||||
|
||||
{{!-- Scripts - Extra functionality for the post template --}}
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
// FitVids - Makes video embeds responsive
|
||||
var $postContent = $(".gh-content");
|
||||
$postContent.fitVids();
|
||||
});
|
||||
</script>
|
||||
{{/post}}
|
||||
20
post.hbs
20
post.hbs
|
|
@ -114,22 +114,4 @@ into the {body} tag of the default.hbs template --}}
|
|||
</div>
|
||||
</aside>
|
||||
|
||||
|
||||
{{/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>
|
||||
{{/post}}
|
||||
Loading…
Reference in a new issue