<!DOCTYPE html>
<html lang="{{ .Site.LanguageCode }}">

    <head>
        {{ partial "head/metadata.html" . }}
        {{ if .Site.Params.plausible }}{{ partial "head/plausible.html" . }}{{ end }}
        {{ partial "head/openGraph.html" . }}
        {{ partial "head/favicons.html" . }}
        {{ partial "head/css.html" . }}
        {{ partial "css/owlCarousel.html" . }}
    </head>

    <body>
        {{ with .Site.GetPage "/home" }}
        <section id="top" class="hero is-{{ .Site.Params.home.introHeight | default "fullheight" }}">
            <!-- Hero head section to play nice with Bulma -->
            <div class="hero-head"></div>

            <!-- Super sweet Hero body title -->
            <div class="hero-body">
                <div class="container has-text-centered">
                    <!-- Title and tagline -->
                    <h1 class="bold-title {{ if or (.Site.Params.fadeIn | default true) .Site.Params.fadeInIndex }}fade-in one{{ end }}">
                        {{ .Title | markdownify }}
                    </h1>
                    <div class="subtitle is-3 {{ if or (.Site.Params.fadeIn | default true) .Site.Params.fadeInIndex }}fade-in two{{ end }}">
                        {{ .Content }}
                    </div>
                    <!-- End title and tagline -->
                    <!-- Some social icons -->
                    <div class="{{ if or (.Site.Params.fadeIn | default true) .Site.Params.fadeInIndex }}fade-in three{{ end }}">
                        {{ partial "home/social.html" . }}
                    </div>
                    <!-- End top social icons -->
                </div>
            </div> <!-- End of Hero body -->
            {{ end }}

            <div class="hero-foot {{ if or (.Site.Params.fadeIn | default true) .Site.Params.fadeInIndex }}fade-in three{{ end }}">
                <!-- Tell them all about it! -->
                {{ partial "nav.html" . }}
            </div>
        </section> <!-- Done with Hero -->

        {{ with .Site.GetPage "/home" }}
        {{ $home := . }}
        {{ $pages := .Resources.ByType "page" }}

        {{ with .Site.GetPage "/blog" }}
            {{ $pages = $pages | append . }}
        {{ end }}

        {{ with .Site.GetPage "/projects" }}
            {{ $pages = $pages | append . }}
        {{ end }}

        {{ range sort $pages "Params.weight" }}
        {{ if ne .Name "contact.md" }}
        {{ if .File }}
        {{ if eq (os.Stat .File.Dir).Name "projects" }}
            <!-- Now for some cool projects -->
            {{ partial "home/projects.html" . }}
        {{ else if eq (os.Stat .File.Dir).Name "blog" }}
            <!-- Let`s show some blog posts -->
            {{ partial "home/blog.html" . }}
        {{ else }}

        <!-- Range through all sections in /home execept contact.md -->
        <div class="section" id="{{ .File.TranslationBaseName }}">
            <div class="container">
                <h2 class="title is-2 has-text-centered">{{ .Title | markdownify }}</h2>
                {{ if .Params.Image }}
                <div class="columns">
                    <div class="column is-one-third has-text-centered">
                        {{ with $home.Resources.GetMatch .Params.Image }}
                        {{ with .Resize "320x" }}
                        <img class="img-responsive avatar" src="{{ .Permalink }}" alt="{{ .Name }}">
                        {{ end }}
                        {{ end }}
                    </div>
                    <div class="markdown column">
                        {{ .Content }}
                    </div>
                </div>
                {{ else }}
                <div class="markdown has-text-centered">
                    {{ .Content }}
                </div>
                {{ end }}
            </div>
            <!-- End About container-->
            {{ partial "top-icon.html" . }}
        </div>
        <div class="container">
            <hr>
        </div>
        {{ end }}
        {{ end }}
        {{ end }}
        {{ end }}
        <!-- Let`s chat, shall we? -->
        {{ with .Resources.GetMatch "contact.md" }}
        <div class="section" id="{{ .File.TranslationBaseName }}">
            <div class="container has-text-centered">
                <h2 class="title is-2">{{ .Title | markdownify }}</h2>
                <div class="markdown">
                    {{ .Content }}
                </div>
                {{ if .Site.Params.home.localTime }}
                <p>{{ i18n "index_currentTime" . }} <span id="time"></span>.</p>
                {{ end }}
                {{ with .Site.Params.email }}
                <h3 class="subtitle is-3 has-text-centered top-pad">
                    <a href="mailto:{{ . }}">{{ . }}</a>
                </h3>
                {{ end }}
                {{ partial "home/social.html" . }}
            </div>
            <!-- End Contact container -->
            {{ partial "top-icon.html" . }}
        </div>
        <div class="container">
            <hr>
        </div>
        {{ end }}
        <!-- End Contact section -->
        {{ end }}

        {{ partial "footer/text.html" . }}

        <!-- End of fade in three section -->
        {{ partial "footer/scripts.html" . }}
        {{ partial "js/owlCarousel.html" . }}

        {{ if .Site.Params.home.localTime }}
        <script>
            function update_localtime() {
                const time = new Date().toLocaleTimeString('{{ .Site.Params.home.timeFormat }}', { timeZone: '{{ .Site.Params.home.timeZone }}', timeStyle: 'short' });
                document.getElementById('time').innerHTML = time;
            }
            update_localtime();
            // Updating every second to prevent seconds looking like stood still when timeStyle is ignored.
            setInterval(update_localtime, 1000);
        </script>
        {{ end }}
    </body>

</html>
