diff options
-rw-r--r-- | views/pages/home.html.php | 120 | ||||
-rw-r--r-- | views/users/signup.html.php | 25 | ||||
-rw-r--r-- | webroot/css/base.css | 112 | ||||
-rw-r--r-- | webroot/img/scrollable/10737.jpg | bin | 0 -> 59577 bytes | |||
-rw-r--r-- | webroot/img/scrollable/12018.jpg | bin | 0 -> 44981 bytes | |||
-rw-r--r-- | webroot/img/scrollable/45297.jpg | bin | 0 -> 97802 bytes |
6 files changed, 120 insertions, 137 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 ♡ 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" /> diff --git a/views/users/signup.html.php b/views/users/signup.html.php index 4112bdd..920827a 100644 --- a/views/users/signup.html.php +++ b/views/users/signup.html.php @@ -11,4 +11,27 @@ Confirmation Link: <a href="<?=$link ?>/<?=$key->key ?>"> Link </a> <?=$this->form->field('email'); ?> <?=$this->form->submit('Signup!'); ?> <?=$this->form->end(); ?> -<?php endif; ?>
\ No newline at end of file +<?php endif; ?> + +<!-- + <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> + </div> +--> diff --git a/webroot/css/base.css b/webroot/css/base.css index 399b770..5a2cb29 100644 --- a/webroot/css/base.css +++ b/webroot/css/base.css @@ -2,10 +2,10 @@ a:hover { text-decoration:none; } h1 { - font-weight:bold; - font-size:220%; - float:left; - margin-top:5px; + font-weight: bold; + font-size: 220%; + float: left; + margin-top: 5px; } h2 { font-size:200%; @@ -36,10 +36,6 @@ h2.ribbon { z-index: -1; } -#recent { - float: left; - width: 560px; -} #signup { float: right; text-align: center; @@ -214,6 +210,7 @@ nav a { font-size:113%; -webkit-border-radius: 3px; -moz-border-radius: 3px; + border-radius: 3px; } nav a:hover { background: #000; @@ -465,53 +462,55 @@ dl.definition dd { margin-right:10px; } - +#scrollwrapper { + padding: 15px; + border: 1px solid #ccc; + float: left; + margin: 15px 32px; + -moz-border-radius: 3px; + -webkit-border-radius: 3px; + border-radius: 3px; +} .scrollable { - height:110px; - overflow:hidden; - position:relative; - width:100%; + height: 330px; + overflow: hidden; + position: relative; + width: 800px; + float: left; } .scrollable .items { - clear:both; - position:absolute; - width:20000em; + clear: both; + position: absolute; + width: 20000em; } .items div { - float:left; - width:740pxpx; + float: left; + width: 740px; } .scrollable img { - -moz-border-radius:4px 4px 4px 4px; - background-color:#FFFFFF; - border:1px solid #CCCCCC; - float:left; - height:100px; - margin:0 4px 0 35px; - padding:2px; - width:100px; + -moz-border-radius: 4px; + -webkit-border-radius: 4px; + border-radius: 4px; + background-color: #fff; + border: 1px solid #ccc; + float: left; + height: 300px; } .scrollable .active { - border:2px solid #000000; - cursor:default; - position:relative; -} -/* this makes it possible to add next button beside scrollable */ -.scrollable { - float:left; + border: 2px solid #000; + cursor: default; + position: relative; } -/* prev, next, prevPage and nextPage buttons */ a.browse { - background:url(../img/scrollable.png) no-repeat; - display:block; - width:30px; - height:30px; - margin:40px 10px; - cursor:pointer; - font-size:1px; - position:absolute; + background: url(../img/scrollable.png) no-repeat; + display: block; + width: 30px; + height: 30px; + margin: 150px 10px; + cursor: pointer; + font-size: 1px; + position: absolute; } -/* right */ a.right { background-position: 0 -30px; clear:right; @@ -524,7 +523,6 @@ a.right:hover { a.right:active { background-position:-60px -30px; } -/* left */ a.left { margin-left: 0px; left:25px; @@ -535,32 +533,8 @@ a.left:hover { a.left:active { background-position:-60px 0; } -/* up and down */ -a.up, a.down { - background:url(../img/scrollable/arrow/vert_large.png) no-repeat; - float: none; - margin: 10px 50px; -} -/* up */ -a.up:hover { - background-position:-30px 0; -} -a.up:active { - background-position:-60px 0; -} -/* down */ -a.down { - background-position: 0 -30px; -} -a.down:hover { - background-position:-30px -30px; -} -a.down:active { - background-position:-60px -30px; -} -/* disabled navigational button */ a.disabled { - visibility:hidden !important; + visibility: hidden !important; } .search { diff --git a/webroot/img/scrollable/10737.jpg b/webroot/img/scrollable/10737.jpg Binary files differnew file mode 100644 index 0000000..97f1ec4 --- /dev/null +++ b/webroot/img/scrollable/10737.jpg diff --git a/webroot/img/scrollable/12018.jpg b/webroot/img/scrollable/12018.jpg Binary files differnew file mode 100644 index 0000000..e71268d --- /dev/null +++ b/webroot/img/scrollable/12018.jpg diff --git a/webroot/img/scrollable/45297.jpg b/webroot/img/scrollable/45297.jpg Binary files differnew file mode 100644 index 0000000..9458c06 --- /dev/null +++ b/webroot/img/scrollable/45297.jpg |