-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
197 lines (157 loc) · 8.29 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
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Pintereach</title>
<link href='css/index.css' rel='stylesheet' type="text/css">
<link href="https://fonts.googleapis.com/css?family=Poiret+One" rel="stylesheet">
<link rel="icon" type="image/png" href="assets/favicon%20pintereach.gif">
<script src="app.js" async></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/2.1.2/TweenMax.min.js" async></script>
</head>
<body>
<div class='wrapper'>
<nav>
<div class='logo'>
<a href='index.html'><img src='assets/logo_transparent.png' alt='pintereach logo'></a>
</div>
<div class='nav-buttons'>
<button class='button about'><a href="about.html">About Us</a></button>
<button class='button in'><a href='https://pintereacher.netlify.com/login/'>Sign In</a></button>
<button class='button' id='sign-up'><a href='https://pintereacher.netlify.com/'>Sign Up</a></button>
</div>
</nav>
<div class = 'content'>
<section class='feature dark top'>
<img src='assets/ibook-shelf.jpg' id='top-img'>
<article>
<h2>Envision Your Research</h2>
<p>As a researcher, it's difficult to keep track of articles you want to read later. Pintereach helps you research by enabling you to save and organize articles in to categories to read later.</p>
<p>Pintereach is a tool that helps you visually organize your research. </p>
</article>
</section>
<section class='feature visual-research'>
<h2>Visual Research</h2>
<p>Similar to Pinterest, you are able to store research articles in collage style research boards where you can place articles for further reading later. Organize your boards into loads of interesting topics.</p>
<div class='img-topics'>
<figure id='education'>
<img src='assets/grey-book-reading-md.png'> <figcaption>Education</figcaption>
</figure>
<figure id='news'>
<img src='assets/gray-globe.png'>
<figcaption>Geography</figcaption>
</figure>
<figure id='environment'>
<img src='assets/bamboo.png'>
<figcaption>Environment </figcaption>
</figure>
<figure id='government'>
<img src='assets/capitol.png'> <figcaption>Government</figcaption>
</figure>
<figure id='mental health'>
<img src='assets/brain-blank-md.png'>
<figcaption>Mental Health</figcaption>
</figure>
<figure id='law'>
<img src='assets/gavel-md.png'>
<figcaption>Law</figcaption>
</figure>
<figure id='religion'>
<img src='assets/minarets.png'> <figcaption>Religion</figcaption>
</figure>
<figure id='society'>
<img src='assets/people-md.png'><figcaption>Society</figcaption>
</figure>
<figure id='news'>
<img src='assets/news.png'>
<figcaption>News</figcaption>
</figure>
<figure id='tech'>
<img src='assets/server.png'>
<figcaption>Tech</figcaption>
</figure>
</div>
</section>
<section class='feature dark add-remove'>
<img src='assets/pinterest-boards.png'>
<article>
<h2>Add, Remove, & Organize Articles</h2>
<p>Simply click Add Article, paste the url of the article you want to save, give it a title, and choose a research board to pin it to.</p>
<p>You can move articles to your other research boards with a simple drag and drop.</p>
</article>
</section>
<section class='feature search'>
<article>
<h2>Search Bar</h2>
<p>Can't remember what research board you pinned an article? No problem1 Simply search for the article title in the search bar. You can even find articles in other researcher's boards.</p>
</article>
<img id='img-search' src='assets/Pinterest-search.png'>
</section>
<section class='feature dark anywhere'>
<article>
<h2>Ready to Go, Wherever You Are</h2>
</article>
<img src='assets/devices.png'>
</section>
<section class='feature followers'>
<article>
<h2>Connect with Researchers Around the World</h2>
<p>Follow other Researchers and get updated when they update their research boards.</p>
</article>
<div class='image'>
<img src='assets/connect.jpg'>
</div>
</section>
<section class='feature dark testimonials'>
<blockquote class='quotes'>
<p>"I have always wanted to have an app where I can see my articles laid out in front of me."</p>
<cite>Amir Yunas - Researcher & Developer</cite>
</blockquote>
<blockquote class='quotes'>
<p>"I have always wanted to have an app where I can see my articles laid out in front of me."</p>
<cite>Amir Yunas - Researcher & Developer</cite>
</blockquote>
<blockquote class='quotes'>
<p>"I have always wanted to have an app where I can see my articles laid out in front of me."</p>
<cite>Amir Yunas - Researcher & Developer</cite>
</blockquote>
</section>
<section class='feature stats'>
<h2>Don't let reading overwhelm you. See it. Organize it with Pintereach</h2>
<div class='figures'>
<figure>
<img src='assets/GoogleSearch.png'>
<figcaption>Google Searches Per Day</figcaption>
<figcaption><strong>5.6 Billion</strong></figcaption>
</figure>
<figure>
<img src='assets/kindle.png'>
<figcaption>Kindle Books Read per Year</figcaption>
<figcaption><strong>266 Million</strong></figcaption>
</figure>
<figure>
<img src='assets/blog.jpg'>
<figcaption>Estimated # of Bloggers in 2020</figcaption>
<figcaption>31.7 Million</figcaption>
</figure>
<figure>
<img src='assets/books.jpg'>
<figcaption>Americans who read at least 1 book in 2018</figcaption>
<figcaption>76%</figcaption>
</figure>
</div>
</section>
<section class='feature dark collage'>
<article>
<h2>Visualize Your Research, All in One Spot</h2>
</article>
<img src='assets/e-book-collage.jpg'>
</section>
</div>
</div>
<footer>
<small>©Copyright 2019 <a href='http://fbuy.me/l8sfS' target='_blank'>Lambda School</a></small>
</footer>
</body>
</html>