forked from CodeYourFuture/HTML-CSS-Module-Project
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathstore.html
More file actions
121 lines (116 loc) · 5.16 KB
/
store.html
File metadata and controls
121 lines (116 loc) · 5.16 KB
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Karma</title>
<link href='https://fonts.googleapis.com/css?family=Roboto:400,500,300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/style.css">
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<header id="header_store">
<div>
<svg id="logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 144 216">
<path fill="#F15B2A"
d="M126.1 212.9c4.1 4.1 10.7 4.1 14.8 0 4.1-4.1 4.1-10.7 0-14.8l-28.6-28.6 18.1-18.1c8.4-8.4 13.6-20 13.6-32.9C144 92.8 123.2 72 97.5 72S51 92.8 51 118.5c0 12.8 5.2 24.5 13.6 32.9l18.1 18.1-18.1 18.1c-4.6 4.6-11 7.5-18.1 7.5-14.1 0-25.6-11.5-25.6-25.6v-159C20.9 4.7 16.2 0 10.5 0 4.7 0 0 4.7 0 10.5v159C0 195.2 20.8 216 46.5 216c12.8 0 24.5-5.2 32.9-13.6l18.1-18.1 28.6 28.6zm-46.7-76.3c-4.6-4.6-7.5-11-7.5-18.1 0-14.1 11.5-25.6 25.6-25.6 14.1 0 25.6 11.5 25.6 25.6 0 7.1-2.9 13.5-7.5 18.1l-18.1 18.1-18.1-18.1z" />
</svg>
</div>
<div>
<nav class="navmenu">
<p class="karma">Meet Karma</p>
<p class="stnd"> How It Works</p>
<p> <a class="store" href="store.html">Store</a></p>
<p class="stnd">Blog</p>
<p class="stnd">Help</p>
<p class="stnd">Login</p>
</nav>
</div>
<br>
</header>
<br>
<main class="main_design">
<div class="grid2">
<section class="section_1">
<h1 class="orange_type">Order your Karma wifi device today</h1>
<form>
<div class="que margin_box">
<div>
<label for="fname" class="titles">First name *</label><br>
<input type="text" name="fname" id="fname">
</div>
<div class="left_margin">
<label for="lname" class="titles">Last name *</label><br>
<input type="text" name="lname" id="lname">
</div>
</div>
<div class="margin_box">
<label for="adress" class="titles">Adress *</label><br>
<input type="text" name="adress" id="adress">
</div>
<div class="margin_box">
<label for="adress2" class="titles">Adress 2</label><br>
<input type="text" name="adress2" id="adress2">
</div>
<div class="que margin_box">
<div>
<label for="city" class="titles"><i>City *</i></label><br>
<select name="city" id="city" autofocus>
<option disabled id="default_value">choose your city</option>
<option id="default_value">Selecct your city...</option>
</select>
</div>
<div class="left_margin">
<label for="postcode" class="titles">Postcode *</label><br>
<input type="text" name="postcode" id="postcode">
</div>
</div>
<div class="margin_box">
<p class="titles">Select a colour</p>
<input id="karmaorange" type="radio" value="karma" name="pick">
<label for="karmaOrange">Karma Orange</label>
<input id="spacegrey" type="radio" value="space" name="pick">
<label for="spacegrey">Space Grey</label>
</div>
<div class="que margin_box">
<label name="checkbox" id="checkbox"></label>
<input type="checkbox" id="checkbox">
<p>By placing your order you agree to Karma's <span class="terms">Terms and Conditions.</span> *</p>
</div>
<div class="button_align">
<button class="over4">
Place my order
</button>
</div>
</form>
</div>
<div class="grid2">
</section>
<section class="section_2">
<div>
<img class="img_str" src="level-2/store-image_by-andrew-neel-unsplash.jpg">
</div>
</section>
</div>
</main>
<footer>
<br>
<p class="join">Join us on</p>
<br>
<div class="socials">
<div class="social">
<img src="img/twitter-icon.svg" alt="twitter">
</div>
<div class="social">
<img src="img/facebook-icon.svg" alt="facebook">
</div>
<div class="social">
<img src="img/instagram-icon.svg" alt="instagram">
</div>
</div>
<br>
<p class="end">© Karma Mobility, Inc.</p>
</footer>
</body>
</html>