Skip to content

Commit a03e5b7

Browse files
Merge branch 'main' into web-kh
2 parents 6281617 + d9fc9e0 commit a03e5b7

33 files changed

+1567
-1
lines changed
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<h1> Amazon Prime Login Page Clone </h1>
2+
<h3>Project overview</h3> <br>
3+
This a simple project where i created a clone of amazon prime login page using only html and css. <br>
4+
5+
<h3> Languages Used:-</h3> <br>
6+
<ul>
7+
<li>HTML</li>
8+
<li>CSS</li>
9+
</ul>
10+
<h3>How to run the project</h3><br>
11+
Running the project is easy.The user only have to scroll up and down .<br>
12+
Link for the website-https://yellowberard.github.io/Amazon-Prime-Video-login-clone/index.html
13+
Here Are Some Pictures:-<br>
14+
<image src="https://user-images.githubusercontent.com/82977727/127748504-cdea94ce-52dc-40e1-abd2-d8f7200cb8cc.png"> </image>
15+
<image src="https://user-images.githubusercontent.com/82977727/127748581-d6b6a860-7252-48dc-82ae-a2da2e1297f4.png"></image>

Amazon-Prime-Login-Page-Clone/index.css

Lines changed: 368 additions & 0 deletions
Large diffs are not rendered by default.
Lines changed: 191 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,191 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
8+
<title>Welcome to Prime Video</title>
9+
<link rel="stylesheet" href="index.css">
10+
<script src="https://code.iconify.design/1/1.0.7/iconify.min.js"></script>
11+
</head>
12+
13+
<body>
14+
15+
<div class="whole">
16+
17+
<!-- Header -->
18+
<header class="head">
19+
<div class="logo">
20+
<a href="https://www.primevideo.com/storefront/home/ref=atv_nb_logo" id="alogo">
21+
<div class="navlogo">Go To Home Page</div>
22+
</a>
23+
</div>
24+
<div class="right">
25+
<span class="lang">
26+
<span class="iconify" data-icon="bi:globe" data-inline="false"></span>
27+
<span class="role">EN</span>
28+
29+
</span>
30+
<span class="sigin">
31+
<a href="https://www.primevideo.com/auth-redirect/ref=atv_nb_sign_in?signin=1&returnUrl=%2Fref%3Datv_nb_logo%3Fref_%3Datv_nb_logo"
32+
class="sigin">Sign In</a>
33+
</span>
34+
</div>
35+
</header>
36+
37+
<div class="content">
38+
39+
<!-- Part-1 -->
40+
<div class="login-now">
41+
<div class="content-left">
42+
<h1 class="welcome">
43+
Welcome to Prime Video
44+
</h1>
45+
<p class="join"> Join Prime to watch latest movies, TV Shows and award winning Amazon-Originals </p>
46+
47+
<span class="login-prime"> <a
48+
href="https://www.primevideo.com/region/eu/auth-redirect/ref_=dvm_mlp_in_ai_s_g_unrec_lego/ref=atv_mlp_default_ft?_encoding=UTF8&amp%3BreturnUrl=%2Fregion%2Ffr%2F&deviceTypeId=A13Q6A55DBZB7M&signin=1"
49+
class="login-link">Login to Join Prime</a>
50+
</span>
51+
</div>
52+
53+
</div>
54+
55+
<!-- Part-2 -->
56+
<div class="start">
57+
<div class="content-right">
58+
<h1 class="Entertainment">Great Entertainment</h1>
59+
<p class="detail">With your prime membership, you have aceess to exclusive Amazon
60+
Originals,<br>Blockbuster
61+
BollyWood Movies and regional movies and more.
62+
</p>
63+
<span class="started">
64+
<a href="https://www.primevideo.com/region/eu/auth-redirect/ref_=dvm_mlp_in_ai_s_g_unrec_button3/ref=dvm_MLP_IN_Popt_2_ft?_encoding=UTF8&amp%3BreturnUrl=%2Fregion%2Ffr%2F&deviceTypeId=A13Q6A55DBZB7M&signin=1"
65+
class="start-link">Get Started</a>
66+
</span>
67+
68+
</div>
69+
70+
</div>
71+
72+
<!-- Part-3 -->
73+
<div class="memberships">
74+
<div class="content-left-2">
75+
<h1 class="member-h1">One memberships, many benefits</h1>
76+
<p class="benefits">Your Prime membership also includes ad-free music along with unlimited
77+
free,<br>fast delivery on eligible items, exclusive accessto deals & more
78+
</p>
79+
<span class="started">
80+
<a href="https://www.primevideo.com/region/eu/auth-redirect/ref_=dvm_mlp_in_ai_s_g_unrec_button3/ref=dvm_MLP_IN_Popt_2_ft?_encoding=UTF8&amp%3BreturnUrl=%2Fregion%2Ffr%2F&deviceTypeId=A13Q6A55DBZB7M&signin=1"
81+
class="start-link">Get Started</a>
82+
83+
</span>
84+
<p class="asterik">*Go to amazon.in/prime for more information</p>
85+
86+
</div>
87+
88+
</div>
89+
<!-- Part-4 -->
90+
<div class="tv-stick">
91+
<div class="content-right-2">
92+
<h1 class="firetv-h1">Even better with Fire TV Stick</h1>
93+
<p class="firetv-use">The biggest movies and TV shows are always better on a big screen.Simply plug
94+
your
95+
Amazon Fire TV Stick and stream on any HDTV.Press the voice button on the remote and say the
96+
title
97+
you want to watch to find it in seconds.
98+
</p>
99+
<span class="started">
100+
<a href="https://www.primevideo.com/region/eu/auth-redirect/ref_=dvm_mlp_in_ai_s_g_unrec_button3/ref=dvm_MLP_IN_Popt_2_ft?_encoding=UTF8&amp%3BreturnUrl=%2Fregion%2Ffr%2F&deviceTypeId=A13Q6A55DBZB7M&signin=1"
101+
class="start-link">Get Started</a>
102+
103+
</span>
104+
105+
</div>
106+
107+
</div>
108+
109+
<!-- part-5 -->
110+
<div class="multi-content">
111+
<div class="first">
112+
<div class="img3">
113+
<img class="dv-multi-column-image"
114+
src="https://images-na.ssl-images-amazon.com/images/G/01/digital/video/Magellan_MLP/PV_Benefits_Devices.jpg"
115+
alt="Watch anywhere">
116+
</div>
117+
<h2 class="h22">Watch Anywhere</h2>
118+
<p class="para">Enjoy from the web or with the Prime Video app on your phone, tablet, or select
119+
Smart
120+
TVs — on up to 3 devices at once.</p>
121+
</div>
122+
<div class="second">
123+
<div class="img3">
124+
<img class="dv-multi-column-image"
125+
src="https://images-na.ssl-images-amazon.com/images/G/01/digital/video/Magellan_MLP/PV_Benefits_Download_IN.jpg"
126+
alt="Download and go">
127+
</div>
128+
<h2 class="h22">Download and go</h2>
129+
<p class="para">Watch offline on the Prime Video app when you download titles to your iPhone, iPad,
130+
Tablet, or Android device.
131+
</p>
132+
</div>
133+
<div class="third">
134+
<div class="img3">
135+
<img class="dv-multi-column-image"
136+
src="https://images-na.ssl-images-amazon.com/images/G/01/digital/video/Magellan_MLP/300x300_Tile_1.png"
137+
alt="Data saver">
138+
</div>
139+
<h2 class="h22">Data Saver</h2>
140+
<p class="para">Control data usage while downloading and watching videos on select phones or
141+
tablets.
142+
</p>
143+
</div>
144+
</div>
145+
<!-- Part-6 -->
146+
<div class="family">
147+
<div class="content-left-3">
148+
<h1 class="friendly">Family Friendly</h1>
149+
<p class="friend">With easy to use Parental Controls and a dedicated kids page, enjoy secure,
150+
ad-free
151+
kids entertainment. Kids can enjoy popular TV shows like Peppa Pig, Powerpuff Girls, and Chhota
152+
Bheem.</p>
153+
<span class="started">
154+
<a href="https://www.primevideo.com/region/eu/auth-redirect/ref_=dvm_mlp_in_ai_s_g_unrec_button3/ref=dvm_MLP_IN_Popt_2_ft?_encoding=UTF8&amp%3BreturnUrl=%2Fregion%2Ffr%2F&deviceTypeId=A13Q6A55DBZB7M&signin=1"
155+
class="start-link">Get Started</a>
156+
157+
</span>
158+
</div>
159+
160+
</div>
161+
162+
</div>
163+
164+
<!-- footer -->
165+
166+
<footer class="foot">
167+
<div class="foot-logo">
168+
<img src="data:image/png;base64,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"
169+
alt="" class="ft-img">
170+
171+
</div>
172+
<div class="foot-links">
173+
<ul class="list-of-links">
174+
175+
<li><a href="/help/ref=dvm_MLP_EU_privacy?nodeId=202064890 " class="links">Terms and Privacy
176+
Notice</a></li>
177+
<li><a href="/contactus/ref=dvm_MLP_EU_contact" class="links">Send us feedback</a></li>
178+
179+
<li><a href="/help/ref=dvm_MLP_EU_help" class="links">Help</a></li>
180+
<li>
181+
<p class="link-para">© 1996-2021, Amazon.com, Inc. or its affiliates</p>
182+
</li>
183+
</ul>
184+
</div>
185+
</footer>
186+
187+
</div>
188+
189+
</body>
190+
191+
</html>

