Merge pull request #4 from Galvanize-IT/master

Fix code formatting issues on homepage

README.md

@@ -13,13 +13,13 @@
 	$ bundle install
 	```
 
-1. Run the Middleman Blog and visit in your browser to make sure it works
+1. Run the Middleman Blog
 
 	```
 	$ middleman
 	```
 
-To open your browser from the terminal, open a new tab and enter:
+1. Open the blog in your browser to make sure it works.  You can do this from a new terminal tab with:
 
 	```
 	$ open http://localhost:4567
@@ -66,6 +66,3 @@ for more information about adding dates and tags to each article.
 	```
 
 1. (Optional) Rename the blog to something other than the default Heroku name. You can do this via the Heroku console after you log in.
-
-Note: The styling of code highlighting is a bit broken when the code shows up on the homepage. If you would like to embed code in your
-blog posts, let an instructor know.

source/index.html.haml

@@ -7,11 +7,11 @@ per_page: 10
   .twelve.columns
     - page_articles.each_with_index do |article, i|
       .panel
-        %p
-          %h3
-            = link_to article.title, article
-            %span= article.date.strftime('%b %e')
-          %p= article.summary
+        %h3
+          = link_to article.title, article
+          %span= article.date.strftime('%b %e')
+        = find_and_preserve do
+          = article.summary
 
 .row
   .six.columns

source/stylesheets/app.css.scss

@@ -52,4 +52,11 @@
 /* This beautiful CSS-File has been crafted with LESS (lesscss.org) and compiled by simpLESS (wearekiss.com/simpless) */
 @import url(http://fonts.googleapis.com/css?family=PT+Sans:700);
 
-@import url(http://fonts.googleapis.com/css?family=Lustria:400);
+@import url(http://fonts.googleapis.com/css?family=Lustria:400);
+
+pre.highlight {
+  border: 1px solid #ccc;
+  padding: 1em;
+  background: #ddd;
+  margin: 1em 0;
+}