-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
122 lines (122 loc) · 4.61 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
<!DOCTYPE html>
<html>
<head>
<title>float</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="css/styles.css">
</head>
<body class="home">
<div class="header-wrapper">
<header class="container">
<h1 class="column"><a href="#">fløat</a></h1>
<div id="menu-icon">
<div></div>
<div></div>
<div></div>
</div>
<nav id="menu">
<ul class="column five">
<li><a href="index.html">home</a></li>
<li><a href="index.html">articles</a></li>
<li><a href="index.html">stories</a></li>
</ul>
<h1 class="column two"><a href="#">fløat</a></h1>
<ul class="column five">
<li><a href="index.html">about</a></li>
<li><a href="index.html">contact</a></li>
<li>
<form id="search">
<input type="search" name="text" placeholder="Search...">
</form>
</li>
</ul>
</nav>
</header>
</div>
<div class="container">
<div class="nine column main">
<article>
<h2><a href="#">Lorem ipsum dolor sit amet</a></h2>
<a href="#"><img src="images/photo1.jpg" alt="photo1"></a>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. ucimus unde reprehenderit ullam harum aut ad iusto? Dolor xcepturi aperiam, accusamus consequatur hic molestias commodi ihil.</p>
</article>
<article>
<h2><a href="#">Lorem ipsum dolor sit amet</a></h2>
<a href="#"><img src="images/photo2.jpg" alt="photo2"></a>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. A apiente porro, dolore dolores, repudiandae soluta facere enim nventore? Sequi quia soluta, reiciendis nobis et rerum.</p>
</article>
<article>
<h2><a href="#">Lorem ipsum dolor sit amet</a></h2>
<a href="#"><img src="images/photo3.jpg" alt="photo3"></a>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel itae veritatis ipsum, omnis incidunt. Culpa quaerat est quo eleniti facilis nesciunt veniam recusandae quas corporis!</p>
</article>
<article class="fixedTo">
<h2><a href="#">Lorem ipsum dolor sit amet</a></h2>
<a href="#"><img src="images/photo4.jpg" alt="photo4"></a>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. uibusdam, accusamus ad veniam. Cumque nulla, dolorum ducimus quod liquid deleniti eos, quis ipsum quia aspernatur natus.</p>
</article>
</div>
<aside class="column three">
<section>
<h3>About</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. nsequuntur, ipsum, illo? Aut distinctio ullam fugiat nobis iste mpedit eque debitis optio placeat, est mollitia explicabo rerum acilis in ommodi repellendus. Totam, aliquam, qui. Unde ex deleniti vero umquam!</p>
</section>
<div class="sticker">
<section class="tags">
<h3>Tags</h3>
<li><a href="#">lorem</a></li>
<li><a href="#">ipsum</a></li>
<li><a href="#">dolor</a></li>
<li><a href="#">sit</a></li>
<li><a href="#">amet</a></li>
<li><a href="#">optio</a></li>
</section>
<section>
<h3>Popular</h3>
<h2><a href="#">Lorem ipsum dolor sit amet</a></h2>
<a href="#"><img src="images/photo5.jpg" alt="photo5"></a>
<h2><a href="#">Lorem ipsum dolor sit amet</a></h2>
<a href=""><img src="images/photo6.jpg" alt="photo6"></a>
</section>
</div>
</aside>
</div>
<div class="subscription-wrapper fixedTo">
<div class="subscription container">
<h3>Lorem ipsum dolor sit amet</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugit, dolores.</p>
<form id="email">
<input type="email" name="text" placeholder="test@mailbox.com">
<input type="submit" value="subscribe">
</form>
</div>
</div>
<div class="insta clear">
<a href="#"><img src="images/insta/insta1.jpg" alt="insta1"></a>
<a href="#"><img src="images/insta/insta2.jpg" alt="insta2"></a>
<a href="#"><img src="images/insta/insta3.jpg" alt="insta3"></a>
<a href="#"><img src="images/insta/insta4.jpg" alt="insta4"></a>
<a href="#"><img src="images/insta/insta5.jpg" alt="insta5"></a>
<a href="#"><img src="images/insta/insta6.jpg" alt="insta6"></a>
<a href="#"><img src="images/insta/insta7.jpg" alt="insta7"></a>
<a href="#"><img src="images/insta/insta8.jpg" alt="insta8"></a>
<a href="#"><div class="follow">follow us @ instagram</div></a>
</div>
<div class="footer-wrapper">
<footer class="container">
<ul>
<li><a href="#">lorem</a></li>
<li><a href="#">ipsum</a></li>
<li><a href="#">dolor</a></li>
<li><a href="#">sit</a></li>
<li><a href="#">amet</a></li>
</ul>
<div>All rights not reserved</div>
<div>Float © 2018</div>
</footer>
</div>
<script src="js/build.js"></script>
</body>
</html>