-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
160 lines (159 loc) · 5.27 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
<!doctype html>
<html>
<head>
<title>Shopping Cart</title>
<link rel="stylesheet" href="css/normalize.css" />
<link rel="stylesheet" href="css/style.css" />
</head>
<body>
<div class="container">
<header class="page-header">
<h1><a href="#">SH</a></h1>
<nav class="page-nav">
<h1>Page Navigation</h1>
<ul>
<li><a href="#">Woman</a></li>
<li><a href="#">Men</a></li>
<li><a href="#">Kids</a></li>
<li><a href="#">Coming Soon</a></li>
<li><a href="#">About</a></li>
</ul>
</nav>
<nav class="user-nav">
<h1>User Navigation</h1>
<ul>
<li><a href="#"><i class="icon-user"></i>Log In</a></li>
<li><a href="#"><i class="icon-basket"></i>Basket (0)</a></li>
</ul>
</nav>
<form>
<input type="search" placeholder="Search..." />
<input type="submit" value="Search" />
</form>
</header>
<main>
<header>
<h1>Hazy Shade of Spring</h1>
<p>Quisque lorem tortor fringilla sed, vestibulum id, eleifend justo.</p>
<a href="#">Check new Arrivals</a>
</header>
<section class="clearfix">
<h2>Inventory</h2>
<article class="article-product article-big">
<div class="article-content">
<h1>Heather Grey Basics</h1>
<p>New Arrival</p>
</div>
</article>
<article class="article-tweet">
<div class="article-content">
<h1>Tweet</h1>
<blockquote>Opening Ceremony @IndonesiaFW tomorrow, PMers! Are you ready for the biggest fashion movement in</blockquote>
<p>@PuspitaMarthaID</p>
</div>
</article>
<div class="article-spacer"></div>
<article class="article-category">
<div class="article-content">
<h1>Elegant Shoes</h1>
<p>Braided Leather</p>
</div>
</article>
<article class="article-product">
<div class="article-content">
<h1>Chuck Taylors</h1>
<p>$125.00</p>
</div>
</article>
<article class="article-tweet">
<div class="article-content">
<h1>Tweet</h1>
<blockquote>Girls, Girls, Girls: A Look Back at 50 Years of the Pirelli Calendar</blockquote>
<p>@Vogue</p>
</div>
</article>
<article class="article-product article-big">
<div class="article-content">
<h1>Jeans for Adventure</h1>
<p>New Arrival</p>
</div>
</article>
<div class="article-spacer"></div>
<article class="article-category">
<div class="article-content">
<h1>Jaxon Hat</h1>
<p>Beanie Hat</p>
</div>
</article>
<article class="article-product">
<div class="article-content">
<h1>Basic Blazer</h1>
<p>from $199.00</p>
</div>
</article>
</section>
<footer>
<h2>Sign up to receive our updates</h2>
<p>Nulla ipsum dolor lacus, suscipit adipiscing. Cum sociis natoque penatibus et ultrices volutpat.</p>
<form>
<input type="email" placeholder="Your e-mail" />
<input type="submit" value="Add">
</form>
<section class="clearfix">
<h2>Gallery</h2>
<nav>
<h3>Gallery Navigation</h3>
<ul>
<li><a href="#">Previous</a></li>
<li><a href="#">Next</a></li>
</ul>
</nav>
<ul>
</ul>
</section>
</footer>
</main>
<footer class="page-footer clearfix">
<h1>Footer</h1>
<nav>
<h2>Collection</h2>
<ul>
<li><a href="#">Woman (1725)</a></li>
<li><a href="#">Men (635)</a></li>
<li><a href="#">Kids (2514)</a></li>
<li><a href="#">Coming Soon (76)</a></li>
</ul>
</nav>
<nav>
<h2>Site</h2>
<ul>
<li><a href="#">Terms of Service</a></li>
<li><a href="#">Privacy Policy</a></li>
<li><a href="#">Copyright Policy</a></li>
<li><a href="#">Press Kit</a></li>
<li><a href="#">Support</a></li>
</ul>
</nav>
<nav>
<h2>Shop</h2>
<ul>
<li><a href="#">About us</a></li>
<li><a href="#">Shipping Methods</a></li>
<li><a href="#">Career</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
<nav>
<h2>Social</h2>
<p>Shoper is made with love in Warsaw,</p>
<p>2014 © All rights reserved. El Passion</p>
<ul class="social-icons cleafix">
<li class="footer-twitter"><a href="#">Twitter</a></li>
<li class="footer-facebook"><a href="#">Facebook</a></li>
<li class="footer-instagram"><a href="#">Instagram</a></li>
</ul>
</nav>
</footer>
</div>
</body>
</html>