-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
161 lines (138 loc) · 5.81 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
161
<!DOCTYPE html>
<html>
<head>
<link rel= "stylesheet/less" type="text/css" href="normalize.css">
<link href='http://fonts.googleapis.com/css?family=Oswald:400,700,300' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,800,700,600,300' rel='stylesheet' type='text/css'>
<link rel= "stylesheet/less" type="text/css" href="main.less">
<script src="//cdnjs.cloudflare.com/ajax/libs/less.js/2.3.1/less.min.js"></script>
<title>Surf & Paddle Co. </title>
<body>
<header class="header">
<div class="surf">
<img src="assets/logo.png" alt="surf & paddle co logo" class="sp_logo"> SURF & PADDLE CO. BLOG
</div>
<div class="about">
<ul>
<li><a href="#">ABOUT</a></li>
<li><a href="#">SEARCH</a></li>
<li><img src="assets/search-icon.png" alt="search" class="search"></li>
</ul>
</div>
<div>
<p class="header">SURF & PADDLE CO.</p>
<p class="small_header">An Ironyard Academy Project Est. Fall 2013</p>
</div>
</div>
</header>
<div class="left">
<div class="article_title">
<p>A FANTASTIC ENGAGING <span>
HEADLINE GOES HERE</span></p>
</div>
<div class="by_line">
<img src="assets/avatar.png" alt="avatar"> Anne Marie
<span>on</span>
<a href="#">Monday Oct. 7th 9:27pm</a>
</div>
<div class="paragraph1">
Locavore ea meggings, deep v gentrify bespoke butcher yr typewriter. Nisi sunt 8-bit craft beer, leggins deep v biodiesel Williamsburg. Actually hashtag art party nescuint squid pour-over. Kitsch cray. Marfa brunch fingerstache officia Schlitz Blue Bottle cillum. Mlkshk 8-bit aliquip fingerstache sunt.
</div>
<div class="paragraph2">
Distillery ad sriracha, synth wolf street art brunch excepteur consectetur art party irony fugiat. Duis chia yr, pour-over Portland velit High Life non aesthetic fugiat tattoed shabby <a href="x">chic mixtape</a>.
</div>
<div class="proclaim">
WOAH, THAT'S RADICAL!
</div>
<div class="paragraph3">
Swag nisi mixtape cray, non hashtag blog tote bag dolor bitters before they sold out ea dolore. Raw denim mixtape drinking vinegar, Vice 3 wolf moon authentic officia id. Keffiyeh yr retro, salvia do <a href="x"> aliqua</a> leggings selvage narwhal farm-to-table dolor Tonx DIY photo booth. Bitters gastropub non 3 wolf moon Blue Bottle organic, cray aesthethic jean shorts velit umami. Mlkshk roof party cardigan, farm-to-table aute plaid wolf master cleanse. Thundercats tattoed lo-fo culpa, mollit Pinterest American Apparel. # wolf moon VHS hella, Tonx beard chambray sustainable jean shorts synth mlkshk fugiat excepteur banh mi eu whatever.
<p>Vinyl sartorial culpa bespoke labore, ethical readymade tofu selfies ut lovacore commodo mumblecore paleo typewriter. Mumblecore selfies nostrud, asymmetrical 90's fanny pack est Blue Bottle ethnic blog. Narwhal Shoreditch fixxie tofu, nisi before</p>
</div>
<div class="buttons">
<div class="button1">
<img src="assets/icon-comment.png" alt="Read Comments"><a href="#">Read Comments</a>
</div>
<div class="button2">
<img src="assets/icon-upload.png" alt="Read Later"><a href="#">Read Later</a>
</div>
<div class="button3">
<img src="assets/icon-share.png" alt="Share This Post"><a href="#">Share This Post</a>
</div>
</div>
</div>
<div class="right">
<div class="social">
<img src="assets/avatar.png" alt="avatar">
</div>
<div class="anne"> ANNE MARIE
</div>
<div class="social_media">
<a href="http://www.twitter.com">Twitter</a>
<a href="http://www.facebook.com">Facebook</a>
<a href="http://www.Instagram.com">Instagram</a>
</div>
<div class="adv">
<img src="assets/ad.jpg">
</div>
<div class="about_ad">
<a href="x">About This Ad</a>
</div>
<div class="side">
<h3>SIDEBAR SECTION HEADING</h3>
<div class="text">
<p>Distillery ad sirracha synth wolf street art brunch excepteur consectetur art party irony fugiat. Duis chia yr, pour-over Portland velit High Life non aesthetic fugiat tattoed shabby chic mixtape ethical cornhole mustache roof party proidtn aesthetic hoodie.
</p>
</div>
</div>
</div>
<div class="line">
<hr>
</div>
<div class="lower">
<div class="posts">MOST POPULAR POSTS
</div>
<div class="rollover1">
<a href="x">
<img src="assets/article-image-1.jpg" alt="Another Cool Post">
<h3><br>ANOTHER COOL POST</h3>
</a>
</div>
<div class="rollover2">
<a href="x">
<img src="assets/article-image-2.jpg" alt="Post Title">
<h3><br>POST TITLE</h3>
</a>
</div>
<div class="rollover3">
<a href="x">
<img src="assets/article-image-3.jpg" alt="Here's Another LongerPost Title">
<h3>HERE'S ANOTHER<br>LONGER POST TITLE</h3>
</a>
</div>
<div class="rollover4">
<a href="x">
<img src="assets/article-image-4.jpg"alt="Oh Cool A Post!">
<h3><br>OH COOL A POST!</h3>
</a>
</div>
</div>
</div>
<footer>
<div class="logo">
<img src="assets/theironyard-logo.png" alt="Ironyard Logo">
<div class="ironyard">
<p>The Ironyard Copyright 2013. All Rights Reserved</p>
</div>
</div>
<div class="navlinks">
<ul>
<li><a href="#">Nav Item 1</a></li>
<li><a href="#">Nav Item 2</a></li>
<li><a href="#">Nav Item 3</a></li>
<li><a href="#">Nav Item 5</a></li>
</ul>
</div>
</footer>
</body>
</head>
</html>