zgodovina-fotografije/content/themes/aluo_foto_master-2/content_index.hbs

64 lines
2.4 KiB
Handlebars
Executable File

<style>
/* Bright theme for screens larger than 768px */
@media (max-width: 769px) {
body {
background-color: #ffffff;
}
.blog-header {
background-color: #000000;
}
}
</style>
<script src="{{asset "js/content_index.js"}}"></script>
{{!< default}}
<!-- Blog Header -->
<header class="blog-header {{#if @site.cover_image}} has-cover{{/if}}">
<div class="inner">
<!-- Back to Content Index Button -->
<a href="/" class="back-button">
<img src="{{asset "images/arrow_back_kazalo.svg"}}" alt="Back Button" />
</a>
<div class="box index-box">
<img src="{{asset "images/kazalo.svg"}}" alt="Kazalo" />
</div>
</div>
</header>
<div id="index" class="container">
<main class="content" role="main">
<div class="index-content">
{{#get "posts" limit="all" order="published_at asc" filter="tag:-prenos"}}
{{#foreach posts}}
<div class="post-summary" id="{{id}}">
<div class="image-overlay-container">
{{#if feature_image}}
<figure class="post-figure">
{{#if feature_image_caption}}
<hr>
<figcaption class="post-feature-image-caption">{{feature_image_caption}}</figcaption>
{{/if}}
<img src="{{feature_image}}" alt="{{title}}" class="post-feature-image">
</figure>
{{/if}}
<div class="overlay-text">
<h2 class="post-title">
<!-- Store the index as a data attribute -->
<a href="{{url}}" class="post-link" data-index="{{@index}}">{{title}}</a>
</h2>
<!-- Subheader list to be populated dynamically -->
<ul class="post-subheaders" data-url="{{url}}"><span class="bullet"></span></ul>
</div>
</div>
</div>
{{/foreach}}
{{/get}}
</div>
</main>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.10/SmoothScroll.min.js"></script>