---
layout: base.njk
key: home
title: Home
eleventyNavigation:
  key: home
  title: Home
  icon: home
---
<div class="d-flex flex-column">
    <div class="flex-column flex-grow p-3">
        <div class="row py-5">
            <div class="col">
                <img class="logo" src="/img/samuel.png">
            </div>
        </div>

        <div class="row justify-content-center py-4 border-top">
            <div class="col-lg-8 col-md-10 col-12">
                <h1 class="sp-codes">SP-CODES</h1>
                <p class="lead text-center mb-2">
                    Welcome to sp-codes!
                    My name is Samuel Philipp and I am a software engineer from Magdeburg.
                    On this site you will find information about me and an overview of the services I provide. Feel free
                    to look around or use the various services.
                </p>
            </div>
        </div>
        <div class="row justify-content-center py-4 border-top">
            <div class="col-lg-8 col-md-10 col-12">
                <h1 class="heading"><a href="/{{locale}}/services">Services</a></h1>
                <div class="row">
                    {%- for service in services %}
                    <div class="col-12 col-md-6 p-3">
                        <div class="service flat">
                            <a class="link inner" href="/{{locale}}/services/{{service.id}}">
                                <i class="{{service.icon}} fa-fw fa-2x"></i>
                                <h2 class="mt-2">{{service.name}}</h2>
                            </a>
                        </div>
                    </div>
                    {%- endfor %}
                </div>
            </div>
        </div>
        <div class="row justify-content-center pt-4 border-top">
            <div class="col-lg-8 col-md-10 col-12">
                <h1 class="heading">Profiles & Contact</h1>
                <p class="lead text-center mb-2">
                    You have found a mistake, suggestions, or any other question? Feel free to contact me via one of the
                    following platforms. I look forward to your message!
                </p>
            </div>
        </div>

        <div class="d-flex justify-content-center flex-wrap my-3 contact-links">
            <div class="m-2"><a href="mailto:mail@sp-codes.de"><span
                    class="fas fa-fw fa-4x fa-envelope"></span></a></div>
            <div class="m-2"><a href="https://matrix.to/#/@samuel-p:matrix.sp-codes.de">
                <img class="matrix-icon" src="img/matrix.png" alt=""></a></div>
            <div class="m-2"><a rel="me" href="https://social.tchncs.de/@samuel_p"><span
                    class="fab fa-fw fa-4x fa-mastodon"></span></a></div>
            <div class="m-2"><a href="https://stackoverflow.com/users/9662601/samuel-p"><span
                    class="fab fa-fw fa-4x fa-stack-overflow"></span></a></div>
            <div class="m-2"><a href="https://gitlab.com/samuel-p"><span
                    class="fab fa-fw fa-4x fa-gitlab"></span></a></div>
            <div class="m-2"><a href="https://github.com/samuel-p"><span
                    class="fab fa-fw fa-4x fa-github"></span></a></div>
            <div class="m-2"><a href="https://hub.docker.com/u/samuelph"><span
                    class="fab fa-fw fa-4x fa-docker"></span></a></div>
        </div>

        <div class="d-flex justify-content-center mb-3">
            <div class="text-center">
                <a href="https://stackexchange.com/users/13389989/samuel-philipp"><img
                        src="https://stackexchange.com/users/flair/13389989.png" width="208" height="58"
                        alt="profile for Samuel Philipp on Stack Exchange, a network of free, community-driven Q&amp;A sites"
                        title="profile for Samuel Philipp on Stack Exchange, a network of free, community-driven Q&amp;A sites"/></a>
            </div>
        </div>

        <div class="d-flex justify-content-center mb-3">
            <div class="lead text-center">
                <a href="https://samuel-philipp.de">samuel-philipp.de</a>
            </div>
        </div>
    </div>
</div>