source: source/freeparkingspace/src/main/resources/templates/reservationInfo.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: 8.5 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 <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 <style>
11 @import url('https://fonts.googleapis.com/css?family=Montserrat:500');
12 @import url('https://fonts.googleapis.com/css2?family=Crete+Round&family=Roboto:ital,wght@0,900;1,900&display=swap');
13
14 :root {
15 --shadow-color: #FF9E9E;
16 --shadow-color-light: white;
17 }
18
19 .navbar {
20 max-width: 100%;
21 height: 100%;
22 background: rgba(0,0,0,0.25);
23 }
24
25 header {
26 display: flex;
27 justify-content: center;
28 align-items: center;
29 padding: 30px 10%;
30 max-width: 100%;
31 height: 10%;
32 background-color: rgb(0, 0, 0, 0.25);
33 border: none;
34 }
35
36 table{
37 color: white;
38 font-size: 0.3rem;
39 background: rgba(255,255,255,0.05);
40 }
41
42 img {
43 width: 120px;
44 height: 120px;
45 }
46 html{
47 text-align: center;
48 }
49 body {
50 padding: 0;
51 margin: 0;
52 max-width: 100%;
53 background-image: url('../images/background3.jpg');
54 object-fit: cover;
55 height: 100vh;
56 background-size: cover;
57 background-repeat: repeat;
58 text-align: center;
59 }
60
61
62 li,
63 a:not(.btn) {
64 font-family: "Montserrat", sans-serif;
65 font-weight: 500;
66 font-size: 1.2rem;
67 text-decoration: none;
68 color: white;
69 padding: 10%;
70 list-style: none;
71 }
72
73 h1{
74 font-family: 'Roboto', sans-serif;
75 font-width: 900;
76 font-size: 5rem;
77
78 }
79
80 .right {
81 display: flex;
82 align-items: center;
83 justify-content: center;
84 background-color: rgb(0, 225, 255, 0.05);
85 border-radius: 10%;
86 flex-direction: row;
87 margin-left: 25%;
88 width: 17%;
89 height: 2%;
90 }
91
92 .right a {
93 margin: -5px;
94 }
95 .navbar{
96 max-width: 100%;
97 height: 100vh;
98 }
99
100 .reg {
101 color: rgb(255, 0, 0);
102 }
103
104 ul {
105 display: flex;
106 flex-direction: row;
107 }
108
109
110
111 .reg:hover {
112 color: white;
113 }
114 .container-main{
115 display: flex;
116 flex-direction: column;
117 align-items: center;
118 justify-content: center;
119 width: 100%;
120 height: 100%;
121 margin-left: 40%;
122 margin-bottom: 20%;
123
124 }
125 P{
126 font-family: "Montserrat", sans-serif;
127 font-weight: 500;
128 font-size: 4rem;
129 text-decoration: none;
130 color: white;
131 width: 80%;
132 list-style: none;
133 margin-top: -2%;
134 }
135
136 .glow{
137 text-transform: uppercase;
138 height: auto;
139 text-align: center;
140 }
141
142 .glow {
143 color: white;
144 animation: neon 3s infinite;
145 }
146
147 .h1Combined{
148 display: flex;
149 flex-direction: row;
150 align-items: center;
151 justify-content: center;
152 max-width: 100%;
153 }
154
155 @keyframes neon {
156 0% {
157 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),
158 0 0 3px var(--shadow-color-light), 0 0 10px var(--shadow-color-light), 0 0 20px var(--shadow-color-light),
159 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);
160 }
161 50% {
162 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),
163 0 0 5px var(--shadow-color-light), 0 0 15px var(--shadow-color-light), 0 0 25px var(--shadow-color-light),
164 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);
165 }
166 100% {
167 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),
168 0 0 3px var(--shadow-color-light), 0 0 10px var(--shadow-color-light), 0 0 20px var(--shadow-color-light),
169 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);
170 }
171 }
172
173 .btn{
174 text-shadow: -1px -1px 10px rgba(255,255,255,0.5);
175 border: 1px solid #b70000;
176 color: white;
177 font-size: 3.2rem;
178 border:none;
179 background: #af0101;
180 padding: 0.5rem 1.3rem;
181 border-radius: 10%;
182 cursor: pointer;
183 transition: 1s ease;
184 display:block;
185 box-shadow: 3px 2px 10px #d50101,
186 -1px -1px 1px #e60000;
187 font-family: 'Roboto', sans-serif;
188 font-weight: 500;
189 text-decoration: none;
190 transition: infinite 1s ease;
191 }
192
193 .btn:hover{
194 background-color: #58ACFA;
195 color: white;
196 font-size: 3rem;
197 }
198
199 .btn2{
200 text-shadow: -1px -1px 10px rgba(255,255,255,0.5);
201 border: 1px solid #b70000;
202 color: white;
203 font-size: 1.5rem;
204 border:none;
205 background: #af0101;
206 padding: 0.5rem 1.3rem;
207 border-radius: 10%;
208 cursor: pointer;
209 transition: 1s ease;
210 display:block;
211 box-shadow: 3px 2px 10px #d50101,
212 -1px -1px 1px #e60000;
213 font-family: 'Roboto', sans-serif;
214 font-weight: 500;
215 text-decoration: none;
216 transition: infinite 1s ease;
217 }
218
219 .btn2:hover{
220 background-color: #58ACFA;
221 color: white;
222 }
223
224
225 </style>
226</head>
227
228<body>
229<div class="navbar">
230 <!-- <header th:replace="fragments/header.html">-->
231 <!-- </header>-->
232 <main>
233 <div class="container-main">
234 <div class="h1Combined" style="margin-bottom: 5%">
235 <h1 style="color:white">FreeParking <h1 style="color:red">Space</h1></h1>
236 </div>
237 <div class="parking">
238 <table style="font-size:3.0rem;">
239 <thead style="border-bottom: 1px solid rgba(255, 51, 51,0.8)">
240 <tr>
241 <td style="border-right: 1px solid rgba(255, 51, 51,0.8)">PARKING</td>
242 <td style="border-right: 1px solid rgba(255, 51, 51,0.8)">ZONA</td>
243 <td style="border-right: 1px solid rgba(255, 51, 51,0.8)">BROJ NA PARKING</td>
244 </tr>
245 </thead>
246 <tbody>
247 <tr th:each="parking_mesto : ${parking_mesto}">
248 <td th:text="${parking_mesto.getIdZona().getIdIme().getLokacija()} "/>
249 <td th:text="${parking_mesto.getIdZona().getIdZona()} "/>
250 <td th:text="${parking_mesto.getBrojNaPmesta()} "/>
251 <td class="text-right">
252 <form th:action="@{/reservation/parking-place/}">
253 <button class="btn btn-sm btn-danger view-product" type="submit" th:name="broj_na_pmesta" th:value="${parking_mesto.getBrojNaPmesta()}">RESERVE</button>
254 </form>
255 </td>
256 </tr>
257 </tbody>
258 </table>
259 </div>
260 </div>
261 </main>
262 <!--<footer th:replace="fragments/footer"/>-->
263</div>
264</body>
265</html>
Note: See TracBrowser for help on using the repository browser.