Started restyling skeleton application

Author: Ben Tadiar

app/views/base.html.php

@@ -8,6 +8,7 @@
 
         <!-- CSS Stuff -->
         <link href="<?=$view['assets']->getUrl('components/bootstrap/dist/css/bootstrap.min.css');?>" rel="stylesheet">
+        <link href="<?=$view['assets']->getUrl('components/fontawesome/css/font-awesome.css');?>" rel="stylesheet">
         <link href="<?=$view['assets']->getUrl('css/main.css');?>" rel="stylesheet">
         <link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,600" rel="stylesheet" type="text/css">
         <?php $view['slots']->output('include_css'); ?>
@@ -31,6 +32,7 @@
         </div>
         <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
         <script>window.jQuery || document.write('<script src="<?=$view['assets']->getUrl('components/jquery/dist/jquery.min.js');?>"><\/script>')</script>
+        <script src="<?=$view['assets']->getUrl('components/jquery-ui/jquery-ui.js');?>"></script>
         <script src="<?=$view['assets']->getUrl('components/bootstrap/dist/js/bootstrap.min.js');?>"></script>
         <?php $view['slots']->output('include_js_body'); ?>
     </body>

bower.json

@@ -2,7 +2,9 @@
     "name": "ppi/skeletonapp",
     "dependencies": {
         "bootstrap": "3.3.2",
-        "modernizr": "2.8.3"
+        "modernizr": "2.8.3",
+        "fontawesome": "4.3.0",
+        "jquery-ui": "1.11.4"
     },
     "private": true
 }

modules/Application/resources/views/index/index.html.php

@@ -1,11 +1,16 @@
 <?php $view->extend('::base.html.php'); ?>
 
+<?php $view['slots']->start('include_js_body'); ?>
+    <script src="<?=$view['assets']->getUrl('js/home.js');?>"></script>
+<?php $view['slots']->stop(); ?>
+
 <div id="landing">
     <div class="landing-wrapper">
         <img src="<?=$view['assets']->getUrl('modules/framework/images/ppi-logo-white.png'); ?>" />
         <div class="buttons">
             <a href="http://ppi.readthedocs.org/en/2.1/" target="_blank">Read the Docs</a><!--
-            --><a href="https://github.com/ppi/framework" target="_blank">Discover on GitHub</a>
+            --><a href="https://github.com/ppi/framework" target="_blank">Discover on GitHub</a><!--
+            --><a class="find-out-more" href="#landing-two">Find out More <i class="fa fa-fw fa-caret-down"></i></a>
         </div>
     </div>
 </div>

public/css/main.css

@@ -49,8 +49,15 @@ h3 {
     border:1px solid #303030;
     outline:none;
 }
+#landing .landing-wrapper .buttons a {
+    margin-left:5px;
+}
 #landing .landing-wrapper .buttons a:first-child {
-    margin-right:5px;
+    margin-left:0;
+}
+#landing .landing-wrapper .buttons a:last-child {
+    background:#202020;
+    border-color:#161616;
 }
 
 .list-container {

public/js/home.js

@@ -1,5 +1,8 @@
-jQuery(document).ready(function($) {
-	
-	$('.flashes .alert').alert();
-	
+$(document).ready(function($) {
+    $('.find-out-more').on('click', function(event){
+        event.preventDefault();
+        $('html, body').animate({
+            scrollTop: $('#landing-two').position().top
+        }, 1500, 'easeInOutCubic');
+    });
 });