Files
shared/account-ui/src/main/webapp/login.xhtml

96 lines
4.2 KiB
HTML

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Login Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="shortcut icon" href="#{resource['images/favicon/favicon.ico']}" />
<h:outputStylesheet name="css/admin.css" />
<style type="text/css">
/* below css hides growls in small screens and makes messages visible */
@media (max-width: 768px) {
body div.ui-growl {
display: none;
}
body div.ui-messages {
display: block;
}
}
/* below css hides messages in medium/big devices and makes growl visible in such devices */
@media (min-width: 769px) {
body div.ui-growl {
display: block;
}
body div.ui-messages {
display: none;
}
}
body.login-page {
background-color: transparent;
}
html {
background: url(#{resource[ 'images:login-bg.png' ]}) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
</style>
</h:head>
<h:body styleClass="hold-transition login-page">
<p:growl sticky="true">
<p:autoUpdate />
</p:growl>
<div id="loader" class="load-bar" style="display: none">
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
</div>
<div class="login-box">
<div class="login-logo">
<p:link href="/web/account.xhtml"><b>Account&nbsp;</b>Management</p:link>
<h:outputLabel rendered="#{instanceView.developmentVersion}" value="#{instanceView.instanceName}" />
</div>
<!-- /.login-logo -->
<div class="box login-box-body">
<h:form>
<p:focus context="panel" for="username" />
<p class="login-box-msg">Sign in to start your session</p>
<p:messages closable="true" />
<div id="panel" class="form-group has-feedback">
<p:inputText id="username" value="#{loginView.username}" styleClass="form-control" placeholder="Username"
required="true" autocomplete="off"
requiredMessage="Username is required."/>
<i class="fa fa-user form-control-feedback"></i>
</div>
<div class="form-group has-feedback">
<p:inputText value="#{loginView.password}" type="password" styleClass="form-control"
placeholder="Password" required="true" autocomplete="off" size="40"
requiredMessage="Password is required."/>
<i class="fa fa-lock form-control-feedback" style="font-size: 18px" ></i>
</div>
<div class="row">
<p:spacer height="10"/>
<div class="col-xs-12">
<p:commandButton styleClass="btn btn-success btn-block" onclick="showBar()"
action="#{loginView.authenticate}" oncomplete="if(args.validationFailed) { hideBar()}"
value="Sign In" process="@form" update="@form" icon="fa fa-sign-in" iconPos="left"/>
</div>
</div>
</h:form>
</div>
<!-- /.login-box-body -->
</div>
</h:body>
</html>