source: KernelRecordsMVC.Web/Views/Shared/_Layout.cshtml@ fa0fbaf

main
Last change on this file since fa0fbaf was fa0fbaf, checked in by mmilevski <markomilevski3@…>, 4 weeks ago

Added major improvements.
  • Property mode set to 100644
File size: 13.7 KB
Line 
1@using Microsoft.AspNetCore.Http
2
3<!DOCTYPE html>
4
5<html lang="en">
6<head>
7 <meta charset="utf-8" />
8 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
9
10
11<title>@ViewData["Title"] - Kernel Records</title>
12
13<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
14
15
16</head>
17
18<body>
19
20<header class="site-header">
21
22
23<!-- =====================================================
24 MAIN NAVBAR
25 ===================================================== -->
26
27<nav class="navbar">
28
29 <div class="navbar-container">
30
31 <!-- LOGO -->
32
33 <a class="brand"
34 asp-controller="Home"
35 asp-action="Index">
36
37 <span class="brand-main">
38 KERNEL
39 </span>
40
41 <span class="brand-sub">
42 RECORDS
43 </span>
44
45 </a>
46
47
48 <!-- MOBILE MENU BUTTON -->
49
50 <button class="mobile-menu-button"
51 type="button"
52 aria-label="Toggle navigation"
53 onclick="toggleMobileMenu()">
54
55 ☰
56
57 </button>
58
59
60 <!-- NAVBAR CONTENT -->
61
62 <div class="navbar-content"
63 id="navbarContent">
64
65
66 <!-- =================================================
67 MAIN NAVIGATION
68 ================================================= -->
69
70 <ul class="nav-links">
71
72 <!-- Browse -->
73
74 <li>
75
76 <a asp-controller="Release"
77 asp-action="Index">
78
79 Browse
80
81 </a>
82
83 </li>
84
85
86 <!-- Top Sellers -->
87
88 <li>
89
90 <a asp-controller="TopSellers"
91 asp-action="Index">
92
93 Top Sellers
94
95 </a>
96
97 </li>
98
99
100 <!-- Artists -->
101
102 <li>
103
104 <a asp-controller="Artist"
105 asp-action="Index">
106
107 Artists
108
109 </a>
110
111 </li>
112
113
114 <!-- Genres -->
115
116 <li class="nav-dropdown">
117
118 <a href="#"
119 class="dropdown-toggle">
120
121 Genres
122
123 <span class="arrow">
124 ⌄
125 </span>
126
127 </a>
128
129
130 <div class="dropdown-menu">
131
132 <a asp-controller="Release"
133 asp-action="Index"
134 asp-route-genre="Rock">
135
136 Rock
137
138 </a>
139
140 <a asp-controller="Release"
141 asp-action="Index"
142 asp-route-genre="Pop">
143
144 Pop
145
146 </a>
147
148 <a asp-controller="Release"
149 asp-action="Index"
150 asp-route-genre="Hip-Hop">
151
152 Hip-Hop
153
154 </a>
155
156 <a asp-controller="Release"
157 asp-action="Index"
158 asp-route-genre="Jazz">
159
160 Jazz
161
162 </a>
163
164 <a asp-controller="Release"
165 asp-action="Index"
166 asp-route-genre="Electronic">
167
168 Electronic
169
170 </a>
171
172 <a asp-controller="Release"
173 asp-action="Index">
174
175 All Genres
176
177 </a>
178
179 </div>
180
181 </li>
182
183
184 <!-- Sale -->
185
186 <li>
187
188 <a asp-controller="Sale"
189 asp-action="Index"
190 class="nav-sale">
191
192 Sale
193
194 </a>
195
196 </li>
197
198 </ul>
199
200
201 <!-- =================================================
202 SEARCH
203 ================================================= -->
204
205 <form class="navbar-search"
206 asp-controller="Release"
207 asp-action="Index"
208 method="get">
209
210 <input type="text"
211 name="search"
212 placeholder="Search releases..."
213 autocomplete="off" />
214
215 <button type="submit"
216 aria-label="Search">
217
218 <span>
219 ⌕
220 </span>
221
222 </button>
223
224 </form>
225
226
227 <!-- =================================================
228 RIGHT SIDE ACTIONS
229 ================================================= -->
230
231 <div class="navbar-actions">
232
233
234 <!-- =================================================
235 WISHLIST
236 ================================================= -->
237
238 <a class="nav-icon"
239 asp-controller="Wishlist"
240 asp-action="Index"
241 title="Wishlist">
242
243 <span class="icon">
244 ♡
245 </span>
246
247 <span class="icon-label">
248 Wishlist
249 </span>
250
251 </a>
252
253
254 <!-- =================================================
255 CART
256 ================================================= -->
257
258 <a class="nav-icon"
259 asp-controller="Order"
260 asp-action="Cart"
261 title="Shopping Cart">
262
263 <span class="icon cart-icon">
264 🛒
265 </span>
266
267 <span class="icon-label">
268 Cart
269 </span>
270
271 </a>
272
273
274 <!-- =================================================
275 ACCOUNT
276 ================================================= -->
277
278 @if (Context.Session.GetInt32("UserId") != null)
279 {
280
281 <!-- LOGGED IN -->
282
283 <div class="account-dropdown">
284
285
286 <button class="account-button"
287 type="button">
288
289 <span class="user-icon">
290 ●
291 </span>
292
293 <span class="account-name">
294
295 @Context.Session.GetString("Username")
296
297 </span>
298
299 <span class="arrow">
300 ⌄
301 </span>
302
303 </button>
304
305
306 <!-- ACCOUNT MENU -->
307
308 <div class="account-menu">
309
310
311 <!-- PROFILE -->
312
313 <a asp-controller="Account"
314 asp-action="Profile">
315
316 <span>
317 👤
318 </span>
319
320 My Profile
321
322 </a>
323
324
325 <!-- ORDERS -->
326
327 <a asp-controller="Order"
328 asp-action="Cart">
329
330 <span>
331 📦
332 </span>
333
334 My Orders
335
336 </a>
337
338
339 <!-- WISHLIST -->
340
341 <a asp-controller="Wishlist"
342 asp-action="Index">
343
344 <span>
345 ♡
346 </span>
347
348 My Wishlist
349
350 </a>
351
352
353 <!-- ADMIN -->
354
355 @if (Context.Session.GetString("Role") == "Admin")
356 {
357
358 <div class="menu-divider"></div>
359
360
361 <a asp-controller="Admin"
362 asp-action="Index"
363 class="admin-link">
364
365 <span>
366 ⚙
367 </span>
368
369 Admin Dashboard
370
371 </a>
372
373 }
374
375
376 <div class="menu-divider"></div>
377
378
379 <!-- LOGOUT -->
380
381 <form asp-controller="Account"
382 asp-action="Logout"
383 method="post">
384
385 @Html.AntiForgeryToken()
386
387 <button type="submit"
388 class="logout-button">
389
390 <span>↪</span>
391
392 Logout
393
394 </button>
395
396 </form>
397
398
399 </div>
400
401 </div>
402
403 }
404 else
405 {
406
407 <!-- =================================================
408 NOT LOGGED IN
409 ================================================= -->
410
411 <div class="auth-buttons">
412
413
414 <a asp-controller="Account"
415 asp-action="Login"
416 class="login-button">
417
418 Login
419
420 </a>
421
422
423 <a asp-controller="Account"
424 asp-action="Register"
425 class="register-button">
426
427 Register
428
429 </a>
430
431
432 </div>
433
434 }
435
436 </div>
437
438 </div>
439
440 </div>
441
442</nav>
443
444
445<!-- =====================================================
446 ANNOUNCEMENT BAR
447 ===================================================== -->
448
449<div class="announcement-bar">
450
451 <span>
452 FREE SHIPPING ON ORDERS OVER €50
453 </span>
454
455 <span class="announcement-separator">
456 •
457 </span>
458
459 <span>
460 NEW VINYL EVERY WEEK
461 </span>
462
463</div>
464
465
466</header>
467
468<!-- =========================================================
469 MAIN CONTENT
470 ========================================================= -->
471
472<main class="main-content">
473
474
475@RenderBody()
476
477
478</main>
479
480<!-- =========================================================
481 FOOTER
482 ========================================================= -->
483
484<footer class="site-footer">
485
486
487<div class="footer-container">
488
489
490 <!-- BRAND -->
491
492 <div class="footer-brand">
493
494 <div class="footer-logo">
495 KERNEL RECORDS
496 </div>
497
498 <p>
499 Your destination for vinyl, CDs and cassettes.
500 </p>
501
502 </div>
503
504
505 <!-- SHOP -->
506
507 <div class="footer-column">
508
509 <h4>
510 Shop
511 </h4>
512
513
514 <a asp-controller="Release"
515 asp-action="Index">
516
517 Releases
518
519 </a>
520
521
522 <a asp-controller="Release"
523 asp-action="Index">
524
525 New Releases
526
527 </a>
528
529
530 <a asp-controller="Artist"
531 asp-action="Index">
532
533 Artists
534
535 </a>
536
537 </div>
538
539
540 <!-- ACCOUNT -->
541
542 <div class="footer-column">
543
544 <h4>
545 Account
546 </h4>
547
548
549 @if (Context.Session.GetInt32("UserId") != null)
550 {
551
552 <a asp-controller="Account"
553 asp-action="Profile">
554
555 My Profile
556
557 </a>
558
559
560 <a asp-controller="Order"
561 asp-action="Cart">
562
563 My Orders
564
565 </a>
566
567
568 <a asp-controller="Wishlist"
569 asp-action="Index">
570
571 Wishlist
572
573 </a>
574
575 }
576 else
577 {
578
579 <a asp-controller="Account"
580 asp-action="Login">
581
582 Login
583
584 </a>
585
586
587 <a asp-controller="Account"
588 asp-action="Register">
589
590 Register
591
592 </a>
593
594 }
595
596 </div>
597
598
599 <!-- HELP -->
600
601 <div class="footer-column">
602
603 <h4>
604 Help
605 </h4>
606
607 <a href="#">
608 Shipping
609 </a>
610
611 <a href="#">
612 Returns
613 </a>
614
615 <a href="#">
616 Contact
617 </a>
618
619 </div>
620
621</div>
622
623
624<!-- FOOTER BOTTOM -->
625
626<div class="footer-bottom">
627
628 <span>
629 © @DateTime.Now.Year Kernel Records
630 </span>
631
632 <span>
633 All rights reserved.
634 </span>
635
636</div>
637
638
639</footer>
640
641<!-- =========================================================
642 MOBILE NAVIGATION SCRIPT
643 ========================================================= -->
644
645<script>
646
647 function toggleMobileMenu()
648 {
649 const menu =
650 document.getElementById("navbarContent");
651
652 menu.classList.toggle("mobile-open");
653 }
654
655
656 // Close mobile menu when clicking outside
657
658 document.addEventListener("click", function (event)
659 {
660 const menu =
661 document.getElementById("navbarContent");
662
663 const button =
664 document.querySelector(".mobile-menu-button");
665
666
667 if (!menu.contains(event.target) &&
668 !button.contains(event.target))
669 {
670 menu.classList.remove("mobile-open");
671 }
672
673 });
674
675</script>
676
677@await RenderSectionAsync(
678"Scripts",
679required: false)
680
681</body>
682</html>
Note: See TracBrowser for help on using the repository browser.