generated from DanteAlonsoHT/readme-template
-
Notifications
You must be signed in to change notification settings - Fork 2
/
tickets.html
153 lines (153 loc) · 8.86 KB
/
tickets.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Tickets Page</title>
<link rel="icon" href="img/compainesLogo.svg" type="image/svg+xml">
<!--Bootstrap CSS-->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous">
<link rel="stylesheet" href="css/style.css">
<!--Import Boxicons as a Font-->
<link href='https://unpkg.com/[email protected]/css/boxicons.min.css' rel='stylesheet'>
<link rel="preconnect" href="https://fonts.gstatic.com">
<!--Lato Google Font-->
<link href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400&display=swap" rel="stylesheet">
<!--Import Lato Font-->
<style>
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400&display=swap');
</style>
</head>
<body>
<!-- Navbar section STARTS -->
<header>
<div class="container-fluid first-navbar">
<nav class="d-none d-md-block navbar-light">
<div class="container-lg d-flex flex-row-reverse">
<a class="text-decoration-none ps-3" href="#">Logout</a>
<a class="text-decoration-none ps-3" href="#">My Page</a>
<a class="text-decoration-none ps-3" href="#">English</a>
<a class="text-decoration-none ps-3" href="#"><i class='bx bxl-twitter'></i></a>
<a class="text-decoration-none ps-3" href="#"><i class='bx bxl-facebook'></i></a>
</div>
</nav>
</div>
<nav class="navbar navbar-expand-md navbar-light second-navbar px-3 px-md-0">
<div class="container-md p-0">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarTogglerDemo03" aria-controls="navbarTogglerDemo03" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand" href="index.html"><img src="img/compainesLogo.svg" alt="companies-logo" height="86"></a>
<div class="collapse navbar-collapse" id="navbarTogglerDemo03">
<ul class="navbar-nav me-auto mb-2 mb-md-0 d-block d-md-flex justify-content-end w-100">
<li class="nav-item p-2">
<a class="nav-link" aria-current="page" href="index.html">Home</a>
</li>
<li class="nav-item ps-md-4 p-2">
<a class="nav-link" href="about.html">About</a>
</li>
<li class="nav-item ps-md-4 p-2">
<a class="nav-link" id="activeNowTickets" href="tickets.html">Tickets</a>
</li>
<li class="nav-item ps-md-4 p-2">
<a class="nav-link" href="#">Program</a>
</li>
<li class="nav-item ps-md-4 p-2">
<a class="nav-link" href="#">Sponsors</a>
</li>
<li class="nav-item m-0 ps-md-4">
<button class="Navbar-button" type="button">Enroll it</button>
</li>
</ul>
</div>
</div>
</nav>
</header>
<!-- Navbar section ENDS -->
<!-- Tickets section STARTS -->
<section id="tickets-section">
<div class="container-fluid ticket-page py-5">
<div class="container-md pt-5">
<form id="register-form" action="#" method="GET">
<div class="row">
<div class="col-12">
<article class="mt-5 pt-0 ticket-section">
<h1 class="mt-2 text-center title-tickets">Select Tickets</h1>
<div class="my-3 about-line"></div>
<p class="border border-light rounded-pill mt-3 p-2 text-center tickets-instructions"> <strong>FIRSTABLE:</strong> Select the day you want to start.</p>
<div class="ticket-grid my-5 text-center align-items-center">
<div class="div1">Ticket </div>
<div class="div2">3 Months-Ticket </div>
<div class="div3">3 Months + Curriculum-Ticket </div>
<div class="div4">CC Afilliate/Partners</div>
<div class="div5">Date STARTS</div>
<div class="div6">15. Oct (Thu)</div>
<div class="div7">24. Oct (Fri)</div>
<div class="div8">23-24. Oct (Thu-Fri)</div>
<div class="div9">23-24. Oct (Thu-Fri)</div>
<div class="div10">Normal</div>
<div class="div11 price-grid d-flex flex-column justify-content-center">USD 750
<input class="mx-auto my-3" type="radio" id="normal-750-date1" name="price-selected" value="usd750">
</div>
<div class="div12 price-grid d-flex flex-column justify-content-center">USD 750
<input class="mx-auto my-3" type="radio" id="normal-750-date2" name="price-selected" value="usd750">
</div>
<div class="div13 price-grid d-flex flex-column justify-content-center">USD 1250
<input class="mx-auto my-3" type="radio" id="normal-1250-date3" name="price-selected" value="usd1250">
</div>
<div class="div14 price-grid d-flex flex-column justify-content-center">USD 10
<input class="mx-auto my-3" type="radio" id="normal-10-vip" name="price-selected" value="usd10">
</div>
<div class="div15">Students</div>
<div class="div16 price-grid d-flex flex-column justify-content-center">USD 450
<input class="mx-auto my-3" type="radio" id="student-450-date1" name="price-selected" value="usd450">
</div>
<div class="div17 price-grid d-flex flex-column justify-content-center">USD 450
<input class="mx-auto my-3" type="radio" id="student-450-date2" name="price-selected" value="usd450">
</div>
<div class="div18 price-grid d-flex flex-column justify-content-center">USD 650
<input class="mx-auto my-3" type="radio" id="student-650-date3" name="price-selected" value="usd650">
</div>
<div class="div19 price-grid d-flex flex-column justify-content-center">USD 0
<input class="mx-auto my-3" type="radio" id="student-0-vip" name="price-selected" value="usd0">
</div>
</div>
</article>
</div>
</div>
<div class="row pb-5">
<button class="py-4 submit-buttom" type="submit" id="register-submit">Join Master Bootcamp Computer Vision 2021</button>
</div>
</form>
</div>
</div>
</section>
<!-- Tickets section ENDSs -->
<!-- Footer STARTS -->
<footer>
<div class="container-md">
<div class="row mt-3">
<div class="col-12">
<ul class="d-flex justify-content-center m-0 p-0">
<li><a href="#"><i class='bx bxl-facebook-circle'></i></a></li>
<li><a href="#"><i class='bx bxl-twitter'></i></a></li>
<li><a href="#"><i class='bx bxl-youtube'></i></a></li>
</ul>
</div>
</div>
<div class="row text-center my-3">
<p>Copyright © 2021 ComputerVZ - Final Capstone Module HTML/CSS</p>
</div>
<div class="row border my-3 py-2 px-0 d-md-flex">
<div class="text-center">Icons made by <a class="text-decoration-none" href="https://www.flaticon.com/authors/good-ware" title="Good Ware">Good Ware</a> from <a class="text-decoration-none" href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a></div>
<div class="text-center">Design idea by <a class="text-decoration-none" href="https://www.behance.net/adagio07">Cindy Shin | GUI & Graphic Designer</a> </div>
</div>
</div>
</footer>
<!-- Footer ENDS -->
<!--Bootstrap JS-->
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-SR1sx49pcuLnqZUnnPwx6FCym0wLsk5JZuNx2bPPENzswTNFaQU1RDvt3wT4gWFG" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-j0CNLUeiqtyaRmlzUHCPZ+Gy5fQu0dQ6eZ/xAww941Ai1SxSY+0EQqNXNE6DZiVc" crossorigin="anonymous"></script>
</body>
</html>