source: source/freeparkingspace/src/main/resources/templates/employee.html

Last change on this file was 31d67c0, checked in by zlatko2810 <zlatko.stojanovski@…>, 2 years ago

proekt

  • Property mode set to 100644
File size: 10.0 KB
RevLine 
[31d67c0]1<!DOCTYPE html>
2<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
3<head>
4 <base href="${pageContext.request.contextPath}">
5 <meta charset="utf-8">
6 <meta http-equiv="X-UA-Compatible" content="IE=edge">
7 <title>Одобрување</title>
8 <meta name="description" content="">
9 <meta name="viewport" content="width=device-width, initial-scale=1">
10 <link rel="stylesheet" type="text/css" th:href="@{../css/styleMovies.css}"/>
11
12 <style>
13 @import url('https://fonts.googleapis.com/css?family=Montserrat:500');
14 @import url('https://fonts.googleapis.com/css2?family=Crete+Round&family=Roboto:ital,wght@0,900;1,900&display=swap');
15
16 :root {
17 --shadow-color: #FF9E9E;
18 --shadow-color-light: white;
19 }
20
21 .navbar {
22 max-width: 100%;
23 height: 100%;
24 background: rgba(0,0,0,0.25);
25 }
26
27 header {
28 display: flex;
29 justify-content: center;
30 align-items: center;
31 padding: 30px 10%;
32 max-width: 100%;
33 height: 10%;
34 background-color: rgb(0, 0, 0, 0.25);
35 border: none;
36 }
37
38 table{
39 color: white;
40 font-size: 2.2rem;
41 background: rgba(0,0,0,0.50);
42 }
43 th, td{
44 padding: 30px;
45 }
46
47 img {
48 width: 120px;
49 height: 120px;
50 }
51 html{
52 text-align: center;
53 }
54 body {
55 padding: 0;
56 margin: 0;
57 max-width: 100%;
58 background-image: url('../images/background3.jpg');
59 object-fit: cover;
60 height: 100vh;
61 background-size: cover;
62 background-repeat: no-repeat;
63 text-align: center;
64 }
65
66
67 li,
68 a:not(.btn) {
69 font-family: "Montserrat", sans-serif;
70 font-weight: 500;
71 font-size: 1.2rem;
72 text-decoration: none;
73 color: white;
74 padding: 10%;
75 list-style: none;
76 }
77
78 h1{
79 font-family: 'Roboto', sans-serif;
80 font-width: 900;
81 font-size: 4rem;
82
83 }
84
85 .right {
86 display: flex;
87 align-items: center;
88 justify-content: center;
89 background-color: rgb(0, 225, 255, 0.05);
90 border-radius: 10%;
91 flex-direction: row;
92 margin-left: 25%;
93 width: 17%;
94 height: 2%;
95 }
96
97 .right a {
98 margin: -5px;
99 }
100 .navbar{
101 max-width: 100%;
102 height: 100vh;
103 }
104
105 .reg {
106 color: rgb(255, 0, 0);
107 }
108
109 ul {
110 display: flex;
111 flex-direction: row;
112 }
113
114 li,
115 a:hover {
116 color: red;
117 font-size: 1.3rem;
118 }
119
120 .reg:hover {
121 color: white;
122 }
123 .container-main{
124 display: flex;
125 flex-direction: column;
126 align-items: center;
127 justify-content: center;
128 width: 100%;
129 height: 100%;
130 font-size: 3rem;
131 margin-left: 45%;
132 }
133 P{
134 font-family: "Montserrat", sans-serif;
135 font-weight: 500;
136 font-size: 4rem;
137 text-decoration: none;
138 color: white;
139 width: 80%;
140 list-style: none;
141 margin-top: -2%;
142 }
143
144 .glow{
145 text-transform: uppercase;
146 height: auto;
147 text-align: center;
148 }
149
150 .glow {
151 color: white;
152 animation: neon 3s infinite;
153 }
154
155 .h1Combined{
156 display: flex;
157 flex-direction: row;
158 align-items: center;
159 justify-content: center;
160 max-width: 100%;
161 }
162
163 @keyframes neon {
164 0% {
165 text-shadow: -1px -1px 1px var(--shadow-color-light), -1px 1px 1px var(--shadow-color-light), 1px -1px 1px var(--shadow-color-light), 1px 1px 1px var(--shadow-color-light),
166 0 0 3px var(--shadow-color-light), 0 0 10px var(--shadow-color-light), 0 0 20px var(--shadow-color-light),
167 0 0 30px var(--shadow-color), 0 0 40px var(--shadow-color), 0 0 50px var(--shadow-color), 0 0 70px var(--shadow-color), 0 0 100px var(--shadow-color), 0 0 200px var(--shadow-color);
168 }
169 50% {
170 text-shadow: -1px -1px 1px var(--shadow-color-light), -1px 1px 1px var(--shadow-color-light), 1px -1px 1px var(--shadow-color-light), 1px 1px 1px var(--shadow-color-light),
171 0 0 5px var(--shadow-color-light), 0 0 15px var(--shadow-color-light), 0 0 25px var(--shadow-color-light),
172 0 0 40px var(--shadow-color), 0 0 50px var(--shadow-color), 0 0 60px var(--shadow-color), 0 0 80px var(--shadow-color), 0 0 110px var(--shadow-color), 0 0 210px var(--shadow-color);
173 }
174 100% {
175 text-shadow: -1px -1px 1px var(--shadow-color-light), -1px 1px 1px var(--shadow-color-light), 1px -1px 1px var(--shadow-color-light), 1px 1px 1px var(--shadow-color-light),
176 0 0 3px var(--shadow-color-light), 0 0 10px var(--shadow-color-light), 0 0 20px var(--shadow-color-light),
177 0 0 30px var(--shadow-color), 0 0 40px var(--shadow-color), 0 0 50px var(--shadow-color), 0 0 70px var(--shadow-color), 0 0 100px var(--shadow-color), 0 0 200px var(--shadow-color);
178 }
179 }
180
181 .btn{
182 text-shadow: -1px -1px 10px rgba(255,255,255,0.5);
183 border: 1px solid #b70000;
184 color: white;
185 font-size: 2rem;
186 border:none;
187 background: #af0101;
188 padding: 0.5rem 1.3rem;
189 border-radius: 10%;
190 cursor: pointer;
191 transition: 1s ease;
192 display:block;
193 box-shadow: 3px 2px 10px #d50101,
194 -1px -1px 1px #e60000;
195 font-family: 'Roboto', sans-serif;
196 font-weight: 500;
197 text-decoration: none;
198 transition: infinite 1s ease;
199 }
200 input{
201 font-size: 1.5rem;
202 }
203
204 .btn:hover{
205 background-color: #58ACFA;
206 color: white;
207 }
208
209 .btn2{
210 text-shadow: -1px -1px 10px rgba(255,255,255,0.5);
211 border: 1px solid #b70000;
212 color: white;
213 font-size: 1.5rem;
214 border:none;
215 background: #af0101;
216 padding: 0.5rem 1.3rem;
217 border-radius: 10%;
218 cursor: pointer;
219 transition: 1s ease;
220 display:block;
221 box-shadow: 3px 2px 10px #d50101,
222 -1px -1px 1px #e60000;
223 font-family: 'Roboto', sans-serif;
224 font-weight: 500;
225 text-decoration: none;
226 transition: infinite 1s ease;
227 }
228
229 .btn2:hover{
230 background-color: #58ACFA;
231 color: white;
232 }
233
234
235 </style>
236</head>
237
238<body>
239<div class="navbar">
240 <!-- <header th:replace="fragments/header.html" >-->
241 <!--&lt;!&ndash; <a href="/home"><img class="logo" th:src="@{../images/LOGOPNG2.png}" alt="logo"></a>&ndash;&gt;-->
242 <!--&lt;!&ndash; <ul class="nav_links">&ndash;&gt;-->
243 <!--&lt;!&ndash; <li><a href="/movies">MOVIES</a></li>&ndash;&gt;-->
244 <!--&lt;!&ndash; <li><a href="/projections">PROJECTIONS</a></li>&ndash;&gt;-->
245 <!--&lt;!&ndash; <li><a href="/auditoriums">AUDITORIUMS</a></li>&ndash;&gt;-->
246
247 <!--&lt;!&ndash; </ul>&ndash;&gt;-->
248
249 <!--&lt;!&ndash; <div class="right">&ndash;&gt;-->
250 <!--&lt;!&ndash; <li><a class="reg" href="/login">LOGIN</a></li>&ndash;&gt;-->
251 <!--&lt;!&ndash; <li><a class="log" style="color: red" href="/register">REGISTER</a></li>&ndash;&gt;-->
252 <!--&lt;!&ndash; </div>&ndash;&gt;-->
253 <!-- </header>-->
254 <main>
255 <div class="container-main">
256 <div class="h1Combined">
257 <h1 style="color:white">FreeParking <h1 style="color:red">Space</h1></h1>
258 </div>
259 <div class="content">
260 <!-- Page content -->
261 <div class="header-one">
262 </div>
263 <div class="centered">
264 <table>
265 <thead style="border-bottom: 1px solid rgba(255, 51, 51,0.8)">
266 <tr>
267 <td style="border-right: 1px solid rgba(255, 51, 51,0.8);font-size:2rem">Име</td>
268 <td style="border-right: 1px solid rgba(255, 51, 51,0.8);font-size:2rem">Презиме</td>
269 <td style="border-right: 1px solid rgba(255, 51, 51,0.8);font-size:2rem">Улога</td>
270 <td></td>
271 </tr>
272 </thead>
273 <tbody>
274 <tr th:each="vraboten : ${employee}">
275 <td th:text="${vraboten.getVrabotenKey().getUser().getIme()}"/>
276 <td th:text="${vraboten.getVrabotenKey().getUser().getPrezime()}"/>
277 <td th:text="${vraboten.getUloga()}"/>
278 <td>
279 <!-- EmployeeController.delete (Only MASTER can see this element)-->
280 <form th:action="@{'/employee/{id}/delete' (id=${vraboten.getVrabotenKey().getUser().getKorisnickoIme()})}" th:method="POST">
281 <button type="submit" class="btn">Одбиј</button>
282 </form>
283 </td>
284 </tr>
285 </tbody>
286 </table>
287 </div>
288 </div>
289 <!--<a class="btn" href="/projections">Projections</a>-->
290 </div>
291 </main>
292 <!--<footer th:replace="fragments/footer"/>-->
293</div>
294</body>
Note: See TracBrowser for help on using the repository browser.