jce-manager/_layouts/page.html
2014-09-11 15:49:20 +03:00

98 lines
3.6 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>
</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({{ page.author_image }})">Blog Logo</div>
<h4 class="author-name" itemprop="author" itemscope itemtype="http://schema.org/Person">{{ page.author }}</h4>
</div>
</div>
</div>
<br>
<br>
<br>
{% endif %}
<section class="post-content">
<a name="topofpage"></a>
{{content}}
</section>
</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="/" class="btn">Back to Overview</a>
</div>
</div>
</body>
</html>