index.hbs

{{!< default}}

<div class="container wrapper">
	{{!-- Last Post --}}
	{{#foreach posts to="1"}}
		<div class="grid">
			<div class="col-xs">
				{{> post-card class="post-card--latest" lazy="false"}}
			</div>
		</div>
	{{/foreach}}

	{{!-- Latest Posts --}}
	<section class="main-content">
		<div class="grid">
			<div class="col-xs-12 col-md-8">
				{{#foreach posts from="2"}}
					{{#if @even}}
						{{> post-card}}
					{{else}}
						{{> post-card class="reverse"}}
					{{/if}}
				{{/foreach}}
			</div>
			<div class="col-xs-12 col-md-4">
				{{> sidebar}}
			</div>
		</div>
	</section>

	{{!-- More posts --}}
	<div class="more-posts">
		<div class="grid">
			<div class="col-xs-12 more-posts-wrapper">
			</div>
			<div class="col-xs-12 center-xs">
				<button id="load-more-btn" class="btn btn__large btn__wide" onClick="loadMorePosts();">{{t "Load more posts"}}</button>
			</div>
		</div>
	</div>

	{{!-- Top tags --}}
	<section class="top-tags">
		<div class="grid">
			{{#get "tags" limit="4" include="count.posts" order="count.posts desc"}}
				{{#foreach tags}}
					<div class="col-xs-12 col-sm-6 col-md-3">
						{{>tag-card}}
					</div>
				{{/foreach}}
			{{/get}}
		</div>
	</section>
</div>