otakuhub/views/pages/home.html.php

<?php
$this->styles($this->html->style("/css/home.css"));
?>

<h1>The Otaku Social Network</h1>
<a href="/users/signup">Sign up!</a>
<svg height="0">
	<mask id="scrollmask" maskUnits="objectBoundingBox" maskContentUnits="objectBoundingBox">
		<linearGradient id="g" gradientUnits="objectBoundingBox" x2="1" y2="0">
			<stop stop-color="white" stop-opacity="0" offset="0"/>
			<stop stop-color="white" stop-opacity="1" offset="0.03"/>
			<stop stop-color="white" stop-opacity="1" offset="0.89"/>
			<stop stop-color="white" stop-opacity="0" offset="1"/>
		</linearGradient>
		<rect x="0.0" y="0.0" width="1.0" height="1.0" fill="url(#g)"/>
	</mask>
</svg>
<a class="prev browse left"></a>
<div id="scrollwrapper" style="mask: url(#scrollmask)">
	<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>
</div>
<a class="next browse right"></a>

<h2 class="ribbon">Why you'll &#9825; OtakuHub~</h2>
<div class="triangle-ribbon"></div>
<br class="cl" />
<h3>For Us By Us</h3>
<p>
	Built by Otakus for Otakus, we know what you want, and we work tirelessly to give it to you.
</p>
<h3>Data Portability</h3>
<p>
	Move your data between AnimePlanet AnimeDB or MAL or export your list for your own records
</p>
<h3>Meet others</h3>
<p>
	Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
<br class="cl" />

<?php ob_start(); ?>
<script type="text/javascript">
$(document).ready(function() {
	$(".scrollable").scrollable();
});
</script>
<?php $this->scripts(ob_get_clean()); ?>