site/_includes/layouts/services/services.njk

<!-- publics & private services -->
<article id="services" class="window">
    <div class="header">
        <div class="titlebar-icon" aria-hidden="true">
            <span class="icon tabler--server-cog"></span>
        </div>
        <a href="#services">Services</a>
        <div class="window-buttons" aria-hidden="true">
            <span class="icon tabler--minimize"></span>
            <span class="icon tabler--maximize"></span>
        </div>
        <div class="close-button" aria-hidden="true">
            <span class="icon tabler--x"></span>
        </div>
    </div>
    <section>
        <h1><a href="#services">Services</a></h1>
        <p>All of our services that we host on Synth.download will be listed here. If you have a suggestion for a service to possibly look into hosting, feel free to poke at <a href="https://sneexy.synth.download">Sneexy</a>!</p>
        <p>Any service with <span class="badge">Private</span> listed next to its name means that it's an invite-only service, and/or requires an account for accessibility/complete usage. <small>To boil it down, almost all services will be <span class="badge">Private</span> unless it's a service that has no need for an account such an alternative frontend.</small></p>
        {% include "layouts/services/toc.njk" %}
        <hr class=solid>
        {% include "layouts/services/frontends.njk" %}
        {% include "layouts/services/social.njk" %}
        {% include "layouts/services/chat.njk" %}
        {% include "layouts/services/sharing.njk" %}
        {% include "layouts/services/fun.njk" %}
        {% include "layouts/services/personal.njk" %}
        {% include "layouts/services/other.njk" %}
    </section>
</article>