Skip to content

Commit e6e504b

Browse files
committed
store
creating new html file for store link,
1 parent 0c7a000 commit e6e504b

File tree

3 files changed

+112
-4
lines changed

3 files changed

+112
-4
lines changed

css/style.css

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ header {
2222
height: 5rem;
2323
margin-top: 1rem;
2424
margin-bottom: 1rem;
25+
background-color: rgba(196, 196, 196, 0.1);
2526
}
2627

2728
.logo1 {
@@ -116,6 +117,10 @@ hr {
116117

117118
/* footer */
118119

120+
footer {
121+
background-color: yellow;
122+
}
123+
119124
p {
120125
text-align:center;
121126
font-size: 23px;
@@ -148,4 +153,38 @@ h6{
148153
font-size: 15px;
149154
}
150155

156+
/* form section */
157+
158+
.form-container {
159+
/* background-color:rgb(161, 184, 234); */
160+
height: 40rem;
161+
width: 100%;
162+
font-family: roboto;
163+
color: #DE6E49;
164+
display: flex;
165+
flex-direction: row;
166+
167+
}
168+
/* */
169+
.form {
170+
/* background-color: chartreuse; */
171+
height: 40rem;
172+
width: 50%;
173+
display: flex;
174+
flex-direction: column;
175+
/* padding: 3rem; */
176+
177+
}
178+
179+
.form-picture {
180+
width: 50%;
181+
height: 40rem;
182+
}
151183

184+
.form-picture img {
185+
width: 100%;
186+
height: 40rem;
187+
188+
189+
190+
}

index.html

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,9 @@
1515
<img class="img" src="./img/karma-logo.svg" alt="Logo"></img>
1616
<nav class="logo1">
1717
<ul class="list">
18-
<li><a class="bar" href="#">Meet Karma</a></li>
18+
<li><a class="bar" href="index.html">Meet Karma</a></li>
1919
<li><a href="#">How it Works</a></li>
20-
<li><a href="#">Store</a></li>
20+
<li><a href="store.html">Store</a></li>
2121
<li><a href="#">Blog</a></li>
2222
<li><a href="#">Help</a></li>
2323
<li><a href="#">Login</a></li>
@@ -65,9 +65,10 @@ <h5>Pas as You Go</h5>
6565
<li><a href="#"><img src="./img/facebook-icon.svg"></a></li>
6666
<li><a href="#"><img src="./img/instagram-icon.svg"></a></li>
6767
</ul>
68+
<h6>&copy; Karma Mobility, Inc.</h6>
6869
</div>
69-
70+
7071
</footer>
71-
<h6>&copy; Karma Mobility, Inc.</h6>
72+
7273
</body>
7374
</html>

store.html

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Store</title>
8+
<link rel="stylesheet" href="css/style.css">
9+
</head>
10+
<body>
11+
<header>
12+
<img class="img" src="./img/karma-logo.svg" alt="Logo"></img>
13+
<nav class="logo1">
14+
<ul class="list">
15+
<li><a class="bar" href="index.html">Meet Karma</a></li>
16+
<li><a href="#">How it Works</a></li>
17+
<li><a href="#">Store</a></li>
18+
<li><a href="#">Blog</a></li>
19+
<li><a href="#">Help</a></li>
20+
<li><a href="#">Login</a></li>
21+
</ul>
22+
</nav>
23+
</header>
24+
<div class="form-container">
25+
<form class="form">
26+
<h1>Order your Karma wifi<br>
27+
device today!</h1>
28+
<label for="fname">First name:</label><br>
29+
<input type="text" id="fname" name="fname"><br><br>
30+
<label for="lname">Last name:</label>
31+
<input type="text" id="lname" name="lname"><br><br>
32+
<input type="submit" value="Submit">
33+
</form>
34+
<div class="form-picture">
35+
<img src="/level-2/store-image_by-andrew-neel-unsplash.jpg"/>
36+
</div>
37+
</div>
38+
</form>
39+
40+
41+
42+
43+
44+
45+
46+
47+
48+
49+
50+
51+
52+
53+
<hr>
54+
<footer>
55+
<p>Join us on</p>
56+
<div class="media">
57+
<ul>
58+
<li><a href="#"><img src="./img/twitter-icon.svg"></a></li>
59+
<li><a href="#"><img src="./img/facebook-icon.svg"></a></li>
60+
<li><a href="#"><img src="./img/instagram-icon.svg"></a></li>
61+
</ul>
62+
<h6>&copy; Karma Mobility, Inc.</h6>
63+
</div>
64+
65+
</footer>
66+
67+
</body>
68+
</html>

0 commit comments

Comments
 (0)