layout and routes ready

Gemfile

@@ -2,6 +2,7 @@ source 'https://rubygems.org'
 
 
 gem 'rails', '4.2.1'
+gem 'bootstrap-sass', :git => 'https://github.com/twbs/bootstrap-sass.git', :branch => 'next'
 gem 'sass-rails', '~> 5.0'
 gem 'uglifier', '>= 1.3.0'
 gem 'coffee-rails', '~> 4.1.0'

Gemfile.lock

@@ -1,3 +1,12 @@
+GIT
+  remote: https://github.com/twbs/bootstrap-sass.git
+  revision: 488c8b35ec0b84abc16f05ec7b2de21c79c9ec2c
+  branch: next
+  specs:
+    bootstrap-sass (3.3.4.1)
+      autoprefixer-rails (>= 5.0.0.1)
+      sass (>= 3.2.19)
+
 GEM
   remote: https://rubygems.org/
   specs:
@@ -38,6 +47,9 @@ GEM
       tzinfo (~> 1.1)
     ansi (1.5.0)
     arel (6.0.0)
+    autoprefixer-rails (5.1.11)
+      execjs
+      json
     binding_of_caller (0.7.2)
       debug_inspector (>= 0.0.1)
     builder (3.2.2)
@@ -196,6 +208,7 @@ PLATFORMS
   ruby
 
 DEPENDENCIES
+  bootstrap-sass!
   byebug
   coffee-rails (~> 4.1.0)
   guard-minitest (= 2.3.1)

app/assets/javascripts/users.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/

app/assets/stylesheets/custom.css.scss

@@ -0,0 +1,115 @@
+@import "bootstrap-sprockets";
+@import "bootstrap";
+
+/* variables */
+
+$gray-medium-light: #eaeaea;
+
+/* universal */
+
+body {
+  padding-top: 60px;
+}
+
+section {
+  overflow: auto;
+}
+
+textarea {
+  resize: vertical;
+}
+
+.center {
+  text-align: center;
+  h1 {
+    margin-bottom: 10px;
+  }
+}
+
+/* typography */
+
+h1, h2, h3, h4, h5, h6 {
+  line-height: 1;
+}
+
+h1 {
+  font-size: 3em;
+  letter-spacing: -2px;
+  margin-bottom: 30px;
+  text-align: center;
+}
+
+h2 {
+  font-size: 1.2em;
+  letter-spacing: -1px;
+  margin-bottom: 30px;
+  text-align: center;
+  font-weight: normal;
+  color: $gray-light;
+}
+
+p {
+  font-size: 1.1em;
+  line-height: 1.7em;
+}
+
+/* header */
+
+#logo {
+  float: left;
+  margin-right: 10px;
+  font-size: 1.7em;
+  color: #fff;
+  text-transform: uppercase;
+  letter-spacing: -1px;
+  padding-top: 9px;
+  font-weight: bold;
+  &:hover {
+    color: #fff;
+    text-decoration: none;
+  }
+}
+
+/* footer */
+
+footer {
+  margin-top: 45px;
+  padding-top: 5px;
+  border-top: 1px solid $gray-medium-light;
+  color: $gray-light;
+
+  a {
+    color: $gray;
+    &:hover {
+      color: $gray-darker;
+    }
+  }
+
+  small {
+    float: left;
+  }
+
+  ul {
+    float: right;
+    list-style: none;
+    li {
+      float: left;
+      margin-left: 15px;
+    }
+  }
+}
+
+
+footer small {
+  float: left;
+}
+
+footer ul {
+  float: right;
+  list-style: none;
+}
+
+footer ul li {
+  float: left;
+  margin-left: 15px;
+}

app/assets/stylesheets/users.scss

@@ -0,0 +1,3 @@
+// Place all the styles related to the Users controller here.
+// They will automatically be included in application.css.
+// You can use Sass (SCSS) here: http://sass-lang.com/

app/controllers/users_controller.rb

@@ -0,0 +1,4 @@
+class UsersController < ApplicationController
+  def new
+  end
+end

