[from now] 2014/10/03 16:08:31

diff --git a/Gemfile b/Gemfile
index a6fc5f7..211f3d4 100644
--- a/Gemfile
+++ b/Gemfile
@@ -1,6 +1,5 @@
 source 'https://rubygems.org'

-
 # Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
 gem 'rails', '4.1.6'
 # Use sqlite3 as the database for Active Record
@@ -12,7 +11,7 @@ gem 'uglifier', '>= 1.3.0'
 # Use CoffeeScript for .js.coffee assets and views
 gem 'coffee-rails', '~> 4.0.0'
 # See https://github.com/sstephenson/execjs#readme for more supported runtimes
-# gem 'therubyracer',  platforms: :ruby
+gem 'therubyracer',  platforms: :ruby

 # Use jquery as the JavaScript library
 gem 'jquery-rails'
@@ -26,6 +25,11 @@ gem 'sdoc', '~> 0.4.0',          group: :doc
 # Spring speeds up development by keeping your application running in the background. Read more: https://github.com/rails/spring
 gem 'spring',        group: :development

+# Groundwork-CSS
+gem 'autoprefixer-rails'
+gem 'compass-rails'
+gem 'groundworkcss'
+
 # Use ActiveModel has_secure_password
 # gem 'bcrypt', '~> 3.1.7'

diff --git a/Gemfile.lock b/Gemfile.lock
index 8255640..3e2935f 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -28,7 +28,10 @@ GEM
       thread_safe (~> 0.1)
       tzinfo (~> 1.1)
     arel (5.0.1.20140414130214)
+    autoprefixer-rails (3.1.0.20140911)
+      execjs
     builder (3.2.2)
+    chunky_png (1.3.1)
     coffee-rails (4.0.1)
       coffee-script (>= 2.2.0)
       railties (>= 4.0.0, < 5.0)
@@ -36,8 +39,24 @@ GEM
       coffee-script-source
       execjs
     coffee-script-source (1.8.0)
+    colorize (0.7.3)
+    compass (0.12.7)
+      chunky_png (~> 1.2)
+      fssm (>= 0.2.7)
+      sass (~> 3.2.19)
+    compass-rails (1.1.7)
+      compass (>= 0.12.2)
+      sprockets (<= 2.11.0)
     erubis (2.7.0)
     execjs (2.2.1)
+    fssm (0.2.10)
+    groundworkcss (2.3.5)
+      autoprefixer-rails
+      coffee-rails (>= 3.2.1)
+      colorize
+      compass-rails (~> 1)
+      jquery-rails
+      sass-rails (>= 3.2.3)
     hike (1.2.3)
     i18n (0.6.11)
     jbuilder (2.1.3)
@@ -47,6 +66,7 @@ GEM
       railties (>= 3.0, < 5.0)
       thor (>= 0.14, < 2.0)
     json (1.8.1)
+    libv8 (3.16.14.7)
     mail (2.6.1)
       mime-types (>= 1.16, < 3)
     mime-types (2.3)
@@ -73,6 +93,7 @@ GEM
     rake (10.3.2)
     rdoc (4.1.2)
       json (~> 1.4)
+    ref (1.0.5)
     sass (3.2.19)
     sass-rails (4.0.3)
       railties (>= 4.0.0, < 5.0)
@@ -93,6 +114,9 @@ GEM
       activesupport (>= 3.0)
       sprockets (~> 2.8)
     sqlite3 (1.3.9)
+    therubyracer (0.12.1)
+      libv8 (~> 3.16.14.0)
+      ref
     thor (0.19.1)
     thread_safe (0.3.4)
     tilt (1.4.1)
@@ -108,7 +132,10 @@ PLATFORMS
   ruby

 DEPENDENCIES
+  autoprefixer-rails
   coffee-rails (~> 4.0.0)
+  compass-rails
+  groundworkcss
   jbuilder (~> 2.0)
   jquery-rails
   rails (= 4.1.6)
@@ -116,5 +143,6 @@ DEPENDENCIES
   sdoc (~> 0.4.0)
   spring
   sqlite3
+  therubyracer
   turbolinks
   uglifier (>= 1.3.0)
[from now] 2014/10/03 16:22:57

diff --git a/app/assets/javascripts/home.js.coffee b/app/assets/javascripts/home.js.coffee
new file mode 100644
index 0000000..24f83d1
--- /dev/null
+++ b/app/assets/javascripts/home.js.coffee
@@ -0,0 +1,3 @@
+# Place all the behaviors and hooks related to the matching controller here.
+# All this logic will automatically be available in application.js.
+# You can use CoffeeScript in this file: http://coffeescript.org/
diff --git a/app/assets/stylesheets/home.css.scss b/app/assets/stylesheets/home.css.scss
new file mode 100644
index 0000000..f0ddc68
--- /dev/null
+++ b/app/assets/stylesheets/home.css.scss
@@ -0,0 +1,3 @@
+// Place all the styles related to the home controller here.
+// They will automatically be included in application.css.
+// You can use Sass (SCSS) here: http://sass-lang.com/
diff --git a/app/controllers/home_controller.rb b/app/controllers/home_controller.rb
new file mode 100644
index 0000000..95f2992
--- /dev/null
+++ b/app/controllers/home_controller.rb
@@ -0,0 +1,4 @@
+class HomeController < ApplicationController
+  def index
+  end
+end
diff --git a/app/helpers/home_helper.rb b/app/helpers/home_helper.rb
new file mode 100644
index 0000000..23de56a
--- /dev/null
+++ b/app/helpers/home_helper.rb
@@ -0,0 +1,2 @@
+module HomeHelper
+end
diff --git a/app/views/home/index.html.erb b/app/views/home/index.html.erb
new file mode 100644
index 0000000..2085730
--- /dev/null
+++ b/app/views/home/index.html.erb
@@ -0,0 +1,2 @@
+<h1>Home#index</h1>
+<p>Find me in app/views/home/index.html.erb</p>
diff --git a/config/routes.rb b/config/routes.rb
index 3f66539..4e252aa 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -3,7 +3,7 @@ Rails.application.routes.draw do
   # See how all your routes lay out with "rake routes".

   # You can have the root of your site routed with "root"
-  # root 'welcome#index'
+  root 'home#index'

   # Example of regular route:
   #   get 'products/:id' => 'catalog#view'
[from now] 2014/10/03 16:27:02

diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
index d6925fa..90972bb 100644
--- a/app/assets/javascripts/application.js
+++ b/app/assets/javascripts/application.js
@@ -12,5 +12,7 @@
 //
 //= require jquery
 //= require jquery_ujs
+//= require groundworkcss/libs/modernizr-2.6.2.min
+//= require groundworkcss/all
 //= require turbolinks
 //= require_tree .
diff --git a/app/assets/stylesheets/_groundwork_settings.scss b/app/assets/stylesheets/_groundwork_settings.scss
new file mode 100644
index 0000000..a87c7eb
--- /dev/null
+++ b/app/assets/stylesheets/_groundwork_settings.scss
@@ -0,0 +1,348 @@
+// =============================================
+//              Custom Settings
+//          Last Updated:2013-10-3
+// =============================================
+
+
+// =============================================
+//                  File Paths
+// =============================================
+
+// file paths
+$root_path:           "./";
+$images_path:         asset-path("images/");
+$fonts_path:          "groundworkcss/";
+$boxsizing_path:      asset-path("groundworkcss/libs/boxsizing.htc");
+$PIE_path:            asset-path("groundworkcss/libs/PIE.htc");
+
+// $oldIE:                     false; // enable polyfills for legacy IE
+
+// =============================================
+//                  Web Fonts
+// =============================================
+
+// $web-font-classes:          true;
+// $web-font-names:            "source-sans-pro"
+//                             "museo-slab"
+//                             "quicksand";
+// $web-font-files:            "sourcesanspro-regular-webfont"
+//                             "museo-slab-500-webfont"
+//                             "quicksand-regular-webfont";
+// $placeholder-fonts:         true;
+// $placeholderText-fallback:  true; // noscript fallback for placeholderText.js
+// $placeholder-font-classes:  true;
+// $placeholder-font-names:    "redacted"
+//                             "redacted-script"
+//                             "redacted-script-light"
+//                             "redacted-script-bold";
+// $placeholder-font-files:    "redacted-regular"
+//                             "redacted-script-regular"
+//                             "redacted-script-light"
+//                             "redacted-script-bold";
+
+// =============================================
+//                 Color Palette
+// =============================================
+
+// $white:                     #ffffff;
+// $black:                     #111111;
+
+// document
+// $background-color:          #ffffff;
+// $font-color:                #2b2b2d;
+
+// links
+// $link-color:                #489AC1;
+// $link-active:               #198D98;
+
+// selection highlight
+// $selection-color:           $link-color;
+// $selection-text:            #ffffff;
+
+// code
+// $code-text:                 #555555;
+// $code-background:           #ffffff;
+
+// borders
+// $border-thickness:          1px;
+// $border-style:              solid;
+// $border-color:              #dddddd;
+// $border:                    #{$border-thickness} #{$border-style} #{$border-color};
+
+// buttons
+// $button-color:              lighten(gray, 32.5%);
+// $button-text:               darken(gray, 15%);
+// $button-border-color:       lighten(gray, 27.5%);
+// $button-active:             lighten(gray, 27.5%);
+// $button-active-text:        darken(gray, 12%);
+
+// navigation
+// $nav-color:                 lighten(gray, 32.5%);
+// $nav-text:                  darken(gray, 15%);
+// $nav-border-color:          lighten(gray, 27.5%);
+// $nav-active:                lighten(gray, 27.5%);
+// $nav-active-text:           darken(gray, 12%);
+
+// tabs
+// $tab-color:                 lighten(gray, 32.5%);
+// $tab-text:                  darken(gray, 15%);
+// $tab-border-color:          lighten(gray, 22.5%);
+// $tab-active:                lighten(gray, 27.5%);
+// $tab-active-text:           darken(gray, 12%);
+// $tabpanel-background:       #ffffff;
+// $tabpanel-text:             #2b2b2d;
+
+// info
+// $info-color:                #3a87ad;
+// $info-text:                 #ffffff;
+// $info-background:           #d9edf7;
+// $info-border:               #bce8f1;
+
+// alert
+// $alert-color:               #c09853;
+// $alert-text:                #ffffff;
+// $alert-background:          #fcf8e3;
+// $alert-border:              #fbeee0;
+
+// error
+// $error-color:               #b94a48;
+// $error-text:                #ffffff;
+// $error-background:          #f2dede;
+// $error-border:              #eed3d7;
+
+// warning
+// $warning-color:             #FF971E;
+// $warning-text:              #ffffff;
+// $warning-background:        #FFE5C7;
+// $warning-border:            #FFDBB3;
+
+// success
+// $success-color:             #468847;
+// $success-text:              #ffffff;
+// $success-background:        #dff0d8;
+// $success-border:            #d6e9c6;
+
+// question
+// $question-color:            #9855b4;
+// $question-text:             #ffffff;
+// $question-background:       #f0e6f4;
+// $question-border:           #f1dbfa;
+
+// disabled
+// $disabled-color:            #808080;
+// $disabled-text:             #dddddd;
+// $disabled-background:       lighten($disabled-color, 20%);
+// $disabled-border:           darken($disabled-color, 10%);
+
+// modifier states
+// $state-name:                "info"       "alert"       "warning"       "error"       "success"       "question"       "disabled";
+// $state-code:                $info-color  $alert-color  $warning-color  $error-color  $success-color  $question-color  $disabled-color;
+// $state-text:                $info-text   $alert-text   $warning-text   $error-text   $success-text   $question-text   $disabled-text;
+
+// modifier colors
+// $yellow:                    #f1c40f;
+// $orange:                    #e67e22;
+// $red:                       #e74c3c;
+// $pink:                      #f02475;
+// $purple:                    #9b59b6;
+// $asphalt:                   #34495e;
+// $charcoal:                  #383636;
+// $blue:                      #3498db;
+// $turquoise:                 #1abc9c;
+// $green:                     #2ecc71;
+
+// $modifier-name:             "green"   "blue"   "purple"   "yellow"   "orange"   "red"   "pink"   "turquoise"   "asphalt"  "charcoal"  "white"   "black";
+// $modifier-code:             $green    $blue    $purple    $yellow    $orange    $red    $pink    $turquoise    $asphalt   $charcoal   $white    $black;
+// $modifier-text:             $white    $white   $white     $white     $white     $white  $white   $white        $white     $white      $black    $white;
+
+
+// =============================================
+//                 Grid System
+// =============================================
+
+// grid
+// $numerators:                "one"    "two"    "three"  "four"    "five"   "six"    "seven"    "eight"   "nine"   "ten"    "eleven"    "twelve";
+// $denominators:              "whole"  "half"   "third"  "fourth"  "fifth"  "sixth"  "seventh"  "eighth"  "ninth"  "tenth"  "eleventh"  "twelfth";
+// $denominators-plural:       "wholes" "halves" "thirds" "fourths" "fifths" "sixths" "sevenths" "eighths" "ninths" "tenths" "elevenths" "twelfths";
+// $grid-classes:              true;
+// $grid-adapter-classes:      true;
+// $grid-adapters:             $one-whole $one-half $one-third $one-fourth $one-fifth;
+// $grid-adapters-clearfix:    15;
+// $container-width:           1200px;
+// $gutter:                    10px;
+// $responsive:                true;
+
+
+// =============================================
+//                  Breakpoints
+// =============================================
+
+// breakpoints
+// $small-mobile:              "(max-width: 319px)";
+// $iphone:                    "(min-device-width: 320px) and (max-device-width: 480px)";
+// $iphone5:                   "(min-device-width: 320px) and (max-device-width: 568px)";
+// $mobile:                    "(max-width: 480px)";
+// $not-mobile:                "(min-width: 481px)";
+// $small-tablet:              "(max-width: 767px)";
+// $tablet:                    "(min-width: 768px)";
+// $ipad:                      "(min-width: 768px) and (max-width:1024px)";
+// $retina-ipad:               "(min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2)";
+// $not-desktop:               "(max-width: 1024px)";
+// $desktop:                   "(min-width: 1025px)";
+// $retina:                    "(-webkit-min-device-pixel-ratio: 2)";
+
+
+// =============================================
+//                   Flexbox
+// =============================================
+
+// flexible box layout
+// $flexbox-classes:           true; // enable output of flexbox classes
+// $flexbox-helpers:           "flex-wrapper" "flex-box" "vertical-center";
+
+
+// =============================================
+//                   Buttons
+// =============================================
+
+// $button-tags:               true;
+// $button-classes:            true;
+// $button-modifiers:          "small" "large" "on" "active" "square" "round" "block";
+// $button-states:             "on" "active" "selected" "pressed" "disabled" "info" "alert" "warning" "error" "success" "question";
+// $aria-selectors:            true;
+// $aria-states:               "selected" "pressed" "disabled" "readonly" "invalid";
+
+
+// =============================================
+//                  Animations
+// =============================================
+
+// dismissible message animation
+// $dismiss-animation:         "fadeOut";
+
+// animations
+// $bounce-animations:         true;
+// $fade-animations:           true;
+// $flash-animations:          true;
+// $flip-animations:           true;
+// $hinge-animations:          true;
+// $lightspeed-animations:     true;
+// $pulse-animations:          true;
+// $roll-animations:           true;
+// $rotate-animations:         true;
+// $shake-animations:          true;
+// $spin-animations:           true;
+// $spin-helpers:              "spin" "spin-once" "spin-twice" "spin-thrice"
+//                             "spin-fast" "spin-fast-once" "spin-fast-twice" "spin-fast-thrice"
+//                             "spin-slow" "spin-slow-once" "spin-slow-twice" "spin-slow-thrice";
+// $swing-animations:          true;
+// $tada-animations:           true;
+// $wiggle-animations:         true;
+// $wobble-animations:         true;
+
+
+// =============================================
+//                 Typography
+// =============================================
+
+// $type-tags:                 true;
+// $type-elements:             "h1" "h2" "h3" "h4" "h5" "h6" "p"
+//                             "ul" "ol" "dl"
+//                             "q" "blockquote" "cite"
+//                             "small" "big"
+//                             "b" "strong"
+//                             "em"
+//                             "sup" "sub"
+//                             "del" "strike"
+//                             "code" "pre";
+// $type-colors:               true;
+// $type-classes:              false;
+// $type-classnames:           "h1" "h2" "h3" "h4" "h5" "h6" "p"
+//                             "ul" "ol" "dl"
+//                             "q" "blockquote" "cite"
+//                             "small" "big" "large"
+//                             "b" "bold" "strong"
+//                             "em" "italic"
+//                             "sup" "sub"
+//                             "del" "strike"
+//                             "code" "pre"
+//                             "invalid" "valid"
+//                             "unstyled";
+// $quote-color:               $font-color;
+// $quote-background:          $border-color;
+// $quote-font:                "source-sans-pro";
+// $styled-lists:              true;
+// $multi-column-classes:      true;
+// $multi-column-names:        "one-column" "two-column" "three-column" "four-column" "five-column";
+// $ui-states:                 "info"  "alert" "warning" "error" "success" "question";
+// $ui-icons:                  "\f05a" "\f06a" "\f071"   "\f057" "\f058"   "\f059";
+// $ui-states-colors:          $info-color $alert-color $warning-color $error-color $success-color $question-color;
+// $ui-states-color-classes:   true;
+// $font-family:               Helvetica, Arial, Geneva, sans-serif;
+// $font-size:                 14px;
+// $line-height:               1.5;
+// $heading-line-height:       1.3;
+// $headings-font:             nth($web-font-names, 1);
+// $links-underlined:          false;
+// $links-active-underlined:   true;
+// $link-type-icons:           true;
+// $link-type-colors:          true;
+
+
+// =============================================
+//                     Misc
+// =============================================
+
+// $default-radius:            4px;
+
+
+// =============================================
+//                   Helpers
+// =============================================
+
+// helpers
+// $positioning-classes:       true;
+// $spacer-classes:            true;
+// $spacer-helpers:            "padded" "pad-top" "pad-right" "pad-bottom" "pad-left"
+//                             "gapped" "gap-top" "gap-right" "gap-bottom" "gap-left"
+//                             "offset" "offset-top" "offset-right" "offset-bottom" "offset-left";
+// $spacer-mod-classes:        true;
+// $spacer-modifiers:          "half" "double" "triple";
+// $size-classes:              true;
+// $size-helpers:              "small" "medium" "large";
+// $layout-classes:            true;
+// $layout-helpers:            "inline" "inline-block" "block"
+//                             "hidden"
+//                             "zero"
+//                             "pull-right" "pull-left" "pull-none" "clear"
+//                             "center";
+// $typography-classes:        true;
+// $typography-helpers:        "align-top" "align-right" "align-bottom" "align-left" "align-center" "justify"
+//                             "truncate" "unstyled";
+// $border-classes:            true;
+// $border-helpers:            "bordered" "border-right" "border-left" "border-top" "border-bottom";
+// $radius-classes:            true;
+// $radius-helpers:            "square" "round";
+// $rotation-classes:          true;
+// $rotation-helpers:          "rotate-90" "rotate-90-ctr" "rotate-180" "rotate-180-ctr" "rotate-270" "rotate-270-ctr" "rotate-360" "rotate-360-ctr";
+// $transition-classes:        true;
+
+// =============================================
+//                  CSS Reset
+// =============================================
+
+// reset
+// $global-tags:               true;
+// $reset:                     true;
+// $reset-elements:            "html" "body"
+//                             "div" "span" "header" "footer" "aside" "nav" "menu" "main" "section" "article" "details"
+//                             "h1" "h2" "h3" "h4" "h5" "h6" "p"
+//                             "ol" "ul" "li" "dl" "dt" "dd"
+//                             "em" "small" "big" "strong" "b" "u" "i" "sub" "sup" "del" "strike"
+//                             "q" "blockquote" "cite"
+//                             "time" "address"
+//                             "code" "pre"
+//                             "a" "img" "center" "hr"
+//                             "form" "fieldset" "legend" "label" "input" "textarea" "button"
+//                             "table" "caption" "tbody" "thead" "tfoot" "tr" "th" "td"
+//                             "iframe" "object" "canvas" "audio" "video" "embed";
diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
deleted file mode 100644
index a443db3..0000000
--- a/app/assets/stylesheets/application.css
+++ /dev/null
@@ -1,15 +0,0 @@
-/*
- * This is a manifest file that'll be compiled into application.css, which will include all the files
- * listed below.
- *
- * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
- * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
- *
- * You're free to add application-wide styles to this file and they'll appear at the bottom of the
- * compiled file so the styles you add here take precedence over styles defined in any styles
- * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
- * file per style scope.
- *
- *= require_tree .
- *= require_self
- */
diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss
new file mode 100644
index 0000000..b56343c
--- /dev/null
+++ b/app/assets/stylesheets/application.css.scss
@@ -0,0 +1,17 @@
+/*
+ * This is a manifest file that'll be compiled into application.css, which will include all the files
+ * listed below.
+ *
+ * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
+ * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
+ *
+ * You're free to add application-wide styles to this file and they'll appear at the bottom of the
+ * compiled file so the styles you add here take precedence over styles defined in any styles
+ * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
+ * file per style scope.
+ *
+ *= require_tree .
+ *= require_self
+ */
+@import 'groundwork_settings';
+@import 'groundworkcss/groundwork';
[from now] 2014/10/03 17:41:36

diff --git a/Gemfile b/Gemfile
index 211f3d4..d22c3d1 100644
--- a/Gemfile
+++ b/Gemfile
@@ -42,3 +42,6 @@ gem 'groundworkcss'
 # Use debugger
 # gem 'debugger', group: [:development, :test]

+group :development do
+  gem 'better_errors'
+end
[from now] 2014/10/03 17:42:30

diff --git a/Gemfile.lock b/Gemfile.lock
index 3e2935f..61b33ae 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -30,8 +30,13 @@ GEM
     arel (5.0.1.20140414130214)
     autoprefixer-rails (3.1.0.20140911)
       execjs
+    better_errors (2.0.0)
+      coderay (>= 1.0.0)
+      erubis (>= 2.6.6)
+      rack (>= 0.9.0)
     builder (3.2.2)
     chunky_png (1.3.1)
+    coderay (1.1.0)
     coffee-rails (4.0.1)
       coffee-script (>= 2.2.0)
       railties (>= 4.0.0, < 5.0)
@@ -133,6 +138,7 @@ PLATFORMS

 DEPENDENCIES
   autoprefixer-rails
+  better_errors
   coffee-rails (~> 4.0.0)
   compass-rails
   groundworkcss