Good-Vibes-Form/goodVibesForm.png

49.8 KB
Loading

Good-Vibes-Form/index.html

Lines changed: 101 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,101 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>good vibes form</title>
8+
<link rel="stylesheet" href="main1.css">
9+
</head>
10+
11+
<body>
12+
<h1>Good Vibes Form</h1>
13+
<form>
14+
<p id="des">Tell us something that happened to you
15+
today.
16+
</p>
17+
<div class="form-rows">
18+
<div class="left">
19+
<label for="name">Name</label>
20+
</div>
21+
<div class="right">
22+
<input type="text" id="name" placeholder="Enter your name">
23+
</div>
24+
</div>
25+
26+
<div class="form-rows">
27+
<div class="left">
28+
<label for="email">Email</label>
29+
</div>
30+
<div class="right">
31+
<input type="email" id="email" placeholder="Enter your email address">
32+
<div class="right"></div>
33+
</div>
34+
<div class="form-rows"> <div class="left">
35+
<label for="good">On ascale of 1-10,how
36+
good was it?
37+
</label>
38+
</div>
39+
<div class="right">
40+
<input type="number" id="good" placeholder="Enter a number between 1-10">
41+
</div>
42+
</div>
43+
<div class="form-rows">
44+
<div class="left">
45+
<label for="list">Where did it
46+
happen?
47+
</label>
48+
</div>
49+
<div class="right">
50+
<select id="list">
51+
<option value="1">At home</option>
52+
<option value="2">At my commute</option>
53+
<option value="3">At street</option>
54+
<option value="4">other</option>
55+
</select>
56+
</div>
57+
</div>
58+
<div class="form-rows">
59+
<div class="left">
60+
<label>At what time did it happen?</label>
61+
</div>
62+
<div class="right">
63+
<input type="radio" style="height: 8px;" name="time">
64+
<p>Morning</p><br>
65+
<input type="radio" style="height: 8px;" name="time">
66+
<p>Afternoon</p><br>
67+
<input type="radio" style="height: 8px;" name="time">
68+
<p>Evening</p><br>
69+
</div>
70+
</div>
71+
<div class="form-rows">
72+
<div class="left">
73+
<label>At what time did it happen?</label>
74+
</div>
75+
<div class="right">
76+
<input type="checkbox" style="height: 8px;" name="emotions">
77+
<p>Exited</p><br>
78+
<input type="checkbox" style="height: 8px;" name="emotions">
79+
<p>Humbled</p><br>
80+
<input type="checkbox" style="height: 8px;" name="emotions">
81+
<p>Elated</p><br>
82+
<input type="checkbox" style="height: 8px;" name="emotions">
83+
<p>Loved</p><br>
84+
<input type="checkbox" style="height: 8px;" name="emotions">
85+
<p>Enthusiatic</p><br>
86+
</div>
87+
</div>
88+
<div class="form-rows">
89+
<div class="left">
90+
<label for="text">Please describe your positive experience.</label>
91+
</div>
92+
<div class="right">
93+
<textarea id="text" placeholder="Enter your experience here" cols="25" rows="5"></textarea>
94+
</div>
95+
</div>
96+
<input type="submit" id="button" value="submit">
97+
</form>
98+
99+
</body>
100+
101+
</html>

