{% extends 'base.html.twig' %}

{% block title %} Accueil {% endblock %}

{% block stylesheets %}
    {{ parent() }}
    <link rel="stylesheet" href="{{ asset('styles/vitrine/index.css') }}">
    <link rel="stylesheet" href="{{ asset('styles/globals/bulles.css') }}">
{% endblock %}

{% block main %}
    <div class="bulle-container">
        <section class="bulle bulle-all-col flex-column align-items-center">
            <h1 class="text-center">Bienvenue sur le serveur de Ploush</h1>
            <p class="text-center">Le serveur est accessible a l'adresse :
                <span class="copy-link" data-controller="copy-link"
                      data-action="click->copy-link#copy" data-copy-link-target="link"
                      data-copy-text="ploush.top"
                >ploush.top</span></p>
        </section>

        <section class="bulle bulle-2-col bulle-2-row">
            <h4>Bienvenue sur le serveur de Ploush</h4>
            <p>Celui-ci est accessible a l'adresse <span class="copy-link" data-controller="copy-link" data-action="click->copy-link#copy" data-copy-link-target="link" data-copy-text="ploush.top">ploush.top</span></p>
        </section>

        <section class="bulle bulle-2-col">
            <h4>Conseil launcher</h4>
            <p>Afin de vous faciliter l'installation des mods, je vous conseille vivement d'utiliser <a href="https://prismlauncher.org/" target="_blank" rel="noopener noreferrer">prism launcher</a> .</p>
        </section>

        <section class="bulle">
            <h4>Bienvenue sur le serveur de Ploush</h4>
            <p>Celui-ci est accessible a l'adresse <span class="copy-link" data-controller="copy-link" data-action="click->copy-link#copy" data-copy-link-target="link" data-copy-text="ploush.top">ploush.top</span></p>
        </section>
    </div>
{% endblock %}
