{{ partial "header.html" . }}

<div class="section" id="top"><!-- Parent section -->

    <div class="container hero {{ if .Site.Params.fadein }} fade-in one {{ end }}"><!-- Begin Title -->
    <h1 class="bold-title is-1">{{ .Site.Params.firstname }}'s Blog</h1>
    </div><!-- End Title -->

    <!-- Everything below fades in two! -->
    <div class="section no-padding {{ if .Site.Params.fadein }} fade-in two {{ end }}">

    <div class="container"><!-- Begin Nav bar -->
    {{ partial "nav-list.html" . }}
    </div><!-- End Nav bar -->
       
    <div class="container"><!-- Begin Blog container -->

    {{ if .Site.Params.showlatest }}
    <h2 class="title is-2 top-pad">Latest Post</h2>
        {{ range first 1 (where .Data.Pages.ByPublishDate "Section" "blog") }} 
        <div class="summary">{{ .Date.Format .Site.Params.dateform }}
            <h3 class="title is-3 strong-post-title"><a href="{{ .RelPermalink }}">{{ .Title }}</a></h3>
                <div class="markdown">
                {{ .Summary }}
                {{ if .Truncated }}
                <a href="{{ .RelPermalink }}">...Read More</a>
                {{ end }}
                </div>
        </div>
        {{ end }}
    {{ end }}

    <h2 class="title is-2 top-pad">All Posts</h2>
        <ul>
        {{ range .Data.Pages.ByPublishDate }}
            {{ if eq .Section "blog" }}
                {{ partial "li.html" . }}
            {{ end }}
        {{ end }}
        </ul>

    </div><!-- End Blog container -->

<div class="container has-text-centered top-pad">
<hr>
<a href="{{ .Permalink }}#top"><i class="fa fa-arrow-up"></i></a>
<hr>
</div>

{{ partial "footer.html" . }}
</div><!-- End fade in two -->
</div><!-- End parent section -->

<!-- Bitty scrolling links script -->
<script>
$('a[href^="{{ .Permalink }}#"]').click(function(e) {
    e.preventDefault();
    var target = this.hash;
    $('html, body').animate({
    scrollTop: $(target).offset().top
    }, 500);
    return false;
})
</script>

</body>