<html>

<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css"/>
<title>Login</title>
<script th:inline="javascript">
/*<![CDATA[*/
    function validate() {
        if (document.f.username.value == "" && document.f.password.value == "") {
            alert(/*[[#{message.username} + #{message.password}]]*/);
            document.f.username.focus();
            return false;
        }
        if (document.f.username.value == "") {
            alert(/*[[#{message.username}]]*/);
            document.f.username.focus();
            return false;
        }
        if (document.f.password.value == "") {
            alert(/*[[#{message.password}]]*/);
            document.f.password.focus();
            return false;
        }
    }
/*]]>*/ 
</script>
<style type="text/css">
.wrapper{width:500px;margin-left:auto;margin-right:auto}
label{padding-left:0 !important}
</style>
</head>
<body>


    <div class="container">
        <div class="row wrapper">
            <h1>Login</h1>
            <br/><br/>
            
            <form name='f' action="login" method='POST' onsubmit="return validate();">
                
                 <label class="col-sm-4">Email</label>
                 <span class="col-sm-8"><input class="form-control" type='text' name='username' value=''/></span>
                
                <br/><br/>        
                 <label class="col-sm-4">Password</label>
                 <span class="col-sm-8"><input class="form-control" type='password' name='password' /></span>
                
                <br/><br/>
                 <input class="btn btn-primary" name="submit" type="submit" />
 
            </form>
        </div>
    </div>
</body>

</html>