140 lines
6.2 KiB
HTML
140 lines
6.2 KiB
HTML
---
|
|
---
|
|
<!DOCTYPE html>
|
|
<html>
|
|
{% include head.html %}
|
|
<body itemscope itemtype="http://schema.org/Article">
|
|
{% include header.html %}
|
|
<main class="content" role="main">
|
|
<article class="post">
|
|
{% if page.image %}
|
|
<div class="article-image">
|
|
<div class="post-image-image" style="background-image: url({% if page.image %}{{ page.image }}{% endif %})">
|
|
Article Image
|
|
</div>
|
|
<div class="post-meta">
|
|
<h1 class="post-title">{{ page.title }}</h1>
|
|
<div class="cf post-meta-text">
|
|
<div class="author-image" style="background-image: url({{ site.author_image }})">Blog Logo</div>
|
|
<h4 class="author-name" itemprop="author" itemscope itemtype="http://schema.org/Person">{{ site.author }}</h4>
|
|
on
|
|
<time datetime="{{ page.date | date: "%F %R" }}">{{ page.date | date_to_string }}</time>
|
|
<!-- , tagged on {{#foreach tags}}<span class="post-tag-{{slug}}">{{#if @first}}{{else}}, {{/if}}<a href="/tag/{{slug}}">{{name}}</a></span>{{/foreach}} -->
|
|
</div>
|
|
<div style="text-align:center">
|
|
<a href="#topofpage" class="topofpage"><i class="fa fa-angle-down"></i></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
(function ($) {
|
|
"use strict";
|
|
$(document).ready(function(){
|
|
var $window = $(window),
|
|
$image = $('.post-image-image');
|
|
$window.on('scroll', function() {
|
|
var top = $window.scrollTop();
|
|
|
|
if (top < 0 || top > 1500) { return; }
|
|
$image
|
|
.css('transform', 'translate3d(0px, '+top/3+'px, 0px)')
|
|
.css('opacity', 1-Math.max(top/700, 0));
|
|
});
|
|
$window.trigger('scroll');
|
|
|
|
var height = $('.article-image').height();
|
|
$('.post-content').css('padding-top', height + 'px');
|
|
|
|
$(function() {
|
|
$('a[href*=#]:not([href=#])').click(function() {
|
|
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
|
|
var target = $(this.hash);
|
|
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
|
|
if (target.length) {
|
|
$('html,body').animate({
|
|
scrollTop: target.offset().top
|
|
}, 500);
|
|
return false;
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
});
|
|
|
|
}(jQuery));
|
|
</script>
|
|
{% else %}
|
|
<div class="noarticleimage">
|
|
<div class="post-meta">
|
|
<h1 class="post-title">{{ page.title }}</h1>
|
|
<div class="cf post-meta-text">
|
|
<div class="author-image" style="background-image: url({{ site.author_image }})">Blog Logo</div>
|
|
<h4 class="author-name" itemprop="author" itemscope itemtype="http://schema.org/Person">{{ page.author }}</h4>
|
|
on
|
|
<time datetime="{{ page.date | date_to_xmlschema }}">{{ page.date | date_to_string }}</time>
|
|
<!-- , tagged on {{#foreach tags}}<span class="post-tag-{{slug}}">{{#if @first}}{{else}}, {{/if}}<a href="/tag/{{slug}}">{{name}}</a></span>{{/foreach}} -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
<br>
|
|
<br>
|
|
{% endif %}
|
|
<section class="post-content">
|
|
<div class="post-reading">
|
|
<span class="post-reading-time"></span> read
|
|
</div>
|
|
<a name="topofpage"></a>
|
|
{{content}}
|
|
</section>
|
|
<footer class="post-footer">
|
|
<section class="share">
|
|
{% for social in site.social %}
|
|
{% if social.share_url != null %}
|
|
<a class="icon-{{ social.icon }}" href="{{ social.share_url }}{{ social.share_title }}{{page.title | cgi_escape}}{{ social.share_link }}{{site.url}}{{page.id}}"
|
|
onclick="window.open(this.href, '{{ social.icon }}-share', 'width=550,height=255');return false;">
|
|
<i class="fa fa-{{ social.icon }}"></i><span class="hidden">{{ social.icon }}</span>
|
|
</a>
|
|
{% endif %}
|
|
{% endfor %}
|
|
</section>
|
|
</footer>
|
|
<div class="bottom-teaser cf">
|
|
<div class="isLeft">
|
|
<h5 class="index-headline featured"><span>Written by</span></h5>
|
|
<section class="author">
|
|
<div class="author-image" style="background-image: url({{site.author_image}})">Blog Logo</div>
|
|
<h4>{{ site.author }}</h4>
|
|
<p class="bio">{{author.bio}}</p>
|
|
<hr>
|
|
<p class="published">Published <time datetime="{{ page.date | date: "%F %R" }}">{{ page.date | date_to_string }}</time></p>
|
|
</section>
|
|
</div>
|
|
{{/post}}
|
|
<div class="isRight">
|
|
<h5 class="index-headline featured"><span>Supported by</span></h5>
|
|
<footer class="site-footer">
|
|
<section class="poweredby">Proudly published with <a href="http://jekyllrb.com"> Jekyll</a></section>
|
|
<a class="subscribe" href="{{ "/feed.xml" | prepend: site.baseurl }}"> <span class="tooltip"> <i class="fa fa-rss"></i> Get Updated As Soon As Possible.</span></a>
|
|
<div class="inner">
|
|
<section class="copyright">All content copyright <a href="http://liranbg.github.io/JceManager">{{site.author}}</a> © 2014<br>All rights reserved.</section>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
</main>
|
|
<div class="bottom-closer">
|
|
<div class="background-closer-image" {%if site.cover %} style="background-image: url({{ site.cover }})"{% endif %}>
|
|
Image
|
|
</div>
|
|
<div class="inner">
|
|
<h1 class="blog-title">{{ site.title }}</h1>
|
|
<h2 class="blog-description">{{ site.description }}</h2>
|
|
<a href="http://liranbg.github.io/JceManager" class="btn">Back to Overview</a>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|