1 | <!DOCTYPE html>
|
---|
2 | <html lang="en">
|
---|
3 | <head>
|
---|
4 | <meta charset="UTF-8">
|
---|
5 | <title>Title</title>
|
---|
6 |
|
---|
7 | <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"></script>
|
---|
8 | <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
---|
9 | <title>Register</title>
|
---|
10 | <style>
|
---|
11 | body{
|
---|
12 | background-color: #acbccb;
|
---|
13 | }
|
---|
14 | .photo{
|
---|
15 | width:300px;
|
---|
16 | height:60px;
|
---|
17 | }
|
---|
18 | .nv{
|
---|
19 |
|
---|
20 | background-color: rgba(240, 248, 255, .5);
|
---|
21 | margin-top: 20px;
|
---|
22 | }
|
---|
23 | .Form{
|
---|
24 | float: left;
|
---|
25 | width: 900px;
|
---|
26 | margin-top: -90px;
|
---|
27 | font-family: Montserrat;
|
---|
28 | }
|
---|
29 | .img2{
|
---|
30 | float: right;
|
---|
31 | width: 200px;
|
---|
32 | position: fixed;
|
---|
33 | margin-left: 700px;
|
---|
34 |
|
---|
35 | padding-bottom: 50px;
|
---|
36 | padding-right: 50px;
|
---|
37 | height: 400px;
|
---|
38 | }
|
---|
39 | .img3{
|
---|
40 | padding-top: 70px;
|
---|
41 | padding-right: 10px;
|
---|
42 | width: 700px;
|
---|
43 | }
|
---|
44 | .dod1{
|
---|
45 | margin-top: 100px;
|
---|
46 | padding-left: 60px;
|
---|
47 | font-weight: bold;
|
---|
48 | }
|
---|
49 | a {
|
---|
50 | text-decoration: none;
|
---|
51 | }
|
---|
52 |
|
---|
53 | .btn0{
|
---|
54 | background-color: steelblue;
|
---|
55 | border-radius: 8px;
|
---|
56 | border-style: none;
|
---|
57 | box-sizing: border-box;
|
---|
58 | color: #FFFFFF;
|
---|
59 | cursor: pointer;
|
---|
60 | display: inline-block;
|
---|
61 | font-family: Montserrat;
|
---|
62 | font-size: 14px;
|
---|
63 | font-weight: bold;
|
---|
64 | height: 40px;
|
---|
65 | line-height: 20px;
|
---|
66 | list-style: none;
|
---|
67 | margin: 0;
|
---|
68 | outline: none;
|
---|
69 | padding: 10px 16px;
|
---|
70 | position: relative;
|
---|
71 | text-align: center;
|
---|
72 | text-decoration: none;
|
---|
73 | transition: color 100ms;
|
---|
74 | vertical-align: baseline;
|
---|
75 | user-select: none;
|
---|
76 | -webkit-user-select: none;
|
---|
77 | touch-action: manipulation;
|
---|
78 | }
|
---|
79 |
|
---|
80 | .btn0:hover,
|
---|
81 | .btn0:focus {
|
---|
82 | background-color: lightsteelblue;
|
---|
83 |
|
---|
84 | }
|
---|
85 | </style>
|
---|
86 | </head>
|
---|
87 | <body>
|
---|
88 | <nav class="navbar navbar-expand-lg nv">
|
---|
89 | <div class="container">
|
---|
90 | <a class="navbar-brand" href="#"><img src="../../images/logo.png" class="photo" alt="logo"></a>
|
---|
91 | <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
---|
92 | <span class="navbar-toggler-icon"><i class="fa-solid fa-bars"></i></span>
|
---|
93 | </button>
|
---|
94 | <div class="collapse navbar-collapse" id="navbarSupportedContent">
|
---|
95 | <ul class="navbar-nav m-auto mb-2 mb-lg-0">
|
---|
96 | <li class="nav-item">
|
---|
97 | <a class="nav-link" href="/home"><b>Home</b></a>
|
---|
98 | </li>
|
---|
99 | <li class="nav-item">
|
---|
100 | <a class="nav-link" href="/events"><b>Events</b></a>
|
---|
101 | </li>
|
---|
102 | <li class="nav-item">
|
---|
103 | <a class="nav-link" href="/about"><b>About</b></a>
|
---|
104 | </li>
|
---|
105 | </ul>
|
---|
106 | </div>
|
---|
107 | </div>
|
---|
108 | </nav>
|
---|
109 | <div>
|
---|
110 | <section class="Form py-5">
|
---|
111 | <div class="container py-5">
|
---|
112 | <div class="row g-0">
|
---|
113 | <div class="col-lg-3">
|
---|
114 | </div>
|
---|
115 |
|
---|
116 | <div class="col-lg-6 px-5 pt-5 text-center">
|
---|
117 | <h4>Креирајте го вашиот профил</h4>
|
---|
118 |
|
---|
119 | <form method="post" action="/registerUser">
|
---|
120 | <div class="form-row">
|
---|
121 | <div class="col-lg-12">
|
---|
122 | <label for="name">Име</label>
|
---|
123 | <input type="text" required class="form-control my-3 p-4" placeholder="Име" id="name" name="name">
|
---|
124 | </div>
|
---|
125 | </div>
|
---|
126 |
|
---|
127 | <div class="form-row">
|
---|
128 | <div class="col-lg-12">
|
---|
129 | <label for="surname">Презиме</label>
|
---|
130 | <input type="text" required class="form-control my-3 p-4" placeholder="Презиме" id="surname" name="surname">
|
---|
131 | </div>
|
---|
132 | </div>
|
---|
133 |
|
---|
134 | <div class="form-row">
|
---|
135 | <div class="col-lg-12">
|
---|
136 | <label for="username">Корисничко име</label>
|
---|
137 | <input type="text" required class="form-control my-3 p-4" placeholder="Корисничко име" id="username" name="username">
|
---|
138 | </div>
|
---|
139 | </div>
|
---|
140 |
|
---|
141 | <div class="form-row">
|
---|
142 | <div class="col-lg-12">
|
---|
143 | <label for="email">Email</label>
|
---|
144 | <input type="email" required class="form-control my-3 p-4" placeholder="Email" id="email" name="email">
|
---|
145 | </div>
|
---|
146 | </div>
|
---|
147 |
|
---|
148 | <div class="form-row">
|
---|
149 | <div class="col-lg-12">
|
---|
150 | <label for="password">Лозинка</label>
|
---|
151 | <input type="password" required class="form-control my-3 p-4" placeholder="Лозинка" id="password" name="password">
|
---|
152 | </div>
|
---|
153 | </div>
|
---|
154 |
|
---|
155 | <div class="form-row">
|
---|
156 | <div class="col-lg-12">
|
---|
157 | <label for="phoneNumber">Телефонски број</label>
|
---|
158 | <input type="text" required class="form-control my-3 p-4" placeholder="Телефонски број" id="phoneNumber" name="phoneNumber">
|
---|
159 | </div>
|
---|
160 | </div>
|
---|
161 |
|
---|
162 | <div class="form-row">
|
---|
163 | <div class="col-lg-12">
|
---|
164 | <label>Тип на кориснки</label></br>
|
---|
165 | <input required class="form-check-input" name="userType" type="radio" id="customer" value="customer">
|
---|
166 | <label class="form-check-label" for="customer">Купувач</label></br>
|
---|
167 | <input required class="form-check-input" name="userType" type="radio" id="artist" value="artist">
|
---|
168 | <label class="form-check-label" for="artist">Уметник</label></br>
|
---|
169 | <input required class="form-check-input" name="userType" type="radio" id="organizer" value="organizer">
|
---|
170 | <label class="form-check-label" for="organizer">Ораганизатор</label>
|
---|
171 | </div>
|
---|
172 | </div>
|
---|
173 |
|
---|
174 | <div class="form-row">
|
---|
175 | <div class="col-lg-12">
|
---|
176 | <label for="transaction">Трансакциска сметка</label>
|
---|
177 | <input type="text" class="form-control my-3 p-4" placeholder="Како купувач, внесете трансакциска сметка" id="transaction" name="transaction">
|
---|
178 | </div>
|
---|
179 | </div>
|
---|
180 | <div class="form-row">
|
---|
181 | <div class="col-lg-12">
|
---|
182 | <label for="artistType">Тип на уметник</label>
|
---|
183 | <input type="text" class="form-control my-3 p-4" placeholder="Како уметник, внесете го типот" id="artistType" name="artistType">
|
---|
184 | </div>
|
---|
185 | </div>
|
---|
186 |
|
---|
187 |
|
---|
188 | <div class="form-row">
|
---|
189 | <div class="col-lg-12">
|
---|
190 | <button type="submit" class="btn0">Регистрирај се</button>
|
---|
191 | </div>
|
---|
192 | </div>
|
---|
193 |
|
---|
194 | <p>Веќе сте корисник?
|
---|
195 | <a href="/userLogin"> Најавете се тука</a>
|
---|
196 | </p>
|
---|
197 |
|
---|
198 | </form>
|
---|
199 | </div>
|
---|
200 | <div class="col-lg-3"></div>
|
---|
201 | </div>
|
---|
202 | </div>
|
---|
203 | </section>
|
---|
204 | <section class="img2">
|
---|
205 | <img class="img3" src="../../images/wave.jpg">
|
---|
206 | </section>
|
---|
207 | </div>
|
---|
208 | </body>
|
---|
209 | </html> |
---|