Add footer, correct error page template

This commit is contained in:
Dmitry Isaenko 2023-12-30 00:24:47 +03:00
parent 343d7a68ba
commit ed9bac4d4e
9 changed files with 187 additions and 140 deletions

1
.gitignore vendored
View file

@ -1 +1,2 @@
postgres/docker-compose.yml postgres/docker-compose.yml
target/

View file

@ -4,13 +4,20 @@
} }
body { body {
margin-top: 0;
margin-bottom: 0;
margin-right: 0;
margin-left: 0;
font-family: Terminus; font-family: Terminus;
background-color: #212121; background-color: #212121;
color: #cfcfcf; color: #cfcfcf;
margin: 0;
padding: 0;
height: 100vh;
display: flex;
flex-direction: column;
}
.page{
flex: 1 0 auto;
padding: 0 0 0;
width: 100%;
} }
.validationError { .validationError {
@ -179,3 +186,46 @@ button:hover {
margin-right: auto; margin-right: auto;
width: 25em; width: 25em;
} }
/* footer */
.footer{
background: #323833;
color: #a7a691;
margin-top: 20px;
width: 100%;
}
.inner_footer{
padding: 10px;
display: block;
float: right;
}
.copy_link{
font-family: sans-serif;
text-shadow: -1px -1px 0 #1e1e1e, 1px -1px 0 #1e1e1e, -1px 1px 0 #1e1e1e, 1px 1px 0 #1e1e1e;
color: #74bfbd;
}
.copy_link:hover {
color: #b6a795;
}
/* error */
.error {
text-align: center;
background: #283338;
padding: 20px;
box-shadow: 0 0 8px -3px #37474e;
border-radius: 3px;
margin: auto;
}
.bli {
padding: 3px;
background-color: #D00000;
animation: blinker 2.5s ease infinite;
}
@keyframes blinker {
50% {
opacity: 0.0;
}
}

View file

@ -3,50 +3,19 @@
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type=text/css> <link rel="icon" type="image/x-icon" href="/favicon.ico">
html { <link rel="stylesheet" th:href="@{/styles/styles.css}" />
height: 100%;
}
body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-color: #212121;
color: #cfcfcf;
font-family: Terminus;
}
.error {
border-width: 3px;
border-style: double;
padding: 8px;
margin: auto;
}
.bli {
padding: 3px;
background-color: #D00000;
animation: blinker 2.5s ease infinite;
}
@keyframes blinker {
50% {
opacity: 0.0;
}
}
</style>
<title th:text="${code}">title</title> <title th:text="${code}">title</title>
</head> </head>
<body> <body>
<div class='error'> <div class='error'>
ОШИБКА: <span class='bli' th:text="${code}"></span> <a href="/">
<img height="65px" th:src="@{/images/s_logo.svg}" alt="Marinesco">
</a>
<p>
ОШИБКА <span class='bli' th:text="${code}"></span>
</p>
</div> </div>
</body> </body>

View file

@ -1,10 +1,19 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head>
</head> <head>
<body> </head>
<div th:fragment="footer">
<a href="https://redrise.ru">&copy; 2023 Dmitry Isaenko</a> <body>
</div> <div class="footer" th:fragment="footer">
</body> <div class="container">
<footer class="inner_footer">
<a class="entry" href="https://redrise.ru">
<div class="copy_link">&copy; 2023 Dmitry Isaenko</div>
</a>
</footer>
</div>
</div>
</body>
</html> </html>

View file

@ -9,25 +9,29 @@
<body> <body>
<div th:replace="~{fragments/header :: 'header'}"></div> <div th:replace="~{fragments/header :: 'header'}"></div>
<div class="center"> <div class="page">
<div class="container base"> <div class="center">
<h1>Log in</h1> <div class="container base">
<a href="/register">Register</a> <h1>Log in</h1>
<form class="form-signin" method="post" action="/login"> <a href="/register">Register</a>
<br /><span class="validationError" th:if="${param.error}">Unable to login. Check your username and <form class="form-signin" method="post" action="/login">
password.</span> <br /><span class="validationError" th:if="${param.error}">Unable to login. Check your username and
<p> password.</span>
<label for="username" class="sr-only">Username</label> <p>
<input type="text" id="username" name="login" class="form-control" placeholder="Username" required autofocus> <label for="username" class="sr-only">Username</label>
</p> <input type="text" id="username" name="login" class="form-control" placeholder="Username" required
<p> autofocus>
<label for="password" class="sr-only">Password</label> </p>
<input type="password" id="password" name="pwd" class="form-control" placeholder="Password" required> <p>
</p> <label for="password" class="sr-only">Password</label>
<button class="sign" type="submit">Sign in</button> <input type="password" id="password" name="pwd" class="form-control" placeholder="Password" required>
</form> </p>
<button class="sign" type="submit">Sign in</button>
</form>
</div>
</div> </div>
</div> </div>
<div th:replace="~{fragments/footer :: 'footer'}"></div>
</body> </body>
</html> </html>

View file

