Skip to content

Commit b080cbd

Browse files
committed
#890 A responsive movie website
1 parent 7cb85b6 commit b080cbd

107 files changed

Lines changed: 2284 additions & 0 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.
Lines changed: 146 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,146 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Batman</title>
7+
<link rel="stylesheet" href="style.css">
8+
9+
<link rel="shortcut icon" href="img/fav-icon.png" type="image/x-icon">
10+
11+
<link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'>
12+
</head>
13+
<body>
14+
<header>
15+
<div class="nav container">
16+
<a href="index.html" class="logo">
17+
Movie<span>RRific</span>
18+
</a>
19+
<div class="search-box">
20+
<input type="search" name="" id="search-input" placeholder="Search movie">
21+
<i class='bx bx-search-alt'></i>
22+
</div>
23+
<a href="#" class="user">
24+
<img src="img/user2.jpg" alt="" class="user-img">
25+
</a>
26+
<div class="navbar">
27+
<a href="index.html" class="nav-link nav-active">
28+
<i class='bx bxs-home-smile'></i>
29+
<span class="nav-link-title">Home</span>
30+
</a>
31+
32+
<a href="#home" class="nav-link">
33+
<i class='bx bxs-hot' ></i>
34+
<span class="nav-link-title">Trending</span>
35+
</a>
36+
37+
<a href="#home" class="nav-link">
38+
<i class='bx bx-compass'></i>
39+
<span class="nav-link-title">Explore</span>
40+
</a>
41+
42+
<a href="#home" class="nav-link">
43+
<i class='bx bxs-tv'></i>
44+
<span class="nav-link-title">Movies</span>
45+
</a>
46+
47+
<!-- <a href="#home" class="nav-link">
48+
<i class='bx bx-tv'></i>
49+
<span class="nav-link-title">Webseries</span>
50+
</a> -->
51+
</div>
52+
</div>
53+
</header>
54+
55+
<!-- Play container -->
56+
<div class="play-container container">
57+
<img src="play-page/play-background 5.jpg" alt="" class="play-img">
58+
<div class="play-text">
59+
<h2>The Batman</h2>
60+
<div class="rating">
61+
<i class='bx bxs-star'></i>
62+
<i class='bx bxs-star'></i>
63+
<i class='bx bxs-star'></i>
64+
<i class='bx bxs-star'></i>
65+
<i class='bx bxs-star-half'></i>
66+
</div>
67+
68+
<div class="tags">
69+
<span>Action</span>
70+
<span>Adventure</span>
71+
<span>4K</span>
72+
</div>
73+
<!-- Trailer Button -->
74+
<a href="#" class="watch-btn">
75+
<i class='bx bxs-right-arrow'></i>
76+
<span>Watch the trailer</span>
77+
</a>
78+
</div>
79+
<i class='bx bxs-right-arrow play-movie'></i>
80+
<!-- Video -->
81+
<div class="video-container">
82+
<div class="video-box">
83+
<video id="myvideo" src="play-page/THE BATMAN.mp4" controls></video>
84+
<i class='bx bx-x close-video'></i>
85+
</div>
86+
</div>
87+
</div>
88+
89+
<div class="about-movie container">
90+
<h2>The Batman</h2>
91+
<p>When a sadistic serial killer begins murdering key political figures in Gotham, Batman is forced to investigate the city's hidden corruption and question his family's involvement.</p>
92+
<!-- Movie Cast -->
93+
<h2 class="cast-heading">Movie Cast</h2>
94+
<div class="cast">
95+
<div class="cast-box">
96+
<img src="play-page/Robert pattinson.jpg" alt="" class="cast-img">
97+
<span class="cast-title">Robert Pattinson</span>
98+
</div>
99+
100+
<div class="cast-box">
101+
<img src="play-page/Zoe Kravitz.jpg" alt="" class="cast-img">
102+
<span class="cast-title">Zoe Kravitz</span>
103+
</div>
104+
105+
<div class="cast-box">
106+
<img src="play-page/Colin Farrell.jpg" alt="" class="cast-img">
107+
<span class="cast-title">Collin Farrell</span>
108+
</div>
109+
110+
<div class="cast-box">
111+
<img src="play-page/Paul Dano.jpg" alt="" class="cast-img">
112+
<span class="cast-title">Paul Dano</span>
113+
</div>
114+
115+
<div class="cast-box">
116+
<img src="play-page/Jeffrey Wright.jpg" alt="" class="cast-img">
117+
<span class="cast-title">Jeffrey Wright</span>
118+
</div>
119+
120+
<div class="cast-box">
121+
<img src="play-page/Andy Serkis.jpg" alt="" class="cast-img">
122+
<span class="cast-title">Andy Serkis</span>
123+
</div>
124+
</div>
125+
</div>
126+
<!-- Download -->
127+
<div class="download">
128+
<h2 class="download-title">Download Movie</h2>
129+
<div class="download-links">
130+
<a href="play-page/THE BATMAN.mp4" download>480p</a>
131+
<a href="play-page/THE BATMAN.mp4" download>720p</a>
132+
<a href="play-page/THE BATMAN.mp4" download>1080p</a>
133+
</div>
134+
</div>
135+
136+
137+
<!-- COPYRIGHT -->
138+
<div class="copyright">
139+
<p>&#169; Roudranil All Rights Resolved</p>
140+
</div>
141+
142+
<script src="swiper-bundle.min.js"></script>
143+
<script src="main.js"></script>
144+
</body>
145+
</html>
146+
Lines changed: 146 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,146 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Eternals</title>
7+
<link rel="stylesheet" href="style.css">
8+
9+
<link rel="shortcut icon" href="img/fav-icon.png" type="image/x-icon">
10+
11+
<link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'>
12+
</head>
13+
<body>
14+
<header>
15+
<div class="nav container">
16+
<a href="index.html" class="logo">
17+
Movie<span>RRific</span>
18+
</a>
19+
<div class="search-box">
20+
<input type="search" name="" id="search-input" placeholder="Search movie">
21+
<i class='bx bx-search-alt'></i>
22+
</div>
23+
<a href="#" class="user">
24+
<img src="img/user2.jpg" alt="" class="user-img">
25+
</a>
26+
<div class="navbar">
27+
<a href="index.html" class="nav-link nav-active">
28+
<i class='bx bxs-home-smile'></i>
29+
<span class="nav-link-title">Home</span>
30+
</a>
31+
32+
<a href="#home" class="nav-link">
33+
<i class='bx bxs-hot' ></i>
34+
<span class="nav-link-title">Trending</span>
35+
</a>
36+
37+
<a href="#home" class="nav-link">
38+
<i class='bx bx-compass'></i>
39+
<span class="nav-link-title">Explore</span>
40+
</a>
41+
42+
<a href="#home" class="nav-link">
43+
<i class='bx bxs-tv'></i>
44+
<span class="nav-link-title">Movies</span>
45+
</a>
46+
47+
<!-- <a href="#home" class="nav-link">
48+
<i class='bx bx-tv'></i>
49+
<span class="nav-link-title">Webseries</span>
50+
</a> -->
51+
</div>
52+
</div>
53+
</header>
54+
55+
<!-- Play container -->
56+
<div class="play-container container">
57+
<img src="play-page/play-background 4.jpg" alt="" class="play-img">
58+
<div class="play-text">
59+
<h2>Eternals</h2>
60+
<div class="rating">
61+
<i class='bx bxs-star'></i>
62+
<i class='bx bxs-star'></i>
63+
<i class='bx bxs-star'></i>
64+
<i class='bx bxs-star'></i>
65+
<i class='bx bxs-star-half'></i>
66+
</div>
67+
68+
<div class="tags">
69+
<span>Action</span>
70+
<span>Adventure</span>
71+
<span>4K</span>
72+
</div>
73+
<!-- Trailer Button -->
74+
<a href="#" class="watch-btn">
75+
<i class='bx bxs-right-arrow'></i>
76+
<span>Watch the trailer</span>
77+
</a>
78+
</div>
79+
<i class='bx bxs-right-arrow play-movie'></i>
80+
<!-- Video -->
81+
<div class="video-container">
82+
<div class="video-box">
83+
<video id="myvideo" src="play-page/eternals.mp4" controls></video>
84+
<i class='bx bx-x close-video'></i>
85+
</div>
86+
</div>
87+
</div>
88+
89+
<div class="about-movie container">
90+
<h2>Eternals</h2>
91+
<p>Following the events of Avengers: Endgame (2019), an unexpected tragedy forces the Eternals, ancient aliens who have been living on Earth in secret for thousands of years, out of the shadows to reunite against mankind's most ancient enemy, the Deviants.</p>
92+
<!-- Movie Cast -->
93+
<h2 class="cast-heading">Movie Cast</h2>
94+
<div class="cast">
95+
<div class="cast-box">
96+
<img src="play-page/Angelina Jolie.jpg" alt="" class="cast-img">
97+
<span class="cast-title">Angelina Jolie</span>
98+
</div>
99+
100+
<div class="cast-box">
101+
<img src="play-page/Harry Styles.jpg" alt="" class="cast-img">
102+
<span class="cast-title">Harry Styles</span>
103+
</div>
104+
105+
<div class="cast-box">
106+
<img src="play-page/Gemma Chan.jpg" alt="" class="cast-img">
107+
<span class="cast-title">Gemma Chan</span>
108+
</div>
109+
110+
<div class="cast-box">
111+
<img src="play-page/Ma Dong-seok.jpg" alt="" class="cast-img">
112+
<span class="cast-title">Ma Dong-seok</span>
113+
</div>
114+
115+
<div class="cast-box">
116+
<img src="play-page/Kit Harington.jpg" alt="" class="cast-img">
117+
<span class="cast-title">Kit Harington</span>
118+
</div>
119+
120+
<div class="cast-box">
121+
<img src="play-page/Richard Madden.jpg" alt="" class="cast-img">
122+
<span class="cast-title">Richard Madden</span>
123+
</div>
124+
</div>
125+
</div>
126+
<!-- Download -->
127+
<div class="download">
128+
<h2 class="download-title">Download Movie</h2>
129+
<div class="download-links">
130+
<a href="play-page/eternals.mp4" download>480p</a>
131+
<a href="play-page/eternals.mp4" download>720p</a>
132+
<a href="play-page/eternals.mp4" download>1080p</a>
133+
</div>
134+
</div>
135+
136+
137+
<!-- COPYRIGHT -->
138+
<div class="copyright">
139+
<p>&#169; Roudranil All Rights Resolved</p>
140+
</div>
141+
142+
<script src="swiper-bundle.min.js"></script>
143+
<script src="main.js"></script>
144+
</body>
145+
</html>
146+

0 commit comments

Comments
 (0)