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

{% block localstyle %}
.thumbnail {
    text-align:center;
}

.thumbnail img {
    width:200px;
    border: 5px solid #fff;
    border-radius: 10px;
}

.caption p {
    text-align:justify;
    font-size:14px;
    word-wrap: break-word;

}

.caption ul {
    margin-top:-10px;
    padding-left: 20px;
}

.caption li {
    text-align:left;
    font-size:14px;
    word-wrap: break-word;
    font-style: italic;

}

h3 {
    margin-top:10px;
}
{% endblock %}


{% block body %}
    <div style="width: 400px;margin: auto;text-align: center;margin-top: 10px;">
        <a href="{{ path("app_home") }}">
        <img src="/{{ appAlias }}/uploads/logo/{{app.session.get("logolight")}}" style="max-width: 100%; max-height:200px;">
        <h1 style="text-transform:uppercase; padding-top:0px">{{ app.session.get('appname') }}</h1>
        </a>

        <br>
        
        {% if not app.user and moderegistration!="none" and appMasteridentity=="SQL"%}
        <a href="{{ path("app_resetpwd01") }}">Mot de passe oublié ?</a>
        {% endif %}
    </div>

    <div class="container row m-auto">
        <div class="col-lg-3">
            <div class="thumbnail" style="margin-top:10px; border:none; background-color:transparent">
                <img class="imgreflect" src="/{{ appAlias }}/images/thumb-01.jpg"/>

                <div class="caption">
                    <h3 style="text-align:center">Portail<br>Profilé</h3>
                    <p>Tous les éléments du portail peuvent être distribués en fonction du profil de l'utilisateur.</p>
                    <p>Il est possible de définir le  profil de l'utilisateur en fonction :
                        <ul>
                            <li>De son groupe d'appartenance</li>
                            <li>D'attributs Annuaire</li>
                            <li>D'attributs SSO</li>
                        </ul>
                    </p>
                    <p>En fonction du profil de l'utilisateur, il est possible de distribuer :
                        <ul>
                            <li>Des pages en onglet</li>
                            <li>Des Flux RSS</li>
                            <li>Des Annonces</li>
                            <li>Des Applications Web</li>
                            <li>Des Calendriers</li>
                        </ul>
                    </p>
                </div>
            </div>
        </div>

        <div class="col-lg-3">
            <div class="thumbnail" style="margin-top:10px; border:none; background-color:transparent">
                <img class="imgreflect" src="/{{ appAlias }}/images/thumb-02.jpg"/>

                <div class="caption">
                    <h3 style="text-align:center">Portail<br>Personnalisable</h3>
                    <p>En fonction de la configuration et de leur profil, les utilisateurs du portail sont libres de créer leur propre page.</p>
                    <p>Les pages de l'utilisateur pouvant prendre plusieurs formes :
                        <ul>
                            <li>Une page pointant sur l'adresse d'un autre site</li>
                            <li>Une page construite par l'utilisateur via l'utilisation d'un éditeur riche</li>
                            <li>Une page constituée de widgets qu'il dispose selon son libre choix</li>
                        </ul>
                    </p>
                </div>
            </div>
        </div>


        <div class="col-lg-3">
            <div class="thumbnail" style="margin-top:10px; border:none; background-color:transparent">
                <img class="imgreflect" src="/{{ appAlias }}/images/thumb-03.jpg"/>

                <div class="caption">
                    <h3 style="text-align:center">Portail<br>Evolutif</h3>
                    <p>Ninegate est évolutif dans le sens où, vous disposerez d'une large bibliothèque de widgets qui composeront vos pages.</p>
                    <p>Voici quelques exemples :
                        <ul>
                            <li>Widget URL</li>
                            <li>Widget Flux RSS</li>
                            <li>Widget Editeur de texte</li>
                            <li>Widget Gestionnaire de tâches</li>
                            <li>Widget Calendriers</li>
                            <li>Widget Favoris</li>
                            <li>Widget Dépôt de Fichiers</li>
                            <li>Et bien d'autres encore</li>
                        </ul>
            </div>
            </div>
        </div>

        <div class="col-lg-3">
            <div class="thumbnail" style="margin-top:10px; border:none; background-color:transparent">
                <img class="imgreflect" src="/{{ appAlias }}/images/thumb-04.jpg"/>

                <div class="caption">
                    <h3 style="text-align:center">Portail</br>Open Source</h3>
                    <p>Ce projet est opensource
                        <ul>
                            <li>Vous pouvez à tout moment modifier le code de votre portail</li>
                            <li>Distribuer {{ app.session.get('appname') }}</li>
                        </ul>
                    </p>
                    <p>Ninegate est développé dans le cadre du projet <a href='https://envole.ac-dijon.fr/ninegate/' target='_blank'>Envole</a>. Vous pourrez trouver le code source de Ninegate sur la <a href='https://dev-eole.ac-dijon.fr/projects/eole-eportail' target='_blank'>forge du projet</a></p>
                    <p>Ninegate est propulsé par la société <a href='https://cadoles.com' target='_blank'>Cadoles</a></p>
                </div>
            </div>
        </div>
    </div>
{% endblock %}