-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
229 lines (200 loc) · 14.7 KB
/
index.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
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Google font -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap"
rel="stylesheet">
<!-- fonts -->
<script src="https://kit.fontawesome.com/27b4578870.js" crossorigin="anonymous"></script>
<!-- Slider css -->
<link rel="stylesheet" type="text/css" href="slick/slick.css" />
<link rel="stylesheet" type="text/css" href="slick/slick-theme.css" />
<link rel="stylesheet" href="style.css">
<title>Jeet</title>
</head>
<body>
<div class="head-container">
<div class="black"></div>
<div class="nav">
<div class="logo">
<img src="img/png-transparent-netflix.png" alt="logo" width="120">
</div>
<div class="menu">
<a href="#">HOME</a>
<a href="#">MOVIES</a>
<a href="#">SERIES</a>
<a href="#">SHOWS</a>
<a href="#">DOCUMENTRIES</a>
<div class="search">
<input type="text" placeholder="Search">
<button><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"
color="#ffffff" fill="none">
<path d="M17.5 17.5L22 22" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"
stroke-linejoin="round" />
<path
d="M20 11C20 6.02944 15.9706 2 11 2C6.02944 2 2 6.02944 2 11C2 15.9706 6.02944 20 11 20C15.9706 20 20 15.9706 20 11Z"
stroke="currentColor" stroke-width="1.5" stroke-linejoin="round" />
</svg></button>
</div>
</div>
<div class="dropdown"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"
color="#ffffff" fill="none">
<path d="M4 5L20 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"
stroke-linejoin="round" />
<path d="M4 12L20 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"
stroke-linejoin="round" />
<path d="M4 19L20 19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</div>
</div>
<div class="hero">
<div class="rating">
RATING
<span>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="#ffffff"
fill="red">
<path
d="M13.7276 3.44418L15.4874 6.99288C15.7274 7.48687 16.3673 7.9607 16.9073 8.05143L20.0969 8.58575C22.1367 8.92853 22.6167 10.4206 21.1468 11.8925L18.6671 14.3927C18.2471 14.8161 18.0172 15.6327 18.1471 16.2175L18.8571 19.3125C19.417 21.7623 18.1271 22.71 15.9774 21.4296L12.9877 19.6452C12.4478 19.3226 11.5579 19.3226 11.0079 19.6452L8.01827 21.4296C5.8785 22.71 4.57865 21.7522 5.13859 19.3125L5.84851 16.2175C5.97849 15.6327 5.74852 14.8161 5.32856 14.3927L2.84884 11.8925C1.389 10.4206 1.85895 8.92853 3.89872 8.58575L7.08837 8.05143C7.61831 7.9607 8.25824 7.48687 8.49821 6.99288L10.258 3.44418C11.2179 1.51861 12.7777 1.51861 13.7276 3.44418Z"
stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="#ffffff"
fill="red">
<path
d="M13.7276 3.44418L15.4874 6.99288C15.7274 7.48687 16.3673 7.9607 16.9073 8.05143L20.0969 8.58575C22.1367 8.92853 22.6167 10.4206 21.1468 11.8925L18.6671 14.3927C18.2471 14.8161 18.0172 15.6327 18.1471 16.2175L18.8571 19.3125C19.417 21.7623 18.1271 22.71 15.9774 21.4296L12.9877 19.6452C12.4478 19.3226 11.5579 19.3226 11.0079 19.6452L8.01827 21.4296C5.8785 22.71 4.57865 21.7522 5.13859 19.3125L5.84851 16.2175C5.97849 15.6327 5.74852 14.8161 5.32856 14.3927L2.84884 11.8925C1.389 10.4206 1.85895 8.92853 3.89872 8.58575L7.08837 8.05143C7.61831 7.9607 8.25824 7.48687 8.49821 6.99288L10.258 3.44418C11.2179 1.51861 12.7777 1.51861 13.7276 3.44418Z"
stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="#ffffff"
fill="red">
<path
d="M13.7276 3.44418L15.4874 6.99288C15.7274 7.48687 16.3673 7.9607 16.9073 8.05143L20.0969 8.58575C22.1367 8.92853 22.6167 10.4206 21.1468 11.8925L18.6671 14.3927C18.2471 14.8161 18.0172 15.6327 18.1471 16.2175L18.8571 19.3125C19.417 21.7623 18.1271 22.71 15.9774 21.4296L12.9877 19.6452C12.4478 19.3226 11.5579 19.3226 11.0079 19.6452L8.01827 21.4296C5.8785 22.71 4.57865 21.7522 5.13859 19.3125L5.84851 16.2175C5.97849 15.6327 5.74852 14.8161 5.32856 14.3927L2.84884 11.8925C1.389 10.4206 1.85895 8.92853 3.89872 8.58575L7.08837 8.05143C7.61831 7.9607 8.25824 7.48687 8.49821 6.99288L10.258 3.44418C11.2179 1.51861 12.7777 1.51861 13.7276 3.44418Z"
stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="#ffffff"
fill="red">
<path
d="M13.7276 3.44418L15.4874 6.99288C15.7274 7.48687 16.3673 7.9607 16.9073 8.05143L20.0969 8.58575C22.1367 8.92853 22.6167 10.4206 21.1468 11.8925L18.6671 14.3927C18.2471 14.8161 18.0172 15.6327 18.1471 16.2175L18.8571 19.3125C19.417 21.7623 18.1271 22.71 15.9774 21.4296L12.9877 19.6452C12.4478 19.3226 11.5579 19.3226 11.0079 19.6452L8.01827 21.4296C5.8785 22.71 4.57865 21.7522 5.13859 19.3125L5.84851 16.2175C5.97849 15.6327 5.74852 14.8161 5.32856 14.3927L2.84884 11.8925C1.389 10.4206 1.85895 8.92853 3.89872 8.58575L7.08837 8.05143C7.61831 7.9607 8.25824 7.48687 8.49821 6.99288L10.258 3.44418C11.2179 1.51861 12.7777 1.51861 13.7276 3.44418Z"
stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="#ffffff"
fill="none">
<path
d="M13.7276 3.44418L15.4874 6.99288C15.7274 7.48687 16.3673 7.9607 16.9073 8.05143L20.0969 8.58575C22.1367 8.92853 22.6167 10.4206 21.1468 11.8925L18.6671 14.3927C18.2471 14.8161 18.0172 15.6327 18.1471 16.2175L18.8571 19.3125C19.417 21.7623 18.1271 22.71 15.9774 21.4296L12.9877 19.6452C12.4478 19.3226 11.5579 19.3226 11.0079 19.6452L8.01827 21.4296C5.8785 22.71 4.57865 21.7522 5.13859 19.3125L5.84851 16.2175C5.97849 15.6327 5.74852 14.8161 5.32856 14.3927L2.84884 11.8925C1.389 10.4206 1.85895 8.92853 3.89872 8.58575L7.08837 8.05143C7.61831 7.9607 8.25824 7.48687 8.49821 6.99288L10.258 3.44418C11.2179 1.51861 12.7777 1.51861 13.7276 3.44418Z"
stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
</svg>
</span>
<h1>JEETz04</h1>
</div>
<div class="hero-content">
<h2>Watch Movie Now</h2>
<p>Journalist Eddie Brock develops superhuman strength and power when his body merges with the alien
Venom. Overcome with anger, Venom tries to control Eddie's dangerous new skills</p>
</div>
<div class="hero-btn">
<button>Watch Now <i class="fa-solid fa-play"></i></button>
</div>
<div class="slider-box">
<h3>My Movies</h3>
<div class="slider-menu">
<a href="#">RECENTS</a>
<a href="#">NEW</a>
<a href="#">FAVORITES</a>
<a href="#">RECOMMENDED</a>
</div>
<div class="slider-container">
<div class="slide">
<a href="#"><img src="img/avengers.jpeg" alt="avg-end">
<div class="slide-black"></div>
<div class="slide-hero">
<h4>Avengers End-Game</h4>
<span><i class="fa-solid fa-star"></i></span>
<span><i class="fa-solid fa-star"></i></span>
<span><i class="fa-solid fa-star"></i></span>
<span><i class="fa-solid fa-star"></i></span>
<span><i style="font-weight:100" class="fa-solid fa-star"></i></span>
</div>
</a>
</div>
<div class="slide">
<a href="#"><img src="img/andha.jpg" alt="avg-end">
<div class="slide-black"></div>
<div class="slide-hero">
<h4>Andhadhun</h4>
<span><i class="fa-solid fa-star"></i></span>
<span><i class="fa-solid fa-star"></i></span>
<span><i class="fa-solid fa-star"></i></span>
<span><i style="font-weight:100" class="fa-solid fa-star"></i></span>
<span><i style="font-weight:100" class="fa-solid fa-star"></i></span>
</div>
</a>
</div>
<div class="slide">
<a href="#"><img src="img/gray.jpeg" alt="avg-end">
<div class="slide-black"></div>
<div class="slide-hero">
<h4>The Gray Man</h4>
<span><i class="fa-solid fa-star"></i></span>
<span><i class="fa-solid fa-star"></i></span>
<span><i class="fa-solid fa-star"></i></span>
<span><i class="fa-solid fa-star"></i></span>
<span><i style="font-weight:100" class="fa-solid fa-star"></i></span>
</div>
</a>
</div>
<div class="slide">
<a href="#"><img src="img/animal.jpeg" alt="avg-end">
<div class="slide-black"></div>
<div class="slide-hero">
<h4>Animal</h4>
<span><i class="fa-solid fa-star"></i></span>
<span><i class="fa-solid fa-star"></i></span>
<span><i class="fa-solid fa-star"></i></span>
<span><i class="fa-solid fa-star"></i></span>
<span><i style="font-weight:100" class="fa-solid fa-star"></i></span>
</div>
</a>
</div>
<div class="slide">
<a href="#"><img src="img/code.jpeg" alt="avg-end">
<div class="slide-black"></div>
<div class="slide-hero">
<h4>Code 8</h4>
<span><i class="fa-solid fa-star"></i></span>
<span><i class="fa-solid fa-star"></i></span>
<span><i class="fa-solid fa-star"></i></span>
<span><i style="font-weight:100" class="fa-solid fa-star"></i></span>
<span><i style="font-weight:100" class="fa-solid fa-star"></i></span>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="border"></div>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Accusamus necessitatibus in architecto adipisci ullam
blanditiis doloribus dolore explicabo laboriosam alias eum recusandae, veritatis reiciendis? Quis aperiam corporis
pariatur obcaecati in autem doloremque a inventore enim eveniet. Nesciunt ab inventore quisquam harum, eligendi
quasi! Voluptatum provident cupiditate quis fugit eos, corporis atque beatae minima, facilis aut ipsam officiis
mollitia iste perspiciatis earum rem cum, eaque magni ullam pariatur minus ipsa. Numquam quo nostrum mollitia
adipisci ab, alias est perferendis sit vel. Perferendis repellendus fuga dolore quas porro quisquam accusamus, sequi
unde beatae atque voluptates perspiciatis consectetur tempora molestiae quos minima dolor?
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Minus dignissimos totam possimus dolore ea pariatur quasi,
voluptas dolorem dolorum voluptatum facere, officia, a veniam qui alias. Id aperiam vitae dicta ab eveniet itaque
laborum, nesciunt reiciendis magnam dignissimos, placeat possimus suscipit inventore assumenda error numquam fugit,
deleniti quam officia nobis facilis ducimus. Voluptatem delectus nemo amet minus totam. Recusandae laudantium
perspiciatis repellat atque minus cupiditate cum iste doloribus doloremque? Fuga quas harum sequi aliquam aperiam
eius ullam impedit soluta quis nam quisquam expedita explicabo, ipsam, minus esse blanditiis! Qui ab odio ex aliquid
itaque quae tempora nulla! Nostrum, dolorem. Repellendus perspiciatis consequuntur officia quisquam fuga! Ex ipsa
eveniet explicabo debitis nostrum, earum mollitia, qui impedit quod illo a laudantium nihil minima non porro? Autem
facilis totam, nulla eaque iusto nam, praesentium cum aut quae neque fuga culpa veniam labore natus et provident
corrupti distinctio, laborum reiciendis tempore tenetur iure quia?
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script type="text/javascript" src="slick/slick.min.js"></script>
<script src="script.js"></script>
</body>
</html>