Good-Vibes-Form/main1.css

Lines changed: 87 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,87 @@
1+
*{
2+
margin:0;
3+
padding:0;
4+
}
5+
body{
6+
background-color:lightblue;
7+
display:flex;
8+
flex-direction:column;
9+
align-items:center;
10+
}
11+
h1{
12+
font-size:60px;
13+
}
14+
/*form style*/
15+
form{
16+
text-align:center;
17+
border-radius:5px;
18+
border:1px solid rgb(240, 234, 234);
19+
background-color: rgb(240, 234, 234);
20+
width:55%;
21+
margin:40px;
22+
padding:20px;
23+
}
24+
25+
.form-rows{
26+
position:static;
27+
display:block;
28+
29+
}
30+
31+
.form-rows input{
32+
font-size:15px;
33+
margin:15px;
34+
border-radius:5px;
35+
padding:5px 15px;
36+
border:1px solid lightgrey;
37+
}
38+
.form-rows label{
39+
font-size:15px;
40+
41+
}
42+
.right{
43+
display:inline-block;
44+
vertical-align:middle;
45+
width:55%;
46+
text-align:left;
47+
48+
}
49+
.left{
50+
display:inline-block;
51+
text-align:right;
52+
width:40%;
53+
vertical-align:middle;
54+
55+
}
56+
p{
57+
font-size:15px;
58+
display:inline-block;
59+
}
60+
textarea{
61+
font-size: 5px 15px;
62+
border-radius:4px;
63+
padding:15px;
64+
border:1px solid lightgrey;
65+
}
66+
#button{
67+
padding:5px;
68+
background-color:rgb(102, 182, 247);
69+
color:white;
70+
border:1px solid rgb(102, 182, 247);
71+
border-radius:3px;
72+
font-size:15px;
73+
}
74+
#list{
75+
font-size:15px;
76+
border-radius:2px;
77+
border:1px solid lightgrey;
78+
margin: 5px;
79+
color:rgb(122, 116, 116);
80+
}
81+
#des{
82+
font-size:25px;
83+
margin-bottom:18px;
84+
}
85+
86+
87+

0 commit comments

Comments
 (0)