diff --git a/README.md b/README.md index ad0f135..92a2a90 100644 --- a/README.md +++ b/README.md @@ -5,9 +5,9 @@ I created this theme as a way to learn how Ghost works. It is available for free [Demo](https://ireaderinokun.ghost.io) -![OpenWriter Example](http://www.ireaderinokun.com/openwriter-images/1.png) +![OpenWriter Example](screenshot1.png) -![OpenWriter Example](http://www.ireaderinokun.com/openwriter-images/8.png) +![OpenWriter Example](screenshot2.png) ## Getting Started @@ -43,7 +43,6 @@ Thanks to [Formspree](http://formspree.io), I was able to include a free contact 8. Visit the Contact page and fill in the form once to activate it with Formspree -![OpenWriter Example](http://www.ireaderinokun.com/openwriter-images/5.png) ### Cover Images @@ -55,6 +54,5 @@ Each page features a cover image. This is determined by the following hierarchy: Special thanks to [The Stocks](http://thestocks.im/) for providing the default cover image under the Creative Commons Zero licence. -![OpenWriter Example](http://www.ireaderinokun.com/openwriter-images/6.png) diff --git a/assets/css/style.css b/assets/css/style.css index 27658ce..08c716c 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -1 +1 @@ -@import url(http://fonts.googleapis.com/css?family=PT+Mono);@import url(http://fonts.googleapis.com/css?family=Libre+Baskerville:700,400italic,400);html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}body{line-height:1;}ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}table{border-collapse:collapse;border-spacing:0;}html{box-sizing:border-box;}*,*:before,*:after{box-sizing:inherit;}#hidden-nav{z-index:3;}main{z-index:2;}html{font-size:62.5%;}body,input,textarea{font-family:'Libre Baskerville',serif;font-size:14px;font-size:1.4rem;line-height:1.8;font-weight:400;color:#505050;}h1{font-family:'Libre Baskerville',serif;font-size:30px;font-size:3rem;color:#fafafa;}h2{font-size:22px;font-size:2.2rem;}h2 a{text-decoration:none;}h3{font-size:14px;font-size:1.4rem;font-weight:700;color:#c8c8c8;}label{font-style:italic;}a{color:inherit;font-weight:700;text-decoration:none;transition:color 0.6s;}a:hover{color:#710109;}nav a{text-decoration:none;}.btn,input[type="submit"],.homepage-links li a{font-family:'Libre Baskerville',serif;font-size:12px;font-size:1.2rem;}small{font-size:12px;font-size:1.2rem;}blockquote{font-size:2rem;}.regular nav{font-size:12px;font-size:1.2rem;}.regular nav .fa{font-size:18px;font-size:1.8rem;}pre,code{font-family:'PT Mono',monospace;}.btn,input[type="submit"],.homepage-links li a{width:16rem;min-height:3.5rem;margin:1rem 0;padding:0.4rem;text-align:center;border:3px solid #710109;border-radius:20px;display:inline-block;transition:background-color 0.6s,color 0.6s;}.btn:hover,input[type="submit"]:hover,.homepage-links li a:hover,.btn:focus,input[type="submit"]:focus,.homepage-links li a:focus{background-color:#710109;color:#fafafa;}.pagination{margin-top:1rem;}.pagination .page-number{margin:0 1rem;}span.error-message{padding-bottom:1rem;display:block;}body main,body footer{top:50vh;position:relative;}body.error-template main,body.error-template footer,body.author-template main,body.author-template footer,body.home-template main,body.home-template footer,body.private-template main,body.private-template footer{top:0;}header.regular{position:fixed;top:0;left:0;background-size:cover;background-position:center;width:100%;height:50vh;}header.regular nav{color:#fafafa;}.title-container{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-o-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:75%;text-align:center;}.regular nav{position:absolute;top:0;left:0;width:100%;height:50px;padding:0 7%;line-height:50px;}.regular nav:after{content:"";display:table;clear:both;}.brand{float:left;}.brand img{height:35px;width:auto;margin-top:7px;}ul.navigation{float:right;}@media screen and (min-width: 600px){ul.navigation li{display:inline-block;padding:0 5px;margin:0 5px;}ul.navigation li#show-nav{display:none;}}@media screen and (max-width: 600px){ul.navigation li{display:none;}ul.navigation li#show-nav{display:inline-block;}}#hidden-nav{top:-50vh;position:fixed;width:100%;height:50vh;background-color:#c8c8c8;text-align:center;padding:20px;}#hidden-nav ul{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-o-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:85%;}#hidden-nav li{display:block;padding:1rem;border-bottom:1px solid #fafafa;}#hidden-nav li a{text-decoration:none;}#hidden-nav li:last-child{border-bottom:none;}p{margin-bottom:1.5rem;}blockquote{margin-bottom:1.5rem;border-left:5px solid #c8c8c8;padding:1rem;quotes:"\201C" "\201D" "\2018" "\2019";}blockquote p{margin-bottom:0;}blockquote:before{content:open-quote;float:left;padding-right:1rem;font-size:5rem;line-height:1;color:#c8c8c8;}pre,code{background-color:#fff;}code{padding:0 5px;}pre{padding:10px;margin-bottom:1.5rem;}.post-content h1,.post-content h2,.post-content h3{margin:2.5rem 0 1.5rem;}.post-content ul{list-style-type:disc;}.post-content ul,.post-content ol{display:block;width:100%;padding-left:10%;margin-bottom:1.5rem;}.post-content img{max-width:100%;height:auto;margin:0 auto;}.post-excerpt{padding:2rem 0;border-top:1px solid #c8c8c8;}.post-excerpt:after{content:"";display:table;clear:both;}.post-excerpt hgroup{padding-bottom:2rem;}.post-excerpt .read-more{float:right;}.post-excerpt:first-child{border-top:none;}.pagination{width:100%;text-align:center;margin-bottom:20px;}textarea,input,input[type="text"],input[type="button"],input[type="submit"]{-webkit-appearance:none;-moz-appearance:none;border-radius:0;}input,textarea{margin:0.3rem auto 1rem;padding:5px;text-align:center;border:3px solid #c8c8c8;width:85%;max-width:400px;outline:none;}input:focus,textarea:focus{border:3px solid #710109;}input{height:3.5rem;}input[type="submit"]{border-radius:20px;background-color:#fafafa;cursor:pointer;}label,input,textarea{display:block;}#contactform{text-align:center;margin-top:3rem;}html,body{background-color:#fafafa;}main{width:100%;padding:3rem 7% 2rem;margin:0 auto;background-color:#fafafa;position:relative;}.post-content,.post-excerpt{max-width:960px;margin-left:auto;margin-right:auto;}footer{height:70px;border-top:1px solid #c8c8c8;text-align:center;padding:20px;position:relative;background-color:#fff;}#homepage-hero{background-size:cover;background-position:center;width:100%;height:100vh;position:relative;color:#fafafa;}#homepage-hero .btn,#homepage-hero input[type="submit"],#homepage-hero .homepage-links li a,.homepage-links li #homepage-hero a{margin:1rem;}.blog-description{margin:2rem auto;}.homepage-links li{display:inline-block;}.homepage-links li a{display:inline-block;}body.post-template .post-excerpt .author{display:none;}.post-meta,.tags{color:#fafafa;}.tags{margin-top:1.5rem;}.post-footer{margin-top:3rem;padding-top:2rem;padding-bottom:3rem;text-align:center;}.post-footer .share .fa{width:30px;height:30px;background-color:#c8c8c8;color:#fafafa;border-radius:50%;text-align:center;padding:8px;margin:5px 0 0 5px;transition:background-color 0.6s;}.post-footer .share .fa:hover{background-color:#710109;}.more-post{border-top:1px solid #c8c8c8;text-align:left;} \ No newline at end of file +@import url(http://fonts.googleapis.com/css?family=PT+Mono);@import url(http://fonts.googleapis.com/css?family=Libre+Baskerville:700,400italic,400);html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}#hidden-nav{z-index:3}main{z-index:2}html{font-size:62.5%}body,input,textarea{font-family:"Libre Baskerville",serif;font-size:14px;font-size:1.4rem;line-height:1.8;font-weight:400;color:#505050}h1{font-family:"Libre Baskerville",serif;font-size:30px;font-size:3rem;color:#fafafa}h2{font-size:22px;font-size:2.2rem}h2 a{text-decoration:none}h3{font-size:14px;font-size:1.4rem;font-weight:700;color:#c8c8c8}label{font-style:italic}a{color:inherit;font-weight:700;text-decoration:none;transition:color 0.6s}a:hover{color:#710109}nav a{text-decoration:none}.btn,input[type="submit"],.homepage-links li a{font-family:"Libre Baskerville",serif;font-size:12px;font-size:1.2rem}small{font-size:12px;font-size:1.2rem}blockquote{font-size:2rem}.regular nav{font-size:12px;font-size:1.2rem}.regular nav .fa{font-size:18px;font-size:1.8rem}pre,code{font-family:"PT Mono",monospace}.btn,input[type="submit"],.homepage-links li a{width:16rem;min-height:3.5rem;margin:1rem 0;padding:0.4rem;text-align:center;border:3px solid #710109;border-radius:20px;display:inline-block;transition:background-color 0.6s, color 0.6s}.btn:hover,input[type="submit"]:hover,.homepage-links li a:hover,.btn:focus,input[type="submit"]:focus,.homepage-links li a:focus{background-color:#710109;color:#fafafa}.pagination{margin-top:1rem}.pagination .page-number{margin:0 1rem}span.error-message{padding-bottom:1rem;display:block}body main,body footer{top:50vh;position:relative}body.error-template main,body.error-template footer,body.author-template main,body.author-template footer,body.home-template main,body.home-template footer,body.private-template main,body.private-template footer{top:0}header.regular{position:fixed;top:0;left:0;background-size:cover;background-position:center;width:100%;height:50vh}header.regular nav{color:#fafafa}.title-container{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-o-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:75%;text-align:center}.regular nav{position:absolute;top:0;left:0;width:100%;height:50px;padding:0 7%;line-height:50px}.regular nav:after{content:"";display:table;clear:both}.brand{float:left}.brand img{height:35px;width:auto;margin-top:7px}ul.navigation{float:right}@media screen and (min-width: 600px){ul.navigation li{display:inline-block;padding:0 5px;margin:0 5px}ul.navigation li#show-nav{display:none}}@media screen and (max-width: 600px){ul.navigation li{display:none}ul.navigation li#show-nav{display:inline-block}}#hidden-nav{top:-50vh;position:fixed;width:100%;height:50vh;background-color:#c8c8c8;text-align:center;padding:20px}#hidden-nav ul{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-o-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:85%}#hidden-nav li{display:block;padding:1rem;border-bottom:1px solid #fafafa}#hidden-nav li a{text-decoration:none}#hidden-nav li:last-child{border-bottom:none}p{margin-bottom:1.5rem}blockquote{margin-bottom:1.5rem;border-left:5px solid #c8c8c8;padding:1rem;quotes:"“" "”" "‘" "’"}blockquote p{margin-bottom:0}blockquote:before{content:open-quote;float:left;padding-right:1rem;font-size:5rem;line-height:1;color:#c8c8c8}pre,code{background-color:#fff}code{padding:0 5px}pre{padding:10px;margin-bottom:1.5rem}.post-content h1,.post-content h2,.post-content h3{margin:2.5rem 0 1.5rem}.post-content ul{list-style-type:disc}.post-content ul,.post-content ol{display:block;width:100%;padding-left:10%;margin-bottom:1.5rem}.post-content img{max-width:100%;height:auto;margin:0 auto}.post-excerpt{padding:2rem 0;border-top:1px solid #c8c8c8}.post-excerpt:after{content:"";display:table;clear:both}.post-excerpt hgroup{padding-bottom:2rem}.post-excerpt .read-more{float:right}.post-excerpt:first-child{border-top:none}.pagination{width:100%;text-align:center;margin-bottom:20px}textarea,input,input[type="text"],input[type="button"],input[type="submit"]{-webkit-appearance:none;-moz-appearance:none;border-radius:0}input,textarea{margin:0.3rem auto 1rem;padding:5px;text-align:center;border:3px solid #c8c8c8;width:85%;max-width:400px;outline:none}input:focus,textarea:focus{border:3px solid #710109}input{height:3.5rem}input[type="submit"]{border-radius:20px;background-color:#fafafa;cursor:pointer}label,input,textarea{display:block}#contactform{text-align:center;margin-top:3rem}html,body{background-color:#fafafa}main{width:100%;padding:3rem 7% 2rem;margin:0 auto;background-color:#fafafa;position:relative}.post-content,.post-excerpt{max-width:960px;margin-left:auto;margin-right:auto}footer{height:70px;border-top:1px solid #c8c8c8;text-align:center;padding:20px;position:relative;background-color:#fff}#homepage-hero{background-size:cover;background-position:center;width:100%;height:100vh;position:relative;color:#fafafa}#homepage-hero .btn,#homepage-hero input[type="submit"],#homepage-hero .homepage-links li a,.homepage-links li #homepage-hero a{margin:1rem}.blog-description{margin:2rem auto}.homepage-links li{display:inline-block}.homepage-links li a{display:inline-block}body.post-template .post-excerpt .author{display:none}.post-meta,.tags{color:#fafafa}.tags{margin-top:1.5rem}.post-footer{margin-top:3rem;padding-top:2rem;padding-bottom:3rem;text-align:center}.post-footer .share .fa{width:30px;height:30px;background-color:#c8c8c8;color:#fafafa;border-radius:50%;text-align:center;padding:8px;margin:5px 0 0 5px;transition:background-color 0.6s}.post-footer .share .fa:hover{background-color:#710109}.more-post{border-top:1px solid #c8c8c8;text-align:left} diff --git a/screenshot1.png b/screenshot1.png new file mode 100644 index 0000000..b970ef2 Binary files /dev/null and b/screenshot1.png differ diff --git a/screenshot2.png b/screenshot2.png new file mode 100644 index 0000000..693202e Binary files /dev/null and b/screenshot2.png differ