mirror of
				https://github.com/ZetaKebab/kesper.git
				synced 2025-11-04 08:09:49 +00:00 
			
		
		
		
	Author profile
This commit is contained in:
		@@ -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}}
 | 
			
		||||
		Reference in New Issue
	
	Block a user