Unify UI
This commit is contained in:
Dmitry Isaenko
parent
5b03cf8367
commit
bc5a711a60
8 changed files with 279 additions and 141 deletions
|
|
@ -1,39 +1,44 @@
|
||||||
@font-face{
|
@font-face {
|
||||||
font-family: "Terminus";
|
font-family: "Terminus";
|
||||||
src: url('/styles/TerminusBold.ttf');
|
src: url('/styles/TerminusBold.ttf');
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
margin-right: 0;
|
margin-right: 0;
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
font-family: Terminus;
|
font-family: Terminus;
|
||||||
background-color: #212121;
|
background-color: #212121;
|
||||||
color: #cfcfcf;
|
color: #cfcfcf;
|
||||||
}
|
}
|
||||||
|
|
||||||
.validationError {
|
.validationError {
|
||||||
color: red;
|
color: red;
|
||||||
}
|
|
||||||
.header-container {
|
|
||||||
text-align: left;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.header-container .header-bar {
|
|
||||||
position: absolute;
|
|
||||||
right: 10px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
table, th, td {
|
.header-container {
|
||||||
border: 1px solid;
|
text-align: left;
|
||||||
border-collapse: collapse;
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-container .header-bar {
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
table,
|
||||||
|
th,
|
||||||
|
td {
|
||||||
|
border: 1px solid;
|
||||||
|
border-collapse: collapse;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: #cfcfcf;
|
color: #cfcfcf;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
a:link {
|
a:link {
|
||||||
color: #cfcfcf;
|
color: #cfcfcf;
|
||||||
}
|
}
|
||||||
|
|
@ -46,32 +51,35 @@ a:visited {
|
||||||
color: #949494;
|
color: #949494;
|
||||||
}
|
}
|
||||||
|
|
||||||
ul{
|
ul {
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
header{
|
header {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
.header_wrapper{
|
|
||||||
background:#323833;
|
.header_wrapper {
|
||||||
|
background: #323833;
|
||||||
color: #a7a691;
|
color: #a7a691;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
width:100%;
|
width: 100%;
|
||||||
padding:0px;
|
padding: 0px;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
.container{
|
|
||||||
|
.container {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-width: 1280px;
|
max-width: 1280px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header_branding{
|
.header_branding {
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
#header_right_block{
|
|
||||||
|
#header_right_block {
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
list-style-image: none;
|
list-style-image: none;
|
||||||
font-family: sans-serif;
|
font-family: sans-serif;
|
||||||
|
|
@ -82,14 +90,21 @@ header{
|
||||||
padding: 0%;
|
padding: 0%;
|
||||||
font-size: 0.9em;
|
font-size: 0.9em;
|
||||||
}
|
}
|
||||||
.ul_right_block{
|
|
||||||
|
.ul_right_block {
|
||||||
margin: 0 !important;
|
margin: 0 !important;
|
||||||
padding: 0 !important;
|
padding: 0 !important;
|
||||||
}
|
}
|
||||||
.li_right_block{
|
|
||||||
|
.li_right_block {
|
||||||
|
margin-left: 5px;
|
||||||
|
margin-right: 5px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
float: left;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
.header_entry{
|
|
||||||
|
.header_entry {
|
||||||
height: 65px;
|
height: 65px;
|
||||||
line-height: 65px;
|
line-height: 65px;
|
||||||
display: block;
|
display: block;
|
||||||
|
|
@ -98,26 +113,68 @@ header{
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
font-variant: small-caps;
|
font-variant: small-caps;
|
||||||
text-shadow: -1px -1px 0 #1e1e1e, 1px -1px 0 #1e1e1e, -1px 1px 0 #1e1e1e, 1px 1px 0 #1e1e1e;
|
text-shadow: -1px -1px 0 #1e1e1e, 1px -1px 0 #1e1e1e, -1px 1px 0 #1e1e1e, 1px 1px 0 #1e1e1e;
|
||||||
color:#74bfbd;
|
color: #74bfbd;
|
||||||
}
|
}
|
||||||
.header_entry_link:hover{
|
|
||||||
|
.header_entry_link:hover {
|
||||||
color: #b6a795;
|
color: #b6a795;
|
||||||
}
|
}
|
||||||
.block{
|
|
||||||
|
.block {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
.block_inner{
|
|
||||||
|
.block_inner {
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
a.entry{
|
|
||||||
|
a.entry {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
.header_title{
|
|
||||||
|
.header_title {
|
||||||
font-size: 1.5em;
|
font-size: 1.5em;
|
||||||
}
|
}
|
||||||
hr{
|
|
||||||
border: 0;
|
hr {
|
||||||
|
border: 0;
|
||||||
border-bottom: 1px dashed;
|
border-bottom: 1px dashed;
|
||||||
background: none;
|
background: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
margin: 1em 0;
|
||||||
|
font-family: sans-serif;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: normal;
|
||||||
|
text-align: center;
|
||||||
|
font-variant: small-caps !important;
|
||||||
|
background-color: #b0c6af !important;
|
||||||
|
border: none;
|
||||||
|
border-radius: 2px;
|
||||||
|
padding: 5px 25px 5px 25px;
|
||||||
|
color: #4a3c3c;
|
||||||
|
}
|
||||||
|
button:hover {
|
||||||
|
background-color: #c2dac0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sign {
|
||||||
|
width: 25%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.base {
|
||||||
|
background: #283338;
|
||||||
|
padding: 20px;
|
||||||
|
box-shadow: 0 0 8px -3px #37474e;
|
||||||
|
border-radius: 3px;
|
||||||
|
width: 100%;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.center{
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
width: 25em;
|
||||||
}
|
}
|
||||||
|
|
@ -9,6 +9,7 @@
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
<div th:replace="~{fragments/header :: 'header'}"></div>
|
||||||
<h1>Register</h1>
|
<h1>Register</h1>
|
||||||
<img th:src="@{/images/logo.svg}" />
|
<img th:src="@{/images/logo.svg}" />
|
||||||
<form class="regForm" method="POST" th:action="@{/register}" th:object="${registrationForm}">
|
<form class="regForm" method="POST" th:action="@{/register}" th:object="${registrationForm}">
|
||||||
|
|
|
||||||
|
|
@ -1,39 +1,44 @@
|
||||||
@font-face{
|
@font-face {
|
||||||
font-family: "Terminus";
|
font-family: "Terminus";
|
||||||
src: url('/styles/TerminusBold.ttf');
|
src: url('/styles/TerminusBold.ttf');
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
margin-right: 0;
|
margin-right: 0;
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
font-family: Terminus;
|
font-family: Terminus;
|
||||||
background-color: #212121;
|
background-color: #212121;
|
||||||
color: #cfcfcf;
|
color: #cfcfcf;
|
||||||
}
|
}
|
||||||
|
|
||||||
.validationError {
|
.validationError {
|
||||||
color: red;
|
color: red;
|
||||||
}
|
|
||||||
.header-container {
|
|
||||||
text-align: left;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.header-container .header-bar {
|
|
||||||
position: absolute;
|
|
||||||
right: 10px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
table, th, td {
|
.header-container {
|
||||||
border: 1px solid;
|
text-align: left;
|
||||||
border-collapse: collapse;
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-container .header-bar {
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
table,
|
||||||
|
th,
|
||||||
|
td {
|
||||||
|
border: 1px solid;
|
||||||
|
border-collapse: collapse;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: #cfcfcf;
|
color: #cfcfcf;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
a:link {
|
a:link {
|
||||||
color: #cfcfcf;
|
color: #cfcfcf;
|
||||||
}
|
}
|
||||||
|
|
@ -46,32 +51,35 @@ a:visited {
|
||||||
color: #949494;
|
color: #949494;
|
||||||
}
|
}
|
||||||
|
|
||||||
ul{
|
ul {
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
header{
|
header {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
.header_wrapper{
|
|
||||||
background:#323833;
|
.header_wrapper {
|
||||||
|
background: #323833;
|
||||||
color: #a7a691;
|
color: #a7a691;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
width:100%;
|
width: 100%;
|
||||||
padding:0px;
|
padding: 0px;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
.container{
|
|
||||||
|
.container {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-width: 1280px;
|
max-width: 1280px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header_branding{
|
.header_branding {
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
#header_right_block{
|
|
||||||
|
#header_right_block {
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
list-style-image: none;
|
list-style-image: none;
|
||||||
font-family: sans-serif;
|
font-family: sans-serif;
|
||||||
|
|
@ -82,14 +90,21 @@ header{
|
||||||
padding: 0%;
|
padding: 0%;
|
||||||
font-size: 0.9em;
|
font-size: 0.9em;
|
||||||
}
|
}
|
||||||
.ul_right_block{
|
|
||||||
|
.ul_right_block {
|
||||||
margin: 0 !important;
|
margin: 0 !important;
|
||||||
padding: 0 !important;
|
padding: 0 !important;
|
||||||
}
|
}
|
||||||
.li_right_block{
|
|
||||||
|
.li_right_block {
|
||||||
|
margin-left: 5px;
|
||||||
|
margin-right: 5px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
float: left;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
.header_entry{
|
|
||||||
|
.header_entry {
|
||||||
height: 65px;
|
height: 65px;
|
||||||
line-height: 65px;
|
line-height: 65px;
|
||||||
display: block;
|
display: block;
|
||||||
|
|
@ -98,26 +113,68 @@ header{
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
font-variant: small-caps;
|
font-variant: small-caps;
|
||||||
text-shadow: -1px -1px 0 #1e1e1e, 1px -1px 0 #1e1e1e, -1px 1px 0 #1e1e1e, 1px 1px 0 #1e1e1e;
|
text-shadow: -1px -1px 0 #1e1e1e, 1px -1px 0 #1e1e1e, -1px 1px 0 #1e1e1e, 1px 1px 0 #1e1e1e;
|
||||||
color:#74bfbd;
|
color: #74bfbd;
|
||||||
}
|
}
|
||||||
.header_entry_link:hover{
|
|
||||||
|
.header_entry_link:hover {
|
||||||
color: #b6a795;
|
color: #b6a795;
|
||||||
}
|
}
|
||||||
.block{
|
|
||||||
|
.block {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
.block_inner{
|
|
||||||
|
.block_inner {
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
a.entry{
|
|
||||||
|
a.entry {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
.header_title{
|
|
||||||
|
.header_title {
|
||||||
font-size: 1.5em;
|
font-size: 1.5em;
|
||||||
}
|
}
|
||||||
hr{
|
|
||||||
border: 0;
|
hr {
|
||||||
|
border: 0;
|
||||||
border-bottom: 1px dashed;
|
border-bottom: 1px dashed;
|
||||||
background: none;
|
background: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
margin: 1em 0;
|
||||||
|
font-family: sans-serif;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: normal;
|
||||||
|
text-align: center;
|
||||||
|
font-variant: small-caps !important;
|
||||||
|
background-color: #b0c6af !important;
|
||||||
|
border: none;
|
||||||
|
border-radius: 2px;
|
||||||
|
padding: 5px 25px 5px 25px;
|
||||||
|
color: #4a3c3c;
|
||||||
|
}
|
||||||
|
button:hover {
|
||||||
|
background-color: #c2dac0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sign {
|
||||||
|
width: 25%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.base {
|
||||||
|
background: #283338;
|
||||||
|
padding: 20px;
|
||||||
|
box-shadow: 0 0 8px -3px #37474e;
|
||||||
|
border-radius: 3px;
|
||||||
|
width: 100%;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.center{
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
width: 25em;
|
||||||
}
|
}
|
||||||
|
|
@ -2,30 +2,32 @@
|
||||||
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
|
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<title>Marinesco</title>
|
<title>Marinesco</title>
|
||||||
<link rel="icon" type="image/x-icon" href="/favicon.ico">
|
<link rel="icon" type="image/x-icon" href="/favicon.ico">
|
||||||
<link rel="stylesheet" th:href="@{/styles/styles.css}" />
|
<link rel="stylesheet" th:href="@{/styles/styles.css}" />
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div th:replace="~{fragments/header :: 'header'}"></div>
|
<div th:replace="~{fragments/header :: 'header'}"></div>
|
||||||
<img th:src="@{/images/logo.svg}" />
|
<div class="center">
|
||||||
|
<div class="container base">
|
||||||
|
<h1>Log in</h1>
|
||||||
|
<a href="/register">Register</a>
|
||||||
|
<form class="form-signin" method="post" action="/login">
|
||||||
|
<br /><span class="validationError" th:if="${param.error}">Unable to login. Check your username and
|
||||||
|
password.</span>
|
||||||
|
<p>
|
||||||
|
<label for="username" class="sr-only">Username</label>
|
||||||
|
<input type="text" id="username" name="login" class="form-control" placeholder="Username" required autofocus>
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
<label for="password" class="sr-only">Password</label>
|
||||||
|
<input type="password" id="password" name="pwd" class="form-control" placeholder="Password" required>
|
||||||
|
</p>
|
||||||
|
<button class="sign" type="submit">Sign in</button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
<div class="container">
|
|
||||||
<br /> New here? <a href="/register">REGISTER NOW!</a>
|
|
||||||
<br /><a href="/h2">H2</a>
|
|
||||||
<form class="form-signin" method="post" action="/login">
|
|
||||||
<h2 class="form-signin-heading">Please sign in</h2>
|
|
||||||
<br /><span class="validationError" th:if="${param.error}">Unable to login. Check your username and password.</span>
|
|
||||||
<p>
|
|
||||||
<label for="username" class="sr-only">Username</label>
|
|
||||||
<input type="text" id="username" name="login" class="form-control" placeholder="Username" required autofocus>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<label for="password" class="sr-only">Password</label>
|
|
||||||
<input type="password" id="password" name="pwd" class="form-control" placeholder="Password" required>
|
|
||||||
</p>
|
|
||||||
<button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -9,24 +9,27 @@
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div th:replace="~{fragments/header :: 'header'}"></div>
|
<div th:replace="~{fragments/header :: 'header'}"></div>
|
||||||
<h1 th:text="${header_text}"></h1>
|
<div class="container base">
|
||||||
<p>
|
<h1 th:text="${header_text}"></h1>
|
||||||
<div th:each="user : ${USR}">
|
<p>
|
||||||
<span th:text="${user.id+' '+user.name+' '+user.displayName}+' ROLES: '">user</span>
|
<div th:each="user : ${USR}">
|
||||||
<span th:each="role : ${user.role}">
|
<span th:text="${user.id+' '+user.name+' '+user.displayName}+' ROLES: '">user</span>
|
||||||
<span th:text="'[ '+${role.id+' '+role.name+' '+role.type}+' ]'">user</span>
|
|
||||||
</span>
|
|
||||||
<form method="POST" th:action="@{/manage_users/delete}" th:object="${userGenerified}">
|
|
||||||
<input type="hidden" th:value="${user.id}" name="id" />
|
|
||||||
<input type="hidden" th:value="${user.name}" name="name" />
|
|
||||||
<input type="hidden" th:value="${user.displayName}" name="displayName" />
|
|
||||||
<span th:each="role : ${user.role}">
|
<span th:each="role : ${user.role}">
|
||||||
<input type="hidden" th:value="${role.id}" th:attr="name='role'" />
|
<span th:text="'[ '+${role.id+' '+role.name+' '+role.type}+' ]'">user</span>
|
||||||
</span>
|
</span>
|
||||||
|
<form method="POST" th:action="@{/manage_users/delete}" th:object="${userGenerified}">
|
||||||
<button>DELETE</button>
|
<input type="hidden" th:value="${user.id}" name="id" />
|
||||||
</form>
|
<input type="hidden" th:value="${user.name}" name="name" />
|
||||||
<br />
|
<input type="hidden" th:value="${user.displayName}" name="displayName" />
|
||||||
|
<span th:each="role : ${user.role}">
|
||||||
|
<input type="hidden" th:value="${role.id}" th:attr="name='role'" />
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<button>DELETE</button>
|
||||||
|
</form>
|
||||||
|
<br />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -9,32 +9,41 @@
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<h1>Register</h1>
|
<div th:replace="~{fragments/header :: 'header'}"></div>
|
||||||
<img th:src="@{/images/logo.svg}" />
|
<div class="container base">
|
||||||
<form class="regForm" method="POST" th:action="@{/register}" th:object="${registrationForm}">
|
<h1>Register</h1>
|
||||||
|
<form class="regForm" method="POST" th:action="@{/register}" th:object="${registrationForm}">
|
||||||
<span class="validationError" th:if="${#fields.hasErrors('username')}" th:errors="*{username}">Error</span>
|
|
||||||
<br />
|
|
||||||
<label for="username">Username: </label>
|
|
||||||
<input type="text" name="username" id="username"/><br />
|
|
||||||
|
|
||||||
<span class="validationError" th:if="${#fields.hasErrors('password')}" th:errors="*{password}">Error</span>
|
<span class="validationError" th:if="${#fields.hasErrors('username')}" th:errors="*{username}">Error</span>
|
||||||
<br />
|
<br />
|
||||||
<label for="password">Password: </label>
|
<label for="username">Username: </label>
|
||||||
<input type="password" name="password" id="password"/><br />
|
<br />
|
||||||
|
<input type="text" name="username" id="username" size="50%" /><br />
|
||||||
|
|
||||||
<span class="validationError" th:if="${passwordsMismatch} != null" th:text="${passwordsMismatch}">false</span>
|
<span class="validationError" th:if="${#fields.hasErrors('password')}" th:errors="*{password}">Error</span>
|
||||||
<br />
|
<br />
|
||||||
<label for="confirm">Confirm password: </label>
|
<label for="password">Password: </label>
|
||||||
<input type="password" name="passwordConfirm" id="passwordConfirm" /><br />
|
<br />
|
||||||
|
<input type="password" name="password" id="password" size="50%" /><br />
|
||||||
|
|
||||||
<span class="validationError" th:if="${#fields.hasErrors('displayname')}" th:errors="*{displayname}">Error</span>
|
<span class="validationError" th:if="${passwordsMismatch} != null"
|
||||||
<br />
|
th:text="${passwordsMismatch}">false</span>
|
||||||
<label for="displayname">Displayed name: </label>
|
<br />
|
||||||
<input type="text" name="displayname" id="displayname"/><br />
|
<label for="confirm">Confirm password: </label>
|
||||||
|
<br />
|
||||||
<input type="submit" value="Register" />
|
<input type="password" name="passwordConfirm" id="passwordConfirm" size="50%" /><br />
|
||||||
</form>
|
|
||||||
|
<span class="validationError" th:if="${#fields.hasErrors('displayname')}"
|
||||||
|
th:errors="*{displayname}">Error</span>
|
||||||
|
<br />
|
||||||
|
<label for="displayname">Displayed name: </label>
|
||||||
|
<br />
|
||||||
|
<input type="text" name="displayname" id="displayname" size="50%" /><br />
|
||||||
|
<p>
|
||||||
|
<button class="sign" type="submit" >Register</button>
|
||||||
|
</p>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -9,10 +9,13 @@
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div th:replace="~{fragments/header :: 'header'}"></div>
|
<div th:replace="~{fragments/header :: 'header'}"></div>
|
||||||
<img th:src="@{/images/logo.svg}" />
|
<div class="container base">
|
||||||
<br /><a href="/login">Login</a>
|
<img th:src="@{/images/logo.svg}" />
|
||||||
<br /><a href="/profile">/profile</a>
|
<br /><a href="/login">Login</a>
|
||||||
<br /><a href="/manage_users">/manage_users</a>
|
<br /><a href="/profile">/profile</a>
|
||||||
|
<br /><a href="/manage_users">/manage_users</a>
|
||||||
|
<br /><a href="/h2">H2</a>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -9,19 +9,25 @@
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div th:replace="~{fragments/header :: 'header'}"></div>
|
<div th:replace="~{fragments/header :: 'header'}"></div>
|
||||||
|
<div class="container base">
|
||||||
<h1 th:text="${header_text}">welcome</h1>
|
<h1 th:text="${header_text}">welcome</h1>
|
||||||
<form method="POST" th:action="@{/profile/settings}" th:object="${userSettingsForm}"> <!-- -->
|
<form method="POST" th:action="@{/profile/settings}" th:object="${userSettingsForm}"> <!-- -->
|
||||||
<span class="validationError" th:if="${#fields.hasErrors('displayname')}" th:errors="*{displayname}">Error</span>
|
<span class="validationError" th:if="${#fields.hasErrors('displayname')}"
|
||||||
|
th:errors="*{displayname}">Error</span>
|
||||||
<br />
|
<br />
|
||||||
<label for="displayname">Displayed name: </label>
|
<label for="displayname">Displayed name: </label>
|
||||||
<input type="text" name="displayname" id="displayname" th:value="${userSettingsForm.displayname}" /><br />
|
<br />
|
||||||
|
<input type="text" name="displayname" id="displayname" th:value="${userSettingsForm.displayname}" size="50%" /><br />
|
||||||
|
|
||||||
<span class="validationError" th:if="${password_incorrect} != null" th:text="${password_incorrect}">false</span>
|
<span class="validationError" th:if="${password_incorrect} != null" th:text="${password_incorrect}">false</span>
|
||||||
<br />
|
<br />
|
||||||
<label for="password">New password: </label>
|
<label for="password">New password: </label>
|
||||||
<input type="password" name="newPassword" id="newPassword" /><br />
|
<br />
|
||||||
|
<input type="password" name="newPassword" id="newPassword" size="50%" /><br />
|
||||||
|
|
||||||
<input type="submit" value="Save Changes" />
|
<button class="sign" type="submit">Save Changes</button>
|
||||||
</form>
|
</form>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
Loading…
Reference in a new issue