Playing around...

app/assets/stylesheets/layouts/_default.scss

@@ -14,7 +14,7 @@ body {
 }
 
 section {
-  @extend .col-sm-12, .col-md-8, .col-lg-8;
+  @extend .col-sm-12, .col-md-12, .col-lg-12;
 }
 
 a,
@@ -135,3 +135,30 @@ ul {
   float: left;
   margin: 5px 20px 15px 0px;
 }
+
+.container .jumbotron, .container-fluid .jumbotron {
+  padding: 10px 30px;
+  background-color: $bg;
+  margin: 0 auto 2rem;
+
+  h1 {
+    font-weight: normal;
+    line-height: 3.4rem;
+    font-size: 3.2rem;
+    letter-spacing: -1px;
+    color: black;
+    margin-bottom: 0.5rem;
+    padding: 0.1em 0;
+  }
+
+  p, li {
+    line-height: 2.3rem;
+    font-size: 2rem;
+    color: #000;
+  }
+
+  .btn {
+    background-color: #cc0000;
+    border-color: #ff9999;
+  }
+}

app/assets/stylesheets/layouts/_variables.scss

@@ -6,15 +6,16 @@ $main-secondary: lighten($main, 10%);
 $main-highlight: lighten($main, 40%);
 
 $header-title-color: #ffffff;
-$header-bg-color: #cc0100;
-$navbar-text-color: #ffffff;
-$navbar-bg-color: #95040b;
-$navbar-bg-highlight-color: #2c3230;
+$header-bg-color: #ffffff;
+$navbar-text-color: #cc0000;
+$navbar-text-hover-color: #000;
+$navbar-bg-color: #ffffff;
+$navbar-bg-highlight-color: #ffffff;
 $footer-text-color: #ffffff;
 $footer-bg-color: #2c3230;
 
-$links: $header-bg-color;
-$links-hover: $navbar-bg-color;
+$links: $navbar-text-color;
+$links-hover: $navbar-text-hover-color;
 
 // FONTS
 $main-font: 'Lora', Helvetica, serif;

app/assets/stylesheets/modules/_header.scss

@@ -24,4 +24,14 @@ header {
   .navbar-toggle:hover {
     background-color: transparent;
   }
+
+  .navbar-brand {
+    padding: 0px;
+
+  }
+  .navbar-brand>img {
+    height: 100%;
+    padding: 10px;
+    width: auto;
+  }
 }

app/assets/stylesheets/modules/_navigation.scss

@@ -2,11 +2,14 @@
   background-color: $navbar-bg-color;
   color: $navbar-text-color;
   font-family: $secondary-font;
+  font-weight: bold;
   text-transform: uppercase;
+  text-decoration: underline;
   letter-spacing: 0.1em;
 
   &:hover {
-    color: $navbar-text-color;
+    color: $navbar-text-hover-color;
+    text-decoration: underline;
     background-color: $navbar-bg-highlight-color;
   }
 }
@@ -19,3 +22,10 @@
 .navbar {
   margin: 0 $padding;
 }
+
+.navbar-brand,
+.navbar-nav li a {
+  line-height: 130px;
+  height: 130px;
+  padding-top: 0;
+}

app/views/home/index.html.erb

@@ -1 +1,18 @@
+<div class="jumbotron">
+    <h1>Montreal's Ruby Community</h1>
+    <p>
+      Montreal.rb is a community group of Montreal-based Ruby and Ruby on Rails developers.
+      It's aim is to help support local developers by creating a thriving forum for learning and discussion, and also just spread the RoR good word.
+      We are providing the community with a wide range of events and activities, such as:
+      <ul>
+        <li><strong>Monthly meetups</strong>, balancing talks catering to a beginner, intermediate and expert audience</li>
+        <li><strong>Workshops</strong>, where we get together around a practical subject and hack away</li>
+        <li><strong>Railsbridge</strong>, where we promote and democratize software development using Ruby</li>
+      </ul
+    </p>
+
+    <p><a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a></p>
+</div>
+
+<hr>
 <%= render template: 'events/index' %>

app/views/layouts/_header.html.erb

@@ -7,9 +7,8 @@
           <%= icon('bars', class: 'fa-2x') %>
         </button>
 
-        <%= link_to root_path do %>
-          <h1>Montreal.rb</h1>
-          <p class="hidden-sm hidden-xs">Montreal's Ruby Community</p>
+        <%= link_to root_path, class: 'navbar-brand' do %>
+          <%= image_tag 'montreal-rb.png', alt: 'Montreal.rb' %>
         <% end %>
       </div>
 

app/views/layouts/application.html.erb

@@ -23,12 +23,7 @@
           <%= yield %>
         </section>
 
-        <aside>
-          <%= render template: 'news_items/index' %>
-        </aside>
-
       </main>
-
     </div>
   </div>
   <%= render 'layouts/footer' %>