From 4bd2ce6740fcb475c8f6e11db2721ee505b9b2f6 Mon Sep 17 00:00:00 2001 From: John O'Nolan Date: Mon, 21 Jul 2014 19:07:56 +0200 Subject: [PATCH] Make everything look good with no cover images + crossbrowser fixes --- assets/css/screen.css | 48 +++++++++++++++++++++++++++++++++++-------- author.hbs | 2 +- tag.hbs | 2 +- 3 files changed, 41 insertions(+), 11 deletions(-) diff --git a/assets/css/screen.css b/assets/css/screen.css index 7769171..b301648 100644 --- a/assets/css/screen.css +++ b/assets/css/screen.css @@ -118,7 +118,7 @@ table { border-collapse: collapse; border-spacing: 0; } /* Apply these base styles to all icons */ [class^="icon-"], [class*=" icon-"] { - font-family: "icons"; + font-family: "icons", "Open Sans", sans-serif; speak: none; font-style: normal; font-weight: normal; @@ -610,6 +610,8 @@ margin on the iframe, cause it breaks stuff. */ } .no-cover.main-header { + min-height: 160px; + max-height: 40%; background: #f5f8fa; } @@ -621,6 +623,12 @@ margin on the iframe, cause it breaks stuff. */ color: rgba(0,0,0,0.5); } +.no-cover .main-nav.overlay .back-button, +.no-cover .main-nav.overlay .subscribe-button { + color: rgba(0,0,0,0.4); + border-color: rgba(0,0,0,0.3); +} + /* Add subtle load-in animation for content on the home page */ .home-template .page-title { -webkit-animation: fade-in-down 0.6s; @@ -974,8 +982,15 @@ body:not(.post-template) .post-title { margin-bottom: -60px; /* Pull the author bio up to overlap the cover */ } +.no-cover.author-head.main-header { + height: 10%; + min-height: 100px; + background: transparent; +} + .author-profile { - padding-bottom: 5rem; + margin-top: 0 !important; + padding: 0 15px 5rem 15px; border-bottom: #EBF2F6 1px solid; text-align: center; } @@ -1172,7 +1187,6 @@ body:not(.post-template) .post-title { font-size: 1rem; line-height: 1.7em; color: #BBC7CC; - background: #f5f8fa; } .site-footer a { @@ -1370,6 +1384,10 @@ body:not(.post-template) .post-title { height: 30%; } + .no-cover.author-head.main-header { + padding: 0; + } + } @@ -1384,6 +1402,10 @@ body:not(.post-template) .post-title { height: 40%; } + .no-cover.main-header { + height: 30%; + } + .archive-template .main-header { max-height: 20%; min-height: 160px; @@ -1440,6 +1462,14 @@ body:not(.post-template) .post-title { background: transparent; } + .no-cover .main-nav.overlay { + background: none; + } + .no-cover .main-nav.overlay .back-button, + .no-cover .main-nav.overlay .subscribe-button { + border: none; + } + .main-nav.overlay .back-button, .main-nav.overlay .subscribe-button { border-color: transparent; @@ -1622,24 +1652,24 @@ body:not(.post-template) .post-title { 0% { opacity: 0; -webkit-transform: translateY(-10px); - } - 60% { - opacity: 1; + transform: translateY(-10px); } 100% { + opacity: 1; -webkit-transform: translateY(0); + transform: translateY(0); } } @keyframes fade-in-down { 0% { opacity: 0; -webkit-transform: translateY(-10px); - } - 60% { - opacity: 1; + transform: translateY(-10px); } 100% { + opacity: 1; -webkit-transform: translateY(0); + transform: translateY(0); } } diff --git a/author.hbs b/author.hbs index bfe417b..051b6cc 100644 --- a/author.hbs +++ b/author.hbs @@ -2,7 +2,7 @@ {{! The tag above means - insert everything in this file into the {body} of the default.hbs template }} {{! The big featured header }} -
+