<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/extras/spring-security">

<head>
    <div th:replace="fragments/head :: headFragment">
        <meta charset="UTF-8">
        <title id="pageTitle">Home</title>
    </div>

    <!-- <script th:src="@{js/my_Crypto.js}" type="text/javascript"></script> -->



    <script src="https://code.jquery.com/jquery-2.1.4.min.js" th:if="false"></script>
    <script src="http://blackpeppersoftware.github.io/thymeleaf-fragment.js/thymeleaf-fragment.js" defer="defer"
        th:if="false"></script>


    </link>
</head>

<body>
    <div th:include="fragments/navbar :: navbarFragment"></div>
    <header id="home-section">
        <div class="dark-overlay">
            <div class="home-inner container">
                <div class="row">
                    <div class="col-lg-8 col-md-6 d-lg-block ">

                        <!-- <div class="jumbotron bg-primary"> -->
                        <div class="d-flex rounded">

                            <div class="">
                                <h1 class="display-4">Chatto - Self Hosted, Minimal E2E Chat</h1>
                                <!-- <p th:if="${chatUser}" th:text="'username: ' + ${chatUser.userName}">You need to login</p> 
									<th:block th:each="userName: ${userNames}">
										<div th:text="${userName}"></div>
                                    </th:block> -->
                                <span th:if="${message}"> </span>
                                <div th:switch="${#authentication.name}">
                                    <p th:case="'anonymousUser'">Welcome guest
                                    </p>
                                    <p th:case="*"><span th:text="'Welcome ' + ${#authentication.name}"></span></p>
                                </div>
                                <p>Chatto is a minimal, end to end encrypted chat application.</p>
                                <!-- <button class="btn btn-secondary"> <a href="registration.html" th:href="{@/registration}">Get Started</a></button> -->
                                <a class="btn btn-secondary" href="registration.html" th:href="@{/registration}">Get Started</a>
                            </div>

                        </div>
                    </div>
                    <div class="col-lg-4 col-md-6">
                        <div class="card bg-primary text-justified">
                            <h2 class="card-header text-center">Features</h2>
                            <div class="card-body ">

                                <p class="card-text lead">
                                    <ul class="">
                                        <li>
                                            <p class="lead">
                                                <!-- <i class="fas fa-check"></i> -->
                                                Self Hosted
                                            </p>
                                        </li>
                                        <li>
                                            <p class="lead">
                                                <!-- <i class="fas fa-check"></i> -->
                                                End To End Encrypted Messaging
                                            </p>
                                        </li>
                                        <li>
                                            <p class="lead">
                                                <!-- <i class="fas fa-check"></i> -->
                                                Free Software (AGPLv3 Licensed)</p>
                                        </li>
                                        <li>
                                            <p class="lead">
                                                <!-- <i class="fas fa-check"></i> -->
                                                Built With Java And Spring
                                            </p>
                                        </li>
                                    </ul>
                                </p>
                                <!-- <p class="card-text">
                                    Open Source
                                </p>
                                <p class="card-text">
                                    Built with Java
                                </p> -->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </header>
    <th:block th:include="fragments/head :: footerFragment"></th:block>
</body>

</html>