preliminary redesign of stuff above the fold

1 files changed, 53 insertions, 67 deletions

diff --git a/views/pages/home.html.php b/views/pages/home.html.php
index beacbec..46d96cb 100644
--- a/views/pages/home.html.php
+++ b/views/pages/home.html.php
@@ -1,29 +1,57 @@
-<div>
-	<div id="recent">
-		<h2>The Otaku Social Network</h2>
-		<h3>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
-		eiusmod tempor incididunt ut labore et dolore magna aliqua.</h3>
-	</div>
-	<div id="signup">
-		<h2>Sign up:</h2>
-		<form method="post" action="/users/signup">
-			<table>
-				<tr>
-					<td><label for="username">Username</label></td>
-					<td><input type="text" name="username" id="username">
-				</tr>
-				<tr>
-					<td><label for="password">Password</label></td>
-					<td><input type="password" id="password" name="password"></td>
-				</tr>
-				<tr>
-					<td><label for="email">Email</label></td>
-					<td><input type="text" id="email" name="email"></td>
-				</tr>
-			</table>
-			<input class="button green" type="submit" value="Sign up">
-		</form>
+<h1>The Otaku Social Network</h1>
+<a href="/users/signup">Sign up!</a>
+<div id="scrollwrapper">
+	<a class="prev browse left"></a>
+	<div id="browsable" class="scrollable">
+		<div class="items">
+			<div>
+				<img src="/img/scrollable/10737.jpg" alt="" />
+	Donec ligula lorem, blandit luctus hendrerit eu, sodales a tellus. Praesent
+	condimentum tincidunt auctor. Sed adipiscing lorem in erat lobortis fermentum.
+	Vivamus leo tellus, commodo sit amet rutrum et, pretium nec dui. Aliquam mi
+	erat, tempus eget ullamcorper eu, semper vitae nisi. Quisque ut viverra ipsum.
+	Nulla ac arcu in nisi eleifend mollis. Cras elementum, quam eget dapibus
+	auctor, ipsum nisi suscipit massa, vitae congue massa metus at enim. Cras ac
+	orci purus, nec malesuada nibh. Class aptent taciti sociosqu ad litora torquent
+	per conubia nostra, per inceptos himenaeos. Phasellus commodo felis elementum
+	dolor hendrerit non sollicitudin sem dignissim. Sed mi velit, malesuada vel
+	suscipit vel, tempor eu tellus.
+			</div>
+			<div>
+				<img src="/img/scrollable/45297.jpg" alt="" />
+	Quisque vulputate pretium eros eu elementum. Vestibulum massa purus, aliquet
+	sit amet cursus id, vehicula ac risus. Praesent dapibus congue feugiat. Ut
+	sagittis, arcu sed placerat consequat, felis sapien suscipit erat, tincidunt
+	adipiscing nulla dolor non tortor. Vivamus placerat lobortis congue. Quisque id
+	augue diam, non auctor eros. Sed nec lacus nec nulla vulputate euismod quis
+	quis felis. Sed sollicitudin adipiscing nibh, eu malesuada sem vehicula vitae.
+	Vivamus at tellus ac libero lobortis placerat. Nulla rhoncus iaculis odio, quis
+	cursus odio consequat non. Donec vel orci in nunc tristique congue sit amet sit
+	amet erat. In vitae lectus dolor, eu varius ligula. Nulla sollicitudin lacus
+	eget leo luctus malesuada. Etiam et scelerisque metus. Nullam id ante a lacus
+	commodo mollis sed non neque. Nullam condimentum magna ac tortor ultricies nec
+	tempus urna accumsan. Phasellus pulvinar, ligula et viverra tincidunt, risus
+	nunc iaculis tortor, a accumsan massa mi at libero.
+			</div>
+			<div>
+				<img src="/img/scrollable/12018.jpg" alt="" />
+	Ut non tortor justo. Phasellus non leo sit amet justo gravida tempor. Donec
+	sollicitudin enim nec neque aliquet aliquam. Praesent sollicitudin, odio vitae
+	blandit euismod, arcu nisi eleifend ante, nec tempor quam lorem ut ipsum. Cras
+	porta faucibus imperdiet. Integer ante sem, vestibulum in bibendum ut, pretium
+	in tortor. Praesent rhoncus, libero a luctus gravida, diam risus dignissim
+	nibh, vel luctus urna lectus sed orci. Duis non lorem vitae ipsum euismod
+	rutrum eget at lorem. Cras luctus dui eu nisl bibendum aliquam. Curabitur
+	eleifend sodales purus eu convallis. Aliquam tempor enim dictum lacus
+	vestibulum congue. Fusce ultricies volutpat metus in lobortis. Nam et diam
+	eros, non sagittis ante. Nulla facilisi. Integer nec leo est. Proin metus enim,
+	porttitor vitae euismod sit amet, tempor ut ligula. Nam leo dolor, sodales non
+	suscipit ut, consectetur sit amet ante. Nunc sagittis neque sit amet est
+	blandit vel facilisis metus commodo.
+			</div>
+		</div>
 	</div>
+	<a class="next browse right"></a>
 </div>
 
 <h2 class="ribbon">Why you'll &#9825; OtakuHub~</h2>
@@ -42,45 +70,3 @@
 	Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
 </p>
 <br class="cl" />
-
-<!-- "previous page" action -->
-<a class="prev browse left"></a>
-<div id="browsable" class="scrollable">   
-   
-   <!-- root element for the items -->
-   <div class="items">
-   
-      <!-- 1-5 -->
-      <div>
-         <img src="/img/screenshots/buttons.jpg" height="100" width="100" alt="" />
-            <img src="/img/screenshots/gallery.jpg" height="100" width="100" alt="" />
-            <img src="/img/screenshots/calendars.jpg" height="100" width="100" alt="" />
-            <img src="/img/screenshots/charts.jpg" height="100" width="100" alt="" />
-            <img src="/img/screenshots/coding.jpg" height="100" width="100" alt="" />
-      </div>
-      
-      <!-- 5-10 -->
-      <div>
-         <img src="/img/screenshots/docs.jpg" height="100" width="100" alt="" />
-            <img src="/img/screenshots/forms.jpg" height="100" width="100" alt="" />
-            <img src="/img/screenshots/gallery.jpg" height="100" width="100" alt="" />
-            <img src="/img/screenshots/notifications.jpg" height="100" width="100" alt="" />
-            <img src="/img/screenshots/pagination.jpg" height="100" width="100" alt="" />
-      </div>
-      
-      <!-- 10-15 -->
-      <div>
-         <img src="/img/screenshots/psd.jpg" height="100" width="100" alt="" />
-            <img src="/img/screenshots/switches.jpg" height="100" width="100" alt="" />
-            <img src="/img/screenshots/tabs.jpg" height="100" width="100" alt="" />
-            <img src="/img/screenshots/themes.jpg" height="100" width="100" alt="" />
-            <img src="/img/screenshots/tips.jpg" height="100" width="100" alt="" />
-      </div>
-      
-   </div>
-   
-</div>
-<!-- "next page" action -->
-<a class="next browse right"></a>
-
-<br class="cl" />