@ -8,28 +8,31 @@
</head> </head>
<body> <body>
<div th:replace="~{fragments/header :: 'header'}"></div> <div class="page">
<div class="container base"> <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}">
<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}">
<input type="hidden" th:value="${role.id}" th:attr="name='role'" />
</span>
<button>DELETE</button> <button>DELETE</button>
</form> </form>
<br /> <br />
</div>
</div> </div>
</div> </div>
<div th:replace="~{fragments/footer :: 'footer'}"></div>
</body> </body>
</html> </html>

View file

@ -9,41 +9,46 @@
</head> </head>
<body> <body>
<div th:replace="~{fragments/header :: 'header'}"></div> <div class="page">
<div class="container base"> <div th:replace="~{fragments/header :: 'header'}"></div>
<h1>Register</h1> <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> <span class="validationError" th:if="${#fields.hasErrors('username')}"
<br /> th:errors="*{username}">Error</span>
<label for="username">Username: </label> <br />
<br /> <label for="username">Username: </label>
<input type="text" name="username" id="username" size="50%" /><br /> <br />
<input type="text" name="username" id="username" size="50%" /><br />
<span class="validationError" th:if="${#fields.hasErrors('password')}" th:errors="*{password}">Error</span> <span class="validationError" th:if="${#fields.hasErrors('password')}"
<br /> th:errors="*{password}">Error</span>
<label for="password">Password: </label> <br />
<br /> <label for="password">Password: </label>
<input type="password" name="password" id="password" size="50%" /><br /> <br />
<input type="password" name="password" id="password" size="50%" /><br />
<span class="validationError" th:if="${passwordsMismatch} != null" <span class="validationError" th:if="${passwordsMismatch} != null"
th:text="${passwordsMismatch}">false</span> th:text="${passwordsMismatch}">false</span>
<br /> <br />
<label for="confirm">Confirm password: </label> <label for="confirm">Confirm password: </label>
<br /> <br />
<input type="password" name="passwordConfirm" id="passwordConfirm" size="50%" /><br /> <input type="password" name="passwordConfirm" id="passwordConfirm" size="50%" /><br />
<span class="validationError" th:if="${#fields.hasErrors('displayname')}" <span class="validationError" th:if="${#fields.hasErrors('displayname')}"
th:errors="*{displayname}">Error</span> th:errors="*{displayname}">Error</span>
<br /> <br />
<label for="displayname">Displayed name: </label> <label for="displayname">Displayed name: </label>
<br /> <br />
<input type="text" name="displayname" id="displayname" size="50%" /><br /> <input type="text" name="displayname" id="displayname" size="50%" /><br />
<p> <p>
<button class="sign" type="submit">Register</button> <button class="sign" type="submit">Register</button>
</p> </p>
</form> </form>
</div>
</div> </div>
<div th:replace="~{fragments/footer :: 'footer'}"></div>
</body> </body>
</html> </html>

View file

@ -8,14 +8,17 @@
</head> </head>
<body> <body>
<div th:replace="~{fragments/header :: 'header'}"></div> <div class="page">
<div class="container base"> <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="/h2">H2</a> <br /><a href="/manage_users">/manage_users</a>
<br /><a href="/h2">H2</a>
</div>
</div> </div>
<div th:replace="~{fragments/footer :: 'footer'}"></div>
</body> </body>
</html> </html>

View file

@ -8,28 +8,31 @@
</head> </head>
<body> <body>
<div th:replace="~{fragments/header :: 'header'}"></div> <div class="page">
<div class="container base"> <div th:replace="~{fragments/header :: 'header'}"></div>
<h1 th:text="${header_text}">welcome</h1> <div class="container base">
<form method="POST" th:action="@{/profile/settings}" th:object="${userSettingsForm}"> <!-- --> <h1 th:text="${header_text}">welcome</h1>
<span class="validationError" th:if="${#fields.hasErrors('displayname')}" <form method="POST" th:action="@{/profile/settings}" th:object="${userSettingsForm}"> <!-- -->
th:errors="*{displayname}">Error</span> <span class="validationError" th:if="${#fields.hasErrors('displayname')}"
<br /> th:errors="*{displayname}">Error</span>
<label for="displayname">Displayed name: </label> <br />
<br /> <label for="displayname">Displayed name: </label>
<input type="text" name="displayname" id="displayname" th:value="${userSettingsForm.displayname}" <br />
size="50%" /><br /> <input type="text" name="displayname" id="displayname" th:value="${userSettingsForm.displayname}"
size="50%" /><br />
<span class="validationError" th:if="${password_incorrect} != null" <span class="validationError" th:if="${password_incorrect} != null"
th:text="${password_incorrect}">false</span> th:text="${password_incorrect}">false</span>
<br /> <br />
<label for="password">New password: </label> <label for="password">New password: </label>
<br /> <br />
<input type="password" name="newPassword" id="newPassword" size="50%" /><br /> <input type="password" name="newPassword" id="newPassword" size="50%" /><br />
<button class="sign" type="submit">Save Changes</button> <button class="sign" type="submit">Save Changes</button>
</form> </form>
</div>
</div> </div>
<div th:replace="~{fragments/footer :: 'footer'}"></div>
</body> </body>
</html> </html>