<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="login-body">
<article class="container-login center-block">
<section>
<div class="tab-content tabs-login col-lg-12 col-md-12 col-sm-12 cols-xs-12">
<div id="login-access" class="tab-pane fade active in">
<h2 style="text-align: center;">Phoenix.Compliance.Platform</h2>
<c:choose>
<c:when test="${not empty param.login_error and param.login_error == 12}">
<h2 class="login-table-error">Session expired</h2>
</c:when>
<c:when test="${not empty param.login_error and param.login_error == 3}">
<h2 class="login-table-error">Bad credentials</h2>
</c:when>
<c:when test="${not empty param.login_error and param.login_error == 4}">
<h2 class="login-table-error">Account disabled</h2>
</c:when>
<c:when test="${not empty param.login_error and param.login_error == 8}">
<h2 class="login-table-error">User credentials have expired</h2>
</c:when>
<c:when test="${not empty param.login_error and param.login_error == 1}">
<h2 class="login-table-error">${SPRING_SECURITY_LAST_EXCEPTION.message}</h2>
</c:when>
<c:when test="${not empty param.login_error}">
<h2 class="login-table-error">Error Unknown</h2>
</c:when>
<c:otherwise>
<h2><i class="glyphicon glyphicon-log-in"></i> Log In</h2>
</c:otherwise>
</c:choose>
<form method="post" action="${appContext}/j_spring_security_check" accept-charset="utf-8" autocomplete="off" role="form" class="form-horizontal" onsubmit="return securitySubmit();">
<div class="form-group ">
<label for="login" class="sr-only">Username</label>
<input type="text" class="form-control" name="j_username" id="j_username"
placeholder="Username" tabindex="1" value="" />
</div>
<div class="form-group ">
<label for="password" class="sr-only">Password</label>
<input type="password" class="form-control" name="j_password" id="j_password"
placeholder="Password" value="" tabindex="2" />
</div>
<div class="checkbox" style="display: none;">
<label class="control-label" for="remember_me">
<input type="checkbox" name="remember_me" id="remember_me" value="1" class="" tabindex="3" /> Remember Me
</label>
</div>
<br/>
<div class="form-group ">
<button type="submit" name="log-me-in" id="submit" tabindex="5" class="btn btn-lg btn-primary">Log In</button>
</div>
</form>
</div>
<div class="tab-content login-footer">
<span class="footer-right">Copyright © 2015 <a target="_new" href="http://www.csttech.it">CST Technobank srl</a> All Rights Reserved.</span>
</div>
</div>
</section>
<div id="login-phoenix-logo">
<span id="login-phoenix-logo-powered">powered by</span>
</div>
</article>
</div>
@import url("http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700");
body {
font-family: Open Sans;
font-size: 14px;
line-height: 1.42857;
background: #333333;
height: 350px;
padding: 0;
margin: 0;
}
.container-login {
min-height: 0;
width: 640px;
color: #333333;
margin-top: 40px;
padding: 0;
}
.center-block {
display: block;
margin-left: auto;
margin-right: auto;
}
.container-login > section {
margin-left: 0;
margin-right: 0;
padding-bottom: 10px;
}
#top-bar {
display: inherit;
}
.nav-tabs.nav-justified {
border-bottom: 0 none;
width: 100%;
}
.nav-tabs.nav-justified > li {
display: table-cell;
width: 1%;
float: none;
}
.container-login .nav-tabs.nav-justified > li > a,
.container-login .nav-tabs.nav-justified > li > a:hover,
.container-login .nav-tabs.nav-justified > li > a:focus {
background: #ea533f;
border: medium none;
color: #ffffff;
margin-bottom: 0;
margin-right: 0;
border-radius: 0;
}
.container-login .nav-tabs.nav-justified > .active > a,
.container-login .nav-tabs.nav-justified > .active > a:hover,
.container-login .nav-tabs.nav-justified > .active > a:focus {
background: #ffffff;
color: #333333;
}
.container-login .nav-tabs.nav-justified > li > a:hover,
.container-login .nav-tabs.nav-justified > li > a:focus {
background: #de2f18;
}
.tabs-login {
background: #ffffff;
border: medium none;
margin-top: -1px;
padding: 10px 30px;
}
.container-login h2 {
color: #254262;
}
.form-control {
background-color: #ffffff;
background-image: none;
border: 1px solid #999999;
border-radius: 0;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
color: #333333;
display: block;
font-size: 14px;
height: 34px;
line-height: 1.42857;
padding: 6px 12px;
transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
width: 100%;
}
.container-login .checkbox {
margin-top: -15px;
}
.container-login button {
background-color: #254262;
border-color: #254262;
color: #ffffff;
border-radius: 0;
font-size: 18px;
line-height: 1.33;
padding: 10px 16px;
width: 100%;
}
.container-login button:hover,
.container-login button:focus {
background: #de2f18;
border-color: #be2815;
}
.login-footer {
color: black;
}
.footer-left {
float: left;
}
.footer-right{
float: right;
}
#login-phoenix-logo {
background-image: url("../../images/login/phoenix-logo.gif");
bottom: 40px;
height: 43px;
position: absolute;
right: 18px;
width: 163px;
}
.login-table-error{
color: red;
}
function securitySubmit() {
if ($('j_username').value.length == 0 || $('j_password').value.length == 0) {
alert('Username e password non possono essere vuoti');
return false;
} else
return true;
}
document.observe("dom:loaded", function() {
$('j_username').focus();
});
