Post image support
This commit is contained in:
parent
63535cf5ce
commit
e07d0d8775
|
@ -589,6 +589,7 @@ margin on the iframe, cause it breaks stuff. */
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
line-height: 35px;
|
line-height: 35px;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
|
background: rgba(0,0,0,0.1);
|
||||||
transition: all ease 0.3s;
|
transition: all ease 0.3s;
|
||||||
}
|
}
|
||||||
.back-button:before {
|
.back-button:before {
|
||||||
|
@ -615,6 +616,7 @@ margin on the iframe, cause it breaks stuff. */
|
||||||
line-height: 35px;
|
line-height: 35px;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
|
background: rgba(0,0,0,0.1);
|
||||||
transition: all ease 0.3s;
|
transition: all ease 0.3s;
|
||||||
}
|
}
|
||||||
.subscribe-button:before {
|
.subscribe-button:before {
|
||||||
|
@ -635,7 +637,9 @@ margin on the iframe, cause it breaks stuff. */
|
||||||
background: -webkit-linear-gradient(top, rgba(0,0,0,0.2) 0%,rgba(0,0,0,0) 100%);
|
background: -webkit-linear-gradient(top, rgba(0,0,0,0.2) 0%,rgba(0,0,0,0) 100%);
|
||||||
background: linear-gradient(to bottom, rgba(0,0,0,0.2) 0%,rgba(0,0,0,0) 100%);
|
background: linear-gradient(to bottom, rgba(0,0,0,0.2) 0%,rgba(0,0,0,0) 100%);
|
||||||
}
|
}
|
||||||
.no-cover .main-nav.overlay {
|
.no-cover .main-nav.overlay,
|
||||||
|
.no-cover .back-button,
|
||||||
|
.no-cover .subscribe-button {
|
||||||
background: none;
|
background: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -645,13 +649,13 @@ margin on the iframe, cause it breaks stuff. */
|
||||||
|
|
||||||
.main-nav.overlay .back-button,
|
.main-nav.overlay .back-button,
|
||||||
.main-nav.overlay .subscribe-button {
|
.main-nav.overlay .subscribe-button {
|
||||||
border-color: #fff;
|
border-color: rgba(255,255,255,0.6);
|
||||||
}
|
}
|
||||||
|
|
||||||
.main-nav.overlay a:hover {
|
.main-nav.overlay a:hover {
|
||||||
color: #222;
|
color: #222;
|
||||||
border-color: rgba(255,255,255,0.8);
|
border-color: #fff;
|
||||||
background: rgba(255,255,255,0.8);
|
background: #fff;
|
||||||
transition: all 0.1s ease;
|
transition: all 0.1s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1057,6 +1061,18 @@ body:not(.post-template) .post-title {
|
||||||
6. Author profile
|
6. Author profile
|
||||||
========================================================================== */
|
========================================================================== */
|
||||||
|
|
||||||
|
.post-head.main-header {
|
||||||
|
height: 65%;
|
||||||
|
min-height: 180px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.no-cover.post-head.main-header {
|
||||||
|
height: 85px;
|
||||||
|
min-height: 0;
|
||||||
|
margin-bottom: 0;
|
||||||
|
background: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
.tag-head.main-header {
|
.tag-head.main-header {
|
||||||
height: 40%;
|
height: 40%;
|
||||||
min-height: 180px;
|
min-height: 180px;
|
||||||
|
@ -1420,11 +1436,20 @@ body:not(.post-template) .post-title {
|
||||||
font-size: 1.6rem;
|
font-size: 1.6rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.post-head.main-header {
|
||||||
|
height:45%;
|
||||||
|
}
|
||||||
|
|
||||||
.tag-head.main-header,
|
.tag-head.main-header,
|
||||||
.author-head.main-header {
|
.author-head.main-header {
|
||||||
height: 30%;
|
height: 30%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.no-cover.post-head.main-header {
|
||||||
|
height: 55px;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
.no-cover.author-head.main-header {
|
.no-cover.author-head.main-header {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
@ -1439,7 +1464,7 @@ body:not(.post-template) .post-title {
|
||||||
@media only screen and (max-width: 500px) {
|
@media only screen and (max-width: 500px) {
|
||||||
|
|
||||||
.main-header {
|
.main-header {
|
||||||
margin-bottom: 0;
|
margin-bottom: 15px;
|
||||||
height: 40%;
|
height: 40%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1473,6 +1498,7 @@ body:not(.post-template) .post-title {
|
||||||
line-height: 41px;
|
line-height: 41px;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
color: #2e2e2e;
|
color: #2e2e2e;
|
||||||
|
background: transparent;
|
||||||
}
|
}
|
||||||
.back-button:hover,
|
.back-button:hover,
|
||||||
.subscribe-button:hover {
|
.subscribe-button:hover {
|
||||||
|
@ -1670,6 +1696,10 @@ body:not(.post-template) .post-title {
|
||||||
padding-bottom: 2rem;
|
padding-bottom: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.post-head.main-header {
|
||||||
|
height: 30%;
|
||||||
|
}
|
||||||
|
|
||||||
.tag-head.main-header,
|
.tag-head.main-header,
|
||||||
.author-head.main-header {
|
.author-head.main-header {
|
||||||
height: 20%;
|
height: 20%;
|
||||||
|
|
18
post.hbs
18
post.hbs
|
@ -3,16 +3,19 @@
|
||||||
{{! The comment above "< default" means - insert everything in this file into
|
{{! The comment above "< default" means - insert everything in this file into
|
||||||
the {body} of the default.hbs template, which contains our header/footer. }}
|
the {body} of the default.hbs template, which contains our header/footer. }}
|
||||||
|
|
||||||
<nav class="main-nav clearfix">
|
{{! Everything inside the #post tags pulls data from the post }}
|
||||||
<a class="back-button icon-arrow-left" href="{{@blog.url}}">Home</a>
|
{{#post}}
|
||||||
<a class="subscribe-button icon-feed" href="{{@blog.url}}/rss/">Subscribe</a>
|
|
||||||
</nav>
|
<header class="main-header post-head {{#if image}}" style="background-image: url({{image}}){{else}}no-cover{{/if}}">
|
||||||
|
<nav class="main-nav {{#if image}}overlay{{/if}} clearfix">
|
||||||
|
<a class="back-button icon-arrow-left" href="{{@blog.url}}">Home</a>
|
||||||
|
<a class="subscribe-button icon-feed" href="{{@blog.url}}/rss/">Subscribe</a>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
<main class="content" role="main">
|
<main class="content" role="main">
|
||||||
|
|
||||||
<article class="{{post_class}}">
|
<article class="{{post_class}}">
|
||||||
{{! Everything inside the #post tags pulls data from the post }}
|
|
||||||
{{#post}}
|
|
||||||
|
|
||||||
<header class="post-header">
|
<header class="post-header">
|
||||||
<h1 class="post-title">{{title}}</h1>
|
<h1 class="post-title">{{title}}</h1>
|
||||||
|
@ -70,7 +73,8 @@
|
||||||
|
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
{{/post}}
|
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
|
{{/post}}
|
||||||
|
|
Loading…
Reference in New Issue