index.hbs

{{! Front page; this file renders a front page with a list of the latest posts }}

{{> head}}
{{> navbar}}


{{! Portfolio }}
<div class="uk-section">
    <a id="portfolio"></a>

    <div
		class="uk-container uk-dark"
		uk-scrollspy="cls: uk-animation-slide-right"
	>
        <h2 class="uk-heading-divider uk-text-center">Portfolio</h2>

        {{> portfolio posts=@website.contentStructure.posts}}
    </div>
</div>
{{! /Portfolio }}

{{! Featured posts }}
<div class="uk-section uk-padding-small">
    <a id="readings"></a>

    <div class="uk-container uk-dark" uk-scrollspy="cls: uk-animation-slide-right">
        <h2 class="uk-heading-divider uk-text-center">Featured readings</h2>
		{{> readings posts=posts featuredOnly=true }}
		{{#getPostByTags "post-index" ""}}
			<div class="uk-margin uk-flex uk-flex-right">
    			<div>
					<a class="uk-button uk-button-text" href="{{url}}">Show all articles</a>
				</div>
			</div>
		{{/getPostByTags}}
	</div>
</div>
{{! /Featured posts }}

{{! Hero }}
<div
	class="uk-section uk-padding-small"
	uk-scrollspy="cls: uk-animation-fade"
>
    <a id="about-me"></a>

    <div class="uk-container">
        <div class="uk-grid uk-child-width-expand@s uk-flex-center uk-flex-middle" uk-grid>
            <div uk-scrollspy="cls: uk-animation-slide-left; delay: 500">
				<h2 class="uk-heading-divider">{{@config.custom.heroTitle}}</h2>

				<div>{{{@config.custom.heroBody}}}</div>
				{{#getAuthor 1}}
				<a href="{{url}}" class="uk-button uk-button-text">Read more</a>
				{{/getAuthor}}
            </div>
			<div>
				<img
					class="uk-align-center uk-object-contain"
					width="600"
					height="600"
					alt=""
					style="aspect-ratio: 1 / 1;"
					src="{{asset "images/about-me-image.webp"}}" />
			</div>
        </div>
    </div>
</div>
{{! /Hero }}

{{! Footer }}
{{> footer}}
{{! /Footer }}