source: src/main/resources/templates/registerWaiter.html@ a51a591

Last change on this file since a51a591 was a51a591, checked in by colovik <j.colovik@…>, 14 months ago

final
  • Property mode set to 100644
File size: 9.3 KB
Line 
1<!DOCTYPE html>
2<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
3<head>
4 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
5 <style>
6 .navbar {
7 background: darkkhaki;
8 }
9
10 span {
11 color: #b2d7ff;
12 text-decoration: none;
13 background: transparent;
14 }
15
16 ul {
17 text-align: justify;
18 margin-left: 50px;
19 margin-right: 50px;
20
21 }
22
23 body {
24 background-image: url("https://images.unsplash.com/photo-1511795409834-ef04bbd61622?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=869&q=80");
25 background-size: 100%;
26 background-repeat: no-repeat;
27 background-position: center top -150px; /* Adjust the background position to move the image up */
28 }
29
30 .navbar-brand {
31 color: #343a40;
32 font-weight: bold;
33 }
34
35 .nav-link {
36 color: #343a40;
37 font-weight: bold;
38
39 }
40
41 footer {
42 position: fixed;
43 bottom: 0;
44 left: 0;
45 right: 0;
46 background: #111;
47 height: auto;
48 width: 100vw;
49 padding-top: 40px;
50 color: #fff;
51 }
52
53 .footer-content {
54 display: flex;
55 align-items: center;
56 justify-content: center;
57 flex-direction: column;
58 text-align: center;
59 height: 80px;
60 }
61
62 .footer-content h3 {
63 font-size: 2.1rem;
64 font-weight: 500;
65 text-transform: capitalize;
66 line-height: 3rem;
67 margin-top: 20px;
68 }
69
70 .footer-content p {
71 max-width: 500px;
72 margin: 10px auto;
73 line-height: 28px;
74 font-size: 14px;
75 color: #cacdd2;
76 }
77
78 .socials {
79 list-style: none;
80 display: flex;
81 align-items: center;
82 justify-content: center;
83 margin: 1rem 0 3rem 0;
84 }
85
86 .socials li {
87 margin: 0 10px;
88 }
89
90 .socials a {
91 text-decoration: none;
92 color: #fff;
93 border: 1.1px solid white;
94 padding: 5px;
95 border-radius: 50%;
96 }
97
98 .socials a i {
99 font-size: 1.1rem;
100 width: 20px;
101 transition: color .4s ease;
102 }
103
104 .socials a:hover i {
105 color: aqua;
106 }
107
108 .footer-bottom p {
109 float: left;
110 font-size: 14px;
111 word-spacing: 2px;
112 text-transform: capitalize;
113 }
114
115 .footer-bottom p a {
116 color: #44bae8;
117 font-size: 16px;
118 text-decoration: none;
119 }
120
121 .footer-bottom span {
122 text-transform: uppercase;
123 opacity: .4;
124 font-weight: 200;
125 }
126
127 .footer-menu ul {
128 display: flex;
129 }
130
131 .footer-menu ul li {
132 padding-right: 10px;
133 display: block;
134 }
135
136 .footer-menu ul li a {
137 color: #cfd2d6;
138 text-decoration: none;
139 }
140
141 .footer-menu ul li a:hover {
142 color: #27bcda;
143 }
144
145 @media (max-width: 500px) {
146 .footer-menu ul {
147 display: flex;
148 margin-top: 10px;
149 margin-bottom: 20px;
150 }
151 }
152
153 .kopce {
154 background-color: mediumslateblue;
155 border: none;
156 color: white;
157 padding: 15px 32px;
158 text-align: center;
159 text-decoration: none;
160 display: inline-block;
161 font-size: 16px;
162 margin-left: 20px;
163 }
164
165 /*#logo{*/
166 /* width:160px;*/
167 /* height: 60px*/
168 /*}*/
169 h1 {
170 color: white;
171 font-size: 60px;
172 font-weight: 500;
173 /*letter-spacing: 8px;*/
174 margin-bottom: 20px;
175 margin-left: 20px;
176 margin-right: auto;
177 margin-top: 50px;
178 position: relative;
179 }
180
181 @keyframes text {
182 0% {
183 color: black;
184 margin-bottom: -40px;
185 }
186 30% {
187 letter-spacing: 25px;
188 margin-bottom: -40px;
189 }
190 85% {
191 letter-spacing: 8px;
192 margin-bottom: -40px;
193 }
194 }
195
196 footer {
197 width: 100%;
198 padding: 20px;
199 box-sizing: border-box;
200 }
201
202 form-signin mt-xl-5{
203 margin-left: 40px;
204 }
205 </style>
206 <meta name="viewport" content="width=device-width, initial-scale=1">
207 <meta charset="UTF-8"/>
208 <title>Sign Up</title>
209 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
210 integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
211 <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
212 integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
213 crossorigin="anonymous"></script>
214 <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
215 integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
216 crossorigin="anonymous"></script>
217 <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
218 integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
219 crossorigin="anonymous"></script>
220</head>
221<body>
222<div>
223 <nav class="navbar navbar-expand-md ">
224 <div class="container">
225 <!-- <img class="u-image u-image-default u-image-1" src="../static/logoeventra.png" alt="" data-image-width="648" data-image-height="292">-->
226 <!-- <a class="navbar-brand" href="/home"></a>-->
227 <a class="navbar-brand"> Eventrra</a>
228 <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault"
229 aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
230 <span class="navbar-toggler-icon"></span>
231 </button>
232
233 <div class="collapse navbar-collapse justify-content-end" id="navbarsExampleDefault">
234 <ul class="navbar-nav m-auto">
235
236 <li th:if="${session.user!=null}" class="nav-item m-auto">
237 <a class="nav-link active" href="/">Home</a>
238 </li>
239
240 <li th:if="${session.user!=null and session.role == 'ROLE_CLIENT'}"
241 class="nav-item m-auto">
242 <a class="kopce" href="/host_event">Host an event</a>
243 </li>
244 <li th:if="${session.user!=null}" class="nav-item m-auto">
245 <a class="nav-link active" href="/my_events">Scheduled events</a>
246 </li>
247 </ul>
248
249 <form class="form-inline my-2 my-lg-0">
250
251 <div th:if="${session.user==null}">
252 <a class="btn btn-light btn-sm ml-3" href="/login">
253 Login
254 </a>
255
256 <a class="btn btn-light btn-sm ml-3" href="/register">
257 Sign up
258 </a>
259 </div>
260 <div style="text-align: center" th:if="${session.user!=null}" class="nav-item m-auto">
261 <a th:text="${session.user.username}" style="color:white; font-size: 20px;"
262 class="nav-link active" href="/login/profile"></a>
263 </div>
264
265 <div th:if="${session.user!=null}">
266 <a class="btn btn-light btn-sm ml-3" href="/logout">
267 Log out
268 </a>
269 </div>
270 </form>
271 </div>
272 </div>
273 </nav>
274</div>
275 <div>
276 <h1 class="mt-3 mb-3">Insert data</h1>
277 <form class="form-signin mt-xl-5" method="post" action="/finishRegisterWaiter">
278 <label for="free_day">Insert a number for the free day of the week (from 1 to 7)</label>
279 <input type="number" name="free_day" id="free_day" placeholder="Insert number" th:value="${free_day}">
280 <br>
281 <label for="experience">Ages of experience</label>
282 <input type="number" name="experience" id="experience" placeholder="Insert number" th:value="${experience}">
283 <br>
284 <label for="catering_name">Catering Firm - Employer</label>
285 <select class="form-control" name="catering_name" id="catering_name" required>
286 <option th:each="cat : ${caterings}"
287 th:text="${cat.getName()}"
288 th:value="${cat.getName()}">
289 </option>
290 </select>
291 <br>
292 <button type="submit" class="btn btn-primary btn-lg btn-block">Finish</button>
293 </form>
294 </div>
295</body>
296</html>
Note: See TracBrowser for help on using the repository browser.