{{ define "styles" }}
    {{ $styles := resources.Get "css/index.css" | toCSS | minify }}

    <link rel="stylesheet" href="{{ $styles.Permalink }}" />
{{ end }}
{{ define "main" }}
    {{ $faceImage := resources.Get "images/big-face.webp" }}
    
    <section id="intro">
        <div>
            <h1>Hi! I am <span>Hazem</span>, a software engineer currently working at <a href="https://finteum.com" target="_blank">Finteum</a></h1>
            <p>I have over two years of experience mainly working on web and cross platform mobile applications in E-Commerce, Fintech, Auditing and Compliance.</p>
            <div id="action-buttons">
                <a href="{{ urls.JoinPath .Site.BaseURL "blog" }}">Blog</a>
                <a href="{{ urls.JoinPath .Site.BaseURL "contact" }}">Contact</a>
            </div>
        </div>
        <img src="{{ $faceImage.Permalink }}" alt="Hazem Krimi's face" loading="lazy">
    </section>

    <section id="about">
        <h2>About</h2>
        <p>Tinkering is what got me to where I am now as a professional software engineer.</p>
        {{ partial "about-card.html" . }}
    </section>

    {{ if (gt (len (where .Site.RegularPages "Section" "projects")) 0) }}
        <section id="projects">
            <div>
                <h2>Projects</h2>
                <a class="read-more" href="{{ urls.JoinPath .Site.BaseURL "projects" }}">
                    View all projects
                </a>
            </div>
            <p>These are all the projects I worked on personally and professionally.</p>
            {{ range (where .Site.Pages "Section" "projects") }}
                {{ range first 2 .Pages }}
                    {{ partial "card.html" . }}
                {{ end }}
            {{ end }}
        </section>
    {{ end }}
    
    {{ if (gt (len (where .Site.RegularPages "Section" "blog")) 0) }}
        <section id="blog">
            <div>
                <h2>Blog</h2>
                <a class="read-more" href="{{ urls.JoinPath .Site.BaseURL "blog" }}">
                    View all blog posts
                </a>
            </div>
            <p>These are articles about things I learned about software engineering.</p>
            {{ range (where .Site.Pages "Section" "blog") }}
                {{ range first 2 .Pages }}
                    {{ partial "card.html" . }}
                {{ end }}
            {{ end }}
        </section>
    {{ end }}

    <section id="contact">
        <h2>Contact</h2>
        <p>Here you can contact me personally for any questions or opportunities.</p>

        {{ partial "contact-form.html" . }}
    </section>
{{ end }}