From 088a867ceafe9d83f990a4641791026c06ecfc2e Mon Sep 17 00:00:00 2001 From: John O'Nolan Date: Mon, 21 Jul 2014 14:45:34 +0200 Subject: [PATCH] First pass on major Casper overhaul and new Multi-user support - Introduces author.hbs page template - Completely refactors header styling with new full-screen cover images - Adds new, improved pagination with additional styles for archive pages - Cleans up a fuckload of bloat and old styles --- assets/css/screen.css | 549 ++++++++++++++++++++++++++-------------- assets/fonts/icons.eot | Bin 2380 -> 3064 bytes assets/fonts/icons.svg | 3 + assets/fonts/icons.ttf | Bin 2224 -> 2908 bytes assets/fonts/icons.woff | Bin 1896 -> 2316 bytes author.hbs | 54 ++++ index.hbs | 24 +- tag.hbs | 17 +- 8 files changed, 438 insertions(+), 209 deletions(-) create mode 100644 author.hbs diff --git a/assets/css/screen.css b/assets/css/screen.css index 3ef7ff3..20d69e2 100644 --- a/assets/css/screen.css +++ b/assets/css/screen.css @@ -151,7 +151,15 @@ table { border-collapse: collapse; border-spacing: 0; } .icon-arrow-left:before { content: "\e005"; } - +.icon-stats:before { + content: "\e006"; +} +.icon-location:before { + content: "\e007"; +} +.icon-link:before { + content: "\e008"; +} /* ========================================================================== @@ -196,7 +204,7 @@ h4, h5, h6 { font-feature-settings: 'dlig' 1, 'liga' 1, 'lnum' 1, 'kern' 1; color: #2E2E2E; line-height: 1.15em; - margin: 0 0 0.5em 0; + margin: 0 0 0.3em 0; font-family: "Open Sans", sans-serif; } @@ -234,7 +242,7 @@ a { } a:hover { - color: #57A3E8; + color: #111; } h1 a, h2 a, h3 a, @@ -468,79 +476,170 @@ margin on the iframe, cause it breaks stuff. */ ========================================================================== */ /* Big cover image on the home page */ -.site-head { +.main-header { position: relative; display: table; width: 100%; - height: 60%; + height: 100%; margin-bottom: 5rem; text-align: center; - background: #303538 no-repeat center center; + background: #222 no-repeat center center; background-size: cover; } -.blog-logo { - text-decoration: none; +.main-header .inner { + width: 80%; } -/* Yo-logo. Yolo-go. Upload one in ghost/settings/ */ -.blog-logo img { +.main-nav { + position: relative; + padding: 15px; + margin: 0 0 30px 0; +} + +/* Appears in the top right corner of your home page */ +.blog-logo { display: block; - max-height: 100px; + float: left; + background: none !important; + border: none !important; +} + + +.blog-logo img { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + display: block; + height: 38px; + padding: 2px 0 6px 0; width: auto; - margin: 0 auto; +} + +.back-button { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + display: inline-block; + float: left; + height: 38px; + padding: 0 15px 0 10px; + border: transparent 1px solid; + color: #9EABB3; + text-align: center; + font-size: 12px; + text-transform: uppercase; + line-height: 35px; + border-radius: 3px; + transition: all ease 0.3s; +} +.back-button:before { + position: relative; + bottom: -2px; + font-size: 13px; line-height: 0; + margin-right: 8px; +} + +.subscribe-button { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + display: inline-block; + float: right; + height: 38px; + padding: 0 20px; + border: transparent 1px solid; + color: #9EABB3; + text-align: center; + font-size: 12px; + text-transform: uppercase; + line-height: 35px; + border-radius: 3px; + transition: all ease 0.3s; +} +.subscribe-button:before { + font-size: 9px; + margin-right: 6px; +} + +/* Special styles when overlaid on an image*/ +.main-nav.overlay { + position: absolute; + top: 0; + left: 0; + right: 0; + border: none; +} + +.main-nav.overlay a { + color: #fff; +} + +.main-nav.overlay .back-button, +.main-nav.overlay .subscribe-button { + border-color: #fff; +} + +.main-nav.overlay a:hover { + color: #222; + border-color: rgba(255,255,255,0.8); + background: rgba(255,255,255,0.8); + transition: all 0.1s ease; +} + +/* Add a border to the buttons on hover */ +.back-button:hover, +.subscribe-button:hover { + border-color: #bfc8cd; + color: #9EABB3; } /* The details of your blog. Defined in ghost/settings/ */ -.blog-title { +.page-title { margin: 10px 0 10px 0; font-size: 5.6rem; letter-spacing: -1px; font-weight: 700; font-family: "Open Sans", sans-serif; color: #fff; - text-shadow: 0 1px 6px rgba(0,0,0,0.1); } -.blog-description { +.page-description { margin: 0; - font-size: 2.4rem; - line-height: 1.6em; + font-size: 2.2rem; + line-height: 1.5em; font-weight: 400; font-family: "Noto Serif", serif; letter-spacing: 0; color: rgba(255,255,255,0.8); - text-shadow: 0 1px 3px rgba(0,0,0,0.15); +} + +.no-cover.main-header { + background: #f5f8fa; +} + +.no-cover .page-title { + color: rgba(0,0,0,0.8); +} + +.no-cover .page-description { + color: rgba(0,0,0,0.5); } /* Add subtle load-in animation for content on the home page */ -.home-template .site-head { - -webkit-animation: fade-in-down-subtle 2s; - animation: fade-in-down-subtle 2s; -} -.home-template .blog-logo img { - -webkit-animation: fade-in-down 1s; - animation: fade-in-down 1s; - -webkit-animation-delay: 0.3s; - animation-delay: 0.3s; -} -.home-template .blog-title { - -webkit-animation: fade-in-down 1s; - animation: fade-in-down 1s; +.home-template .page-title { + -webkit-animation: fade-in-down 0.6s; + animation: fade-in-down 0.6s; -webkit-animation-delay: 0.2s; animation-delay: 0.2s; } -.home-template .blog-description { - -webkit-animation: fade-in-down 1s; - animation: fade-in-down 1s; +.home-template .page-description { + -webkit-animation: fade-in-down 0.9s; + animation: fade-in-down 0.9s; -webkit-animation-delay: 0.1s; animation-delay: 0.1s; } -.home-template .content { - -webkit-animation: fade-in-up-subtle 2s; - animation: fade-in-up-subtle 2s; -} /* Every post, on every page, gets this style on its
tag */ .post { @@ -645,89 +744,11 @@ margin on the iframe, cause it breaks stuff. */ line-height: 1.5em; } + /* ========================================================================== 5. Single Post - When you click on an individual post ========================================================================== */ -.main-nav { - position: relative; - padding: 15px; - margin: 0 0 30px 0; -} - -.back-button { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - display: inline-block; - float: left; - height: 40px; - padding: 0 15px 0 10px; - border: transparent 1px solid; - color: #9EABB3; - text-align: center; - font-size: 12px; - text-transform: uppercase; - line-height: 37px; - border-radius: 3px; - transition: all ease 0.3s; -} -.back-button:before { - position: relative; - bottom: -2px; - font-size: 13px; - line-height: 0; - margin-right: 8px; -} - -.subscribe-button { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - display: inline-block; - float: right; - height: 40px; - padding: 0 20px; - border: transparent 1px solid; - color: #9EABB3; - text-align: center; - font-size: 12px; - text-transform: uppercase; - line-height: 37px; - border-radius: 40px; - transition: all ease 0.3s; -} -.subscribe-button:before { - font-size: 9px; - margin-right: 6px; -} - -/* Special styles when overlaid on an image*/ -.main-nav.overlay { - position: absolute; - top: 0; - left: 0; - right: 0; - border: none; -} - -.main-nav.overlay a { - color: rgba(255,255,255,0.7); -} - -.main-nav.overlay a:hover { - color: #fff; - border-color: #fff; - background: transparent; -} - -/* Add a border to the buttons on hover */ -.back-button:hover, -.subscribe-button:hover { - border-color: #bfc8cd; - color: #9EABB3; -} - /* Stop .full-img from creating horizontal scroll - slight hack due to imperfections with browser width % calculations and rounding */ .post-template .content { @@ -814,7 +835,7 @@ margin on the iframe, cause it breaks stuff. */ color: #9EABB3; } .author-meta a:hover { - color: #57A3E8; + color: #111; } /* Create some space to the right for the share links */ @@ -922,18 +943,114 @@ margin on the iframe, cause it breaks stuff. */ top: -33px; } +/* ========================================================================== + 6. Author profile + ========================================================================== */ + +.tag-head.main-header { + height: 40%; + min-height: 180px; +} + +.author-head.main-header { + height: 40%; + min-height: 180px; + margin-bottom: -60px; /* Pull the author bio up to overlap the cover */ +} + +.author-profile { + padding-bottom: 5rem; + border-bottom: #EBF2F6 1px solid; + text-align: center; +} + +/* Add a little circle in the middle of the border-bottom */ +.author-profile:after { + display: block; + content: ""; + width: 7px; + height: 7px; + border: #E7EEF2 1px solid; + position: absolute; + bottom: -5px; + left: 50%; + margin-left: -5px; + background: #FFF; + -webkit-border-radius: 100%; + -moz-border-radius: 100%; + border-radius: 100%; + box-shadow: #FFF 0 0 0 5px; +} + +.author-image { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + display: block; + position: relative; + width: 120px; + height: 120px; + margin: 0 auto; + border-radius: 100%; + overflow: hidden; + padding: 3px; + background: #fff; + z-index: 2; +} + +.author-image .img { + display: block; + width: 114px; + height: 114px; + background-size: cover; + background-position: center center; + border-radius: 100%; +} + +.author-title { + margin: 1.5rem 0 1rem; +} + +.author-bio { + font-size: 1.8rem; + line-height: 1.5em; + font-weight: 200; + color: #50585D; + letter-spacing: 0; + text-indent: 0; +} + +/* Location, website, and link */ +.author-profile .author-meta { + margin: 2rem 0; + font-family: "Noto Serif", serif; + font-size: 1.7rem; +} +.author-profile .author-meta span { + margin-left: 2rem; +} +.author-profile .author-meta span:first-child { + margin-left: 0; +} +.author-profile .author-meta a { + text-decoration: none; +} + +/* Turn off meta for page2+ to make room for extra + pagination prev/next links */ +.archive-template .author-profile .author-meta { + display: none; +} /* ========================================================================== 7. Third Party Elements - Embeds from other services ========================================================================== */ /* Github */ - .gist table { margin: 0; font-size: 1.4rem; } - .gist .line-number { min-width: 25px; font-size: 1.1rem; @@ -991,6 +1108,40 @@ margin on the iframe, cause it breaks stuff. */ border-color: #9EABB3; } +.extra-pagination { + display: none; + border-bottom: #EBF2F6 1px solid; +} +.extra-pagination:after { + display: block; + content: ""; + width: 7px; + height: 7px; + border: #E7EEF2 1px solid; + position: absolute; + bottom: -5px; + left: 50%; + margin-left: -5px; + background: #FFF; + -webkit-border-radius: 100%; + -moz-border-radius: 100%; + border-radius: 100%; + box-shadow: #FFF 0 0 0 5px; +} +.extra-pagination .pagination { + width: auto; +} + +/* On page2+ make all the headers smaller */ +.archive-template .main-header { + max-height: 30%; +} + +/* On page2+ show extra pagination controls at the top of post list */ +.archive-template .extra-pagination { + display: block; +} + /* ========================================================================== 9. Footer - The bottom of every page @@ -999,12 +1150,13 @@ margin on the iframe, cause it breaks stuff. */ .site-footer { position: relative; margin: 8rem 0 0 0; - padding: 0.5rem 35px; + padding: 0.5rem 15px; border-top: #EBF2F6 1px solid; font-family: "Open Sans", sans-serif; font-size: 1rem; line-height: 1.7em; color: #BBC7CC; + background: #f5f8fa; } .site-footer a { @@ -1035,11 +1187,11 @@ margin on the iframe, cause it breaks stuff. */ @media only screen and (max-width: 1600px) { - .blog-title { + .page-title { font-size: 5rem; } - .blog-description { + .page-description { font-size: 2rem; line-height: 1.5em; } @@ -1055,7 +1207,7 @@ margin on the iframe, cause it breaks stuff. */ .post, .inner, - .tag-archive-header { + .pagination { max-width: 710px; } @@ -1105,21 +1257,31 @@ margin on the iframe, cause it breaks stuff. */ margin-left: 0; } - .site-head { + .main-header { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; height: auto; min-height: 240px; + height: 60%; padding: 15% 0; } - .blog-title { + .archive-template .main-header { + min-height: 180px; + padding: 10% 0; + } + + .blog-logo img { + padding: 4px 0; + } + + .page-title { font-size: 4rem; letter-spacing: -1px; } - .blog-description { + .page-description { font-size: 1.8rem; line-height: 1.5em; } @@ -1165,8 +1327,23 @@ margin on the iframe, cause it breaks stuff. */ font-size: 1.8rem; } - .site-footer { - padding: 0.5rem 15px; + .author-profile { + padding-bottom: 4rem; + } + + .author-profile .author-bio { + font-size: 1.6rem; + } + + .author-profile .author-meta span { + display: block; + margin: 1.5rem 0; + font-size: 1.6rem; + } + + .tag-head.main-header, + .author-head.main-header { + height: 30%; } } @@ -1178,8 +1355,15 @@ margin on the iframe, cause it breaks stuff. */ @media only screen and (max-width: 500px) { - .site-head { + .main-header { margin-bottom: 0; + height: 40%; + } + + .archive-template .main-header { + max-height: 20%; + min-height: 160px; + padding: 10% 0; } .main-nav { @@ -1188,6 +1372,14 @@ margin on the iframe, cause it breaks stuff. */ border-bottom: #e0e4e7 1px solid; } + .blog-logo { + padding: 10px 10px; + } + + .blog-logo img { + height: 26px; + } + .back-button, .subscribe-button { height: 44px; @@ -1213,16 +1405,22 @@ margin on the iframe, cause it breaks stuff. */ .main-nav.overlay { color: #fff; background: rgba(0,0,0,0.4); - background: -moz-linear-gradient(top, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%); - background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.4)), color-stop(100%,rgba(0,0,0,0))); - background: -webkit-linear-gradient(top, rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%); - background: linear-gradient(to bottom, rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%); + background: -moz-linear-gradient(top, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 100%); + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.3)), color-stop(100%,rgba(0,0,0,0))); + background: -webkit-linear-gradient(top, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); + background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); } .main-nav.overlay a:hover { + color: #fff; border-color: transparent; background: transparent; } + .main-nav.overlay .back-button, + .main-nav.overlay .subscribe-button { + border-color: transparent; + } + .blog-logo img { max-height: 80px; } @@ -1230,8 +1428,7 @@ margin on the iframe, cause it breaks stuff. */ .inner, .pagination { width: auto; - margin-left: 16px; - margin-right: 16px; + margin: 2rem auto; } .post { @@ -1241,8 +1438,7 @@ margin on the iframe, cause it breaks stuff. */ margin-left: 16px; margin-right: 16px; padding-bottom: 2rem; - font-size: 0.8em; - line-height: 1.6em; + line-height: 1.55em; } .post-template .post-title { @@ -1254,14 +1450,15 @@ margin on the iframe, cause it breaks stuff. */ } p, ul, ol, dl { + font-size: 0.95em; margin: 0 0 2rem 0; } - .blog-title { + .page-title { font-size: 3rem; } - .blog-description { + .page-description { font-size: 1.6rem; } @@ -1365,6 +1562,23 @@ margin on the iframe, cause it breaks stuff. */ margin-top: 3rem; } + .author-profile { + padding-bottom: 2rem; + } + + .tag-head.main-header, + .author-head.main-header { + height: 20%; + } + + .author-profile .author-meta span { + font-size: 1.5rem; + } + + .archive-template .main-header .page-description { + display: none; + } + } @@ -1375,7 +1589,7 @@ margin on the iframe, cause it breaks stuff. */ @-webkit-keyframes fade-in-down { 0% { opacity: 0; - -webkit-transform: translateY(-5px); + -webkit-transform: translateY(-10px); } 60% { opacity: 1; @@ -1387,7 +1601,7 @@ margin on the iframe, cause it breaks stuff. */ @keyframes fade-in-down { 0% { opacity: 0; - -webkit-transform: translateY(-5px); + -webkit-transform: translateY(-10px); } 60% { opacity: 1; @@ -1397,57 +1611,6 @@ margin on the iframe, cause it breaks stuff. */ } } -@-webkit-keyframes fade-in-down-subtle { - 0% { - opacity: 0.8; - -webkit-transform: translateY(-5px); - } - 30% { - opacity: 1; - } - 100% { - -webkit-transform: translateY(0); - } -} -@keyframes fade-in-down-subtle { - 0% { - opacity: 0.8; - -webkit-transform: translateY(-5px); - } - 30% { - opacity: 1; - } - 100% { - -webkit-transform: translateY(0); - } -} - -@-webkit-keyframes fade-in-up-subtle { - 0% { - opacity: 0.3; - -webkit-transform: translateY(3px); - } - 30% { - opacity: 1; - } - 100% { - -webkit-transform: translateY(0); - } -} -@keyframes fade-in-down-subtle { - 0% { - opacity: 0.3; - -webkit-transform: translateY(3px); - } - 30% { - opacity: 1; - } - 100% { - -webkit-transform: translateY(0); - } -} - - /* ========================================================================== End of file. Animations should be the last thing here. Do not add stuff diff --git a/assets/fonts/icons.eot b/assets/fonts/icons.eot index b220c913720c6b382e65e36e6f15afa3c4081e44..f77bb94c2e12410e35b3d9b1be2a1e959f7442c0 100755 GIT binary patch delta 942 zcmX|9O-~b16us}gGH+%&^ZN1nk-#JJK0EZn#tY*<*qKcF!#jEOsq2@3)56l*f?CG-1$;@y*juUDFVPdT$5At)urr>-HFxRbnW2N!$SbF1i%}!)74un@Zc4Ib_sQT zvsmDJ>;Ul!;;z~GmHRoMKM=1WF3l}YRn;f@HsS{2^nCUH62#yw;_ryF3)T7QH>1U4 z09{27Z)x$~3NU0K=+Dmr3)F9tL88{5lOdw+d?AiSeBUu=Ut1_2p3hkcGMXp(uX zuRxt9;L?)?c6M(OZ04>W))Ybx2+_=#e$rSpguw`TPY4f1jFW?9E%Kk2I(w`NssCAL zw{$Mkhz{=^3e%GsRpyo-1ZrCmYKTSIXo2FX!f7?vIx%!}*it1oG*c z=Oz-amqua2H-;HB-e5TxhDQJ{7sSqW7npB$nGDcG(jvva{sB_LDiI_^1oM+6E#?)Q zk~79uI4MvCX%ai@!ERy^)cJY+dV$~syQZLpFKP9oRe^Ssr+HyJw#jwQ7;bAuXO|n{ zQcA9JuBL{rUUSw(T&OB;qSNV;QP;_eUSw5YrIJHycw{J5`d{!wHftHJd0VMoODd?W zNu0-3GnL7NWv)9Xw^~y_=7nhrB@~Y6S|l9e&y4mE4g2m*gH%$>JI_Ri*lF-`12FHn-77d4#&2*Gr5sL5MY%-;(XfiD~&8+Rlr0aAD z{3Q4*`0L*Jz3qw6rQZ+?U;*Ip=ZkpjtWWZOV%FDqkAdV&0QLS^-{lE|eq|Q>)|_JQ IeC7+}FQr7AL;wH) delta 270 zcmew%enyDRhm(O}1II)*GZwY(|Irg2@&)x77#Q{daYAx#Vu3>FftZO0Wa>};KM7RG zSir!*YLJndn8M5?+{(bfwg9NkECVROeu()rkbeWnSINjNsgPn|ln3(v0Qnj@`N@f_ zMa-`l7}!;Se6ifbiUI~fhV4MU4Un&pmzbNnF2Lw7kRJoI!?+;7xP*ZjD8s-p0VL1B z%rZHe(Seb5@*GBIM%K*_7-LzL8G$lDJln|URXo4VR|aktkOqeHAJbc4^yELB=8RmE mO}I4Vz;av+A`Eg2UJP>>wV1@1l9*-yMM1`JZSLaAV*~(Ao;@u9 diff --git a/assets/fonts/icons.svg b/assets/fonts/icons.svg index 1d2d599..383e825 100755 --- a/assets/fonts/icons.svg +++ b/assets/fonts/icons.svg @@ -13,4 +13,7 @@ + + + \ No newline at end of file diff --git a/assets/fonts/icons.ttf b/assets/fonts/icons.ttf index 3f8ccc0087c3073a4b266a3972ccb4f8bc33e96a..76b2863924176e5d9f7b606d9eedbf3df6567e2f 100755 GIT binary patch delta 976 zcmX|AOHUI~6h8M}m^(A=+&*qw659@ChAEVof}Iv(LNJksQAs2*ZU_xjq_E&6u)tMa zxG~1W$3h@341~Bd1{S(-VT_3jdH4f#< z9wP7t@lV95+0x9!tD)Q>fUcs6J3qI$ghBD;>wf(95>cO!UZQUIkz##?LHYO(TVoGF zKoZWP+_nU5U@q&-Qo9PcbY+&E+}8+JzO4r}g^)c$G$W!P?acXwpAqtz5FQBmkM^sJ1>I(}@3>2SkngJWePnE$)m?#=C z>A8*`TF7Ipkd?)o9_r>yBm}i76p90_Lt{huZXGBVlDTv=n$9I_l?`Y5i-nO-o72;q zpGFGB{>;%r4EaRGbz(8cO`tI58ABP3*H{|*;Q@fd1+mgCS>~BtAU!nJV3J&CR}aZ! zmk1Idf_cdrOy=gQk`u;KILT54X%ab^!D(U=)OmTmewN?{tD>NVC#lV&RhG7pCmCVc zmcez-7#=JBre-I^rIcLdT#ff$zG|`!?cjrc_W_k+_emMm(7e%5+OwZq&AZ$q2&`N+1~0wNNm?pZU)OXwY-78pIp4 zjQvbB+K!AkR!ZO)=XkW$LUKBoY-DHRuKGVU&kLS~4ycp&%YB7m1B{9taih_*c+Wd|)j}ZVzCp}L9 diff --git a/assets/fonts/icons.woff b/assets/fonts/icons.woff index 4ac6c21804b0f41b292b6268ee1006d6de0bc1c7..22bd26830b1d568d8d30d251e47a74945931b494 100755 GIT binary patch delta 784 zcmYLGUr19?96op3*}ZC;HJJHe;G(2bQT($-NJAxiX-vsdve5ZwTiG_rZFdc8B)!Nl z3fZ1Qcc&SKQ#Ugy(y2r=2mN_4&>jLGdJu}BAnx>Jbgmd3_`VFRPm{x& z>*~ynjb?;0_MuEf7xx-5!3H*GuqZQty$E6Nr9Yp0%;!tW5K>;Jfi?;1!JV=Whoy&l zZ>c^fA^*a1tIg6&JvNtWZV&tIU6xMj#WE>h)1w zA)%lg$-X))KB+KH4dpIW^~h;)bW!gGLQJ`Y>H4yr9#^lM-uZ2C^X$<`_8}U5d_dw1 zO4y-6YKBo}sj@W(^K=D;rIn|Q!3L(J(sQP?R48m;sc9R5HXM1!C!os8A<* z$F$1&Wk2L6b6g(S+TPY_i2|?_0&Z||utP)(z!t$U?jCglN0KD@Kj7rx zcT#KvNGCBo@$3awv^0)gaN7ekKtfW37@`69hzmG%I<)m&OLRb3!h$ph#1L5py2L<8 zTm^9eL>*y8mhRF1!&)PlQm_tdsni;*LCOS1IBhZ+rK$q4Q`_E-ZMFum#cmGukH8o_ z3XKjAabl5Jh@%s4UOsOV_$Y)0L4YVP)O;k&t)gO%6q7=1vwB;g8JZ$3G3$(V!IucY z0wlumI5#(kg)mI=VP5D4-p8do(i_^UPelHprj~1J#yk(*0xuN{VQz5=&%_gb(e7b? z$PK-4jI^&zV`qcjn60kg$NN}P-)Z@UD>$SnqBn^Whv;-BlO{CMEh?BC$WK11;5~98oFs!?0zt^ OB2u)Yxk z1Irblf&>ueoA_5hIXAI@fq~To$oBzZh0p^r>50W4u?8TY1BwMQQWH~vVjV!f83;2o z3Abhd1%YA*fP57YWz-AU4YTwg8bqVpyNFzzHnFS + + + +
+ {{#if author.image}} +
+
+
+ {{/if}} +

{{author.name}}

+

{{author.bio}}

+
+ {{#if author.location}} {{author.location}}{{/if}} + {{#if author.website}} {{author.website}}{{/if}} + {{pagination.total}} posts +
+
+ +{{! The main content area on the homepage }} +
+ + {{! Previous/next page links - only displayed on page 2+ }} +
+ {{pagination}} +
+ + {{! Each post will be output using this markup }} + {{#foreach posts}} +
+
+ {{tags prefix="on "}} +

{{{title}}}

+ +
+
+

{{excerpt}} »

+
+
+ {{/foreach}} + + {{! After all the posts, we have the previous/next pagination links }} + {{pagination}} + +
\ No newline at end of file diff --git a/index.hbs b/index.hbs index 3b9f70c..0775f85 100644 --- a/index.hbs +++ b/index.hbs @@ -4,12 +4,15 @@ the {body} of the default.hbs template, which contains our header/footer. }} {{! The big featured header on the homepage, with the site logo and description }} -
+
+
-
- {{#if @blog.logo}}{{/if}} -

{{@blog.title}}

-

{{@blog.description}}

+
+

{{@blog.title}}

+

{{@blog.description}}

@@ -17,22 +20,25 @@ {{! The main content area on the homepage }}
+ {{! Previous/next page links - only displayed on page 2+ }} +
+ {{pagination}} +
+ {{! Each post will be output using this markup }} {{#foreach posts}} -
{{tags prefix="on "}}

{{{title}}}

-

{{excerpt}}… »

+

{{excerpt}} »

- {{/foreach}} - {{!! After all the posts, we have the previous/next pagination links }} + {{! Previous/next page links - only displayed on every page }} {{pagination}}
\ No newline at end of file diff --git a/tag.hbs b/tag.hbs index ea31293..e66ae6a 100644 --- a/tag.hbs +++ b/tag.hbs @@ -4,15 +4,15 @@ the {body} of the default.hbs template, which contains our header/footer. }} {{! The big featured header on the homepage, with the site logo and description }} -
+
-
-

{{tag.name}}

-

A {{pagination.total}}-post collection

+
+

{{tag.name}}

+

A {{pagination.total}}-post collection

@@ -20,9 +20,13 @@ {{! The main content area on the homepage }}
+ {{! Previous/next page links - only displayed on page 2+ }} +
+ {{pagination}} +
+ {{! Each post will be output using this markup }} {{#foreach posts}} -
{{tags prefix="on "}} @@ -30,10 +34,9 @@
-

{{excerpt}}…

+

{{excerpt}} »

- {{/foreach}} {{! After all the posts, we have the previous/next pagination links }}