| 1 | <!DOCTYPE html>
|
|---|
| 2 | <html lang="en">
|
|---|
| 3 | <head>
|
|---|
| 4 | <meta charset="UTF-8">
|
|---|
| 5 | <title>TicketReservation</title>
|
|---|
| 6 | <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
|---|
| 7 | </head>
|
|---|
| 8 | <style>
|
|---|
| 9 |
|
|---|
| 10 | .team{
|
|---|
| 11 | margin-left: 450px;
|
|---|
| 12 | font-family: Montserrat;
|
|---|
| 13 | }
|
|---|
| 14 | p{
|
|---|
| 15 | padding-right: 100px;
|
|---|
| 16 | padding-left: 100px;
|
|---|
| 17 | margin-top: 60px;
|
|---|
| 18 | text-align: justify-all;
|
|---|
| 19 | font-family: Montserrat;
|
|---|
| 20 | }
|
|---|
| 21 | .photo{
|
|---|
| 22 | width:300px;
|
|---|
| 23 | height:60px;
|
|---|
| 24 | }
|
|---|
| 25 | .nv{
|
|---|
| 26 | background-color: rgba(240, 248, 255, .5);
|
|---|
| 27 | margin-top: 20px;
|
|---|
| 28 | }
|
|---|
| 29 | body {
|
|---|
| 30 | background-color: #a0a5e9;
|
|---|
| 31 | }
|
|---|
| 32 | .btn1{
|
|---|
| 33 | background-color: #a0a5e9;
|
|---|
| 34 | border-radius: 8px;
|
|---|
| 35 | border-style: none;
|
|---|
| 36 | box-sizing: border-box;
|
|---|
| 37 | color: #FFFFFF;
|
|---|
| 38 | cursor: pointer;
|
|---|
| 39 | display: inline-block;
|
|---|
| 40 | font-family: Montserrat;
|
|---|
| 41 | font-size: 14px;
|
|---|
| 42 | font-weight: bold;
|
|---|
| 43 | height: 40px;
|
|---|
| 44 | line-height: 20px;
|
|---|
| 45 | list-style: none;
|
|---|
| 46 | margin: 0;
|
|---|
| 47 | outline: none;
|
|---|
| 48 | padding: 10px 16px;
|
|---|
| 49 | position: relative;
|
|---|
| 50 | text-align: center;
|
|---|
| 51 | text-decoration: none;
|
|---|
| 52 | transition: color 100ms;
|
|---|
| 53 | vertical-align: baseline;
|
|---|
| 54 | user-select: none;
|
|---|
| 55 | -webkit-user-select: none;
|
|---|
| 56 | touch-action: manipulation;
|
|---|
| 57 | }
|
|---|
| 58 |
|
|---|
| 59 | .btn1:hover,
|
|---|
| 60 | .btn1:focus {
|
|---|
| 61 | background-color: cornflowerblue;
|
|---|
| 62 | }
|
|---|
| 63 |
|
|---|
| 64 | .btn0{
|
|---|
| 65 | border-radius: 8px;
|
|---|
| 66 | border-style: none;
|
|---|
| 67 | box-sizing: border-box;
|
|---|
| 68 | color: #FFFFFF;
|
|---|
| 69 | cursor: pointer;
|
|---|
| 70 | display: inline-block;
|
|---|
| 71 | font-family: Montserrat;
|
|---|
| 72 | font-size: 14px;
|
|---|
| 73 | font-weight: bold;
|
|---|
| 74 | height: 40px;
|
|---|
| 75 | line-height: 20px;
|
|---|
| 76 | list-style: none;
|
|---|
| 77 | margin: 0;
|
|---|
| 78 | outline: none;
|
|---|
| 79 | padding: 10px 16px;
|
|---|
| 80 | position: relative;
|
|---|
| 81 | text-align: center;
|
|---|
| 82 | text-decoration: none;
|
|---|
| 83 | transition: color 100ms;
|
|---|
| 84 | vertical-align: baseline;
|
|---|
| 85 | user-select: none;
|
|---|
| 86 | -webkit-user-select: none;
|
|---|
| 87 | touch-action: manipulation;
|
|---|
| 88 | }
|
|---|
| 89 |
|
|---|
| 90 | .btn0:hover,
|
|---|
| 91 | .btn0:focus {
|
|---|
| 92 | background-color: darkslateblue;
|
|---|
| 93 | }
|
|---|
| 94 |
|
|---|
| 95 | h1,h3{
|
|---|
| 96 | text-align: center;
|
|---|
| 97 | font-family: Montserrat;
|
|---|
| 98 | }
|
|---|
| 99 | h1{
|
|---|
| 100 | padding-top: 25px;
|
|---|
| 101 | }
|
|---|
| 102 | .search{
|
|---|
| 103 | padding-right: 20px;
|
|---|
| 104 | border-radius: 8px;
|
|---|
| 105 | border-style: none;
|
|---|
| 106 | box-sizing: border-box;
|
|---|
| 107 | color: #FFFFFF;
|
|---|
| 108 | cursor: pointer;
|
|---|
| 109 | display: inline-block;
|
|---|
| 110 | font-weight: bold;
|
|---|
| 111 | font-family: Montserrat;
|
|---|
| 112 | }
|
|---|
| 113 | a {
|
|---|
| 114 | text-decoration: none;
|
|---|
| 115 | font-weight: bold;
|
|---|
| 116 | }
|
|---|
| 117 | </style>
|
|---|
| 118 | <body>
|
|---|
| 119 | <nav class="navbar navbar-expand-lg nv">
|
|---|
| 120 | <div class="container">
|
|---|
| 121 | <a class="navbar-brand" href="#"><img src="../../images/logo.png" class="photo" alt="logo"></a>
|
|---|
| 122 | <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
|---|
| 123 | <span class="navbar-toggler-icon"><i class="fa-solid fa-bars"></i></span>
|
|---|
| 124 | </button>
|
|---|
| 125 | <div class="collapse navbar-collapse" id="navbarSupportedContent">
|
|---|
| 126 | <ul class="navbar-nav m-auto mb-2 mb-lg-0">
|
|---|
| 127 | <li class="nav-item">
|
|---|
| 128 | <a class="nav-link" href="/home">Home</a>
|
|---|
| 129 | </li>
|
|---|
| 130 | <li class="nav-item">
|
|---|
| 131 | <a class="nav-link" href="/events">Events</a>
|
|---|
| 132 | </li>
|
|---|
| 133 | </ul>
|
|---|
| 134 | <form class="search" action="/search" method="get">
|
|---|
| 135 | <input type="text" id="search" name="q" style="border-radius: 4px; border-style: none">
|
|---|
| 136 | <button type="submit" style="border-radius: 4px; border-style: none;
|
|---|
| 137 | font-weight: normal; font-family: Montserrat; font-size: medium">Search</button>
|
|---|
| 138 | </form>
|
|---|
| 139 | <form class="d-flex">
|
|---|
| 140 | <th:block th:if="${session.user == null}">
|
|---|
| 141 | <button class="btn0" >
|
|---|
| 142 | <a type="button" href="/registerUser" style="color: black">Register</a>
|
|---|
| 143 | </button>
|
|---|
| 144 | </th:block>
|
|---|
| 145 | <th:block th:if="${session.user == null}">
|
|---|
| 146 | <button class="btn1" >
|
|---|
| 147 | <a type="button" href="/userLogin" style="color: darkblue">Login</a>
|
|---|
| 148 | </button>
|
|---|
| 149 | </th:block>
|
|---|
| 150 | <th:block th:if="${session.user != null}">
|
|---|
| 151 | <button class="btn1" >
|
|---|
| 152 | <a type="button" href="/userLogout" style="color: darkblue">Logout</a>
|
|---|
| 153 | </button>
|
|---|
| 154 | </th:block>
|
|---|
| 155 | <th:block th:if="${session.user != null}">
|
|---|
| 156 | <button class="btn0" href="#">
|
|---|
| 157 | <th:block th:if="${session.user != null}"
|
|---|
| 158 | th:text="${session.user.getUsername()}"></th:block>
|
|---|
| 159 | </button>
|
|---|
| 160 | </th:block>
|
|---|
| 161 |
|
|---|
| 162 | </form>
|
|---|
| 163 | </div>
|
|---|
| 164 | </div>
|
|---|
| 165 | </nav>
|
|---|
| 166 | <div>
|
|---|
| 167 | <h1>About</h1>
|
|---|
| 168 | <h3>Welcome to our web app, your one-stop solution for promoting and reserving tickets for cultural events!
|
|---|
| 169 | </h3>
|
|---|
| 170 | <p>
|
|---|
| 171 | We understand the importance of culture and art in our lives, and our aim is to make it easier for you to experience and enjoy them. Whether you're a theater buff, a music lover, or a dance enthusiast, our app provides you with the opportunity to discover and book tickets to your favorite events, all in one place.
|
|---|
| 172 | <br>
|
|---|
| 173 |
|
|---|
| 174 | Our platform is designed to offer a seamless experience, with a user-friendly interface that allows you to search for events by category, date, location, and genre. You can also browse through our curated selection of featured events and recommended shows.
|
|---|
| 175 | <br>
|
|---|
| 176 |
|
|---|
| 177 | Once you've found an event that you're interested in, booking tickets is easy. Simply select the number of tickets you need, choose your preferred seats, and complete the checkout process. Our secure payment gateway ensures that your personal and financial information is safe and protected.
|
|---|
| 178 | <br>
|
|---|
| 179 |
|
|---|
| 180 | In addition to providing a convenient booking experience, our app also helps event organizers promote their events to a wider audience. By partnering with us, organizers can showcase their events to a targeted audience of culture enthusiasts, thereby increasing their visibility and ticket sales.
|
|---|
| 181 | <br>
|
|---|
| 182 |
|
|---|
| 183 | So whether you're a culture lover looking for the next big event, or an organizer hoping to promote your cultural event, our web app has got you covered. Join us now and experience the joy of culture and art!
|
|---|
| 184 |
|
|---|
| 185 |
|
|---|
| 186 |
|
|---|
| 187 |
|
|---|
| 188 | </p>
|
|---|
| 189 | </div>
|
|---|
| 190 | <br>
|
|---|
| 191 | <div class="team">
|
|---|
| 192 | <h4>MEET THE TEAM</h4>
|
|---|
| 193 |
|
|---|
| 194 | <ul>
|
|---|
| 195 | <li class="items">Anastasija Cvetkovska</li><img>
|
|---|
| 196 | <li class="items">Viktor Nikolikj</li>
|
|---|
| 197 | </ul>
|
|---|
| 198 | </div>
|
|---|
| 199 |
|
|---|
| 200 | </body>
|
|---|
| 201 | </html> |
|---|
