<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <div th:replace="fragments/head :: headFragment">
        <title id="pageTitle">Login</title>
    </div>
    <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>

</head>

<body>
    <div th:include="fragments/navbar :: navbarFragment"></div>
    <!-- <header id="chat-section" class="bg-secondary">
        <div class="dark-overlay">
            <div class="chat-inner container">
                <div class="row">
                    <div class="col-sm d-lg-block">
                        <h1 class="display-4">Chat with your friends</h1>
                        <div class="d-flex">
                            <div class="p-4 align-self-start">

                            </div>
                            <div class="p-4 align-self-end">

                                Lorem ipsum dolor sit, amet consectetur adipisicing elit. Laboriosam dolorem nostrum consequatur eos voluptates. Ipsam ullam quos illo qui. Quaerat corrupti nisi numquam rerum quasi nesciunt deserunt fugit commodi consequatur!

                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>

    </header> -->
    <header>
        <div class="container">
            <div class="row">
                <div class=" col-lg-6 offset-lg-3 py-5">
                    <!-- <h4 class="display-4 text-center py-2">Chat</h4> -->
                    <div class="card text-white bg-primary text-center card-form rounded p-5" id="login-card">

                        <div class="card-body rounded">
                            <!-- <h4 class="card-title">Chat</h4> -->
                            <!-- <div class="form-group">
                                <textarea id="chatTextArea" class="form-control-lg py-2" disabled></textarea>
                            </div> -->
                            <!-- <form action="#" th:action="@{/seedstartermng}" th:object="${seedStarter}" method="post"> -->
                            <!--  th:action="@{/api/chat}" -->
                            <div class="card-text">
                                <form action="#" th:action="@{/perform_login}" method="POST" id="loginForm">
                                    <!-- <fieldset>
										<legend>Please Sign In</legend> -->
                                    <h2 class="card-title mb-4">Please Sign In</h2>
                                    <div th:if="${param.error}" class="alert alert-danger">
                                        Error signing in. Please check your username and password.
                                    </div>
                                    <div th:if="${param.logout}" class="alert alert-success">
                                        You have been logged out.
                                    </div>
                                    <div class="form-group">
                                        <!-- <label for="username">Enter user name: </label> -->
                                        <input class="form-control" type="text" name="username" id="username" placeholder="Username">
                                    </div>

                                    <div class="form-group">
                                        <!-- <label for="password">Enter password: </label> -->
                                        <input class="form-control" type="password" name="password" id="password" placeholder="Password">
                                    </div>

                                    <div class="form-group">
                                        <button class="form-control btn btn-secondary" type="submit">Login</button>
                                    </div>
                                    <!-- </fieldset> -->
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </header>

    <script src="../js/login.js" type="text/javascript"></script>
</body>

</html>

<!-- form th:action="@{/login.html}" method="post" -->
<!-- <form action="#" th:action="@{/greeting}" th:object="${greeting}" method="post">
    	<p>Id: <input type="text" th:field="*{id}" /></p>
        <p>Message: <input type="text" th:field="*{content}" /></p>
        <p><input type="submit" value="Submit" /> <input type="reset" value="Reset" /></p>
    </form> -->
<!-- <form action="#" th:action="@{/perform_login}" th:object=${user} method="POST">
		<label>Enter user name: </label> 
		<input th:field="*{userName}" type="text" name="username" id="username">
		<br> <br> <label>Enter password: </label> 
		<input th:field="*{password}" type="password" name="password" id="username"> <br> <br> 
		<input type="submit" value="Submit">
	</form>
	 -->