app/helpers/users_helper.rb

@@ -0,0 +1,2 @@
+module UsersHelper
+end

app/views/layouts/_footer.html.erb

@@ -0,0 +1,13 @@
+<footer class="footer">
+  <small>
+    The <a href="http://www.railstutorial.org/">Ruby on Rails Tutorial</a>
+    by <a href="http://www.michaelhartl.com/">Michael Hartl</a>
+  </small>
+  <nav>
+    <ul>
+      <li><%= link_to "About", about_path %></li>
+      <li><%= link_to "Contact", contact_path %></li> 
+      <li><a href="http://news.railstutorial.org/">News</a></li> 
+    </ul>
+  </nav>
+</footer>

app/views/layouts/_header.html.erb

@@ -0,0 +1,12 @@
+<header class="navbar navbar-fixed-top navbar-inverse">
+<div class="container">
+  <%= link_to "sample app", root_path, id: "logo" %> 
+  <nav>
+    <ul class="nav navbar-nav navbar-right"> 
+      <li><%= link_to "Home", root_path %></li> 
+      <li><%= link_to "Help", help_path %></li> 
+      <li><%= link_to "Log in", '#' %></li>
+    </ul> 
+  </nav>
+</div>
+</header>

app/views/layouts/_shim.html.erb

@@ -0,0 +1,4 @@
+<!--[if lt IE 9]>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/r29/html5.min.js">
+  </script>
+<![endif]-->

app/views/layouts/application.html.erb

@@ -5,10 +5,13 @@
     <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
     <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
     <%= csrf_meta_tags %>
+    <%= render 'layouts/shim' %>
   </head>
   <body>
-
-    <%= yield %>
-
+    <%= render 'layouts/header' %>
+    <div class="container">
+      <%= yield %>
+      <%= render 'layouts/footer' %>
+    </div>
   </body>
 </html>

app/views/static_pages/home.html.erb

@@ -1,2 +1,14 @@
-<h1>Sample app</h1>
-<p>This is the home page we don't know what is yet to come</p>
+<div class="center jumbotron">
+  <h1>Welcome to the Sample App</h1> 
+
+  <h2>
+    This is the home page for the
+    <a href="http://www.railstutorial.org/">Ruby on Rails Tutorial</a>
+    sample application.
+  </h2>
+
+  <%= link_to "Sign up now!", signup_path, class: "btn btn-lg btn-primary" %>
+</div>
+
+<%= link_to image_tag("rails.png", alt: "Rails logo"),
+                      'http://rubyonrails.org/' %>

app/views/users/new.html.erb

@@ -0,0 +1,5 @@
+<% provide(:title, 'Sign up') %>
+
+<h1>Sign Up</h1>
+
+<p>This will be the page where users sign up</p>

config/routes.rb

@@ -1,8 +1,11 @@
 Rails.application.routes.draw do
+  get 'users/new'
+
   root 'static_pages#home'
-  get 'static_pages/help'
-  get 'static_pages/about'
-  get 'static_pages/contact'
+  get 'help' => 'static_pages#help'
+  get 'about' => 'static_pages#about'
+  get 'contact' => 'static_pages#contact'
+  get 'signup' => 'users#new'
 
   # The priority is based upon order of creation: first created -> highest priority.
   # See how all your routes lay out with "rake routes".

test/controllers/users_controller_test.rb

@@ -0,0 +1,9 @@
+require 'test_helper'
+
+class UsersControllerTest < ActionController::TestCase
+  test "should get new" do
+    get :new
+    assert_response :success
+  end
+
+end

test/integration/site_layout_test.rb

@@ -0,0 +1,13 @@
+require 'test_helper'
+
+class SiteLayoutTest < ActionDispatch::IntegrationTest
+
+  test "layout links" do
+    get root_path
+    assert_template 'static_pages/home'
+    assert_select "a[href=?]", root_path, count: 2
+    assert_select "a[href=?]", help_path
+    assert_select "a[href=?]", about_path
+    assert_select "a[href=?]", contact_path
+  end
+end