Related to #80 — @hcatlin please feel free to alter this page however…

…. :)

data/community.yml

@@ -35,6 +35,9 @@ blogs:
     url: "http://www.google.com/cse?cx=partner-pub-1988806651014029%3A4kuybaak597&ie=ISO-8859-1&q=sass#gsc.tab=0&gsc.q=sass&gsc.page=1"
 
 projects:
+  - name: "libSass"
+    url: "/libSass"
+    description: "a CSS (and Sass!) authoring framework"
   - name: "Compass"
     url: "http://compass-style.org/"
     description: "a CSS (and Sass!) authoring framework"
@@ -69,20 +72,6 @@ projects:
     url: "http://inuitcss.com/"
     description: "a powerful, scalable, Sass-based, BEM, OOCSS framework"
 
-libsass:
-  - name: "libSass"
-    url: "http://libsass.org/"
-    description: "a C/C++ port of the Sass engine, that can be simple, fast, and easy to integrate."
-  - name: "Node-sass"
-    url: "https://www.npmjs.org/package/node-sass"
-    description: "libSass for Node.js"
-  - name: "Lightning fast Sass compiling with libsass, Node-sass and Grunt-sass"
-    url: "http://benfrain.com/lightning-fast-sass-compiling-with-libsass-node-sass-and-grunt-sass/"
-    description: "by Ben Frain, August 2013"
-  - name: "libSass Python"
-    url: "http://dahlia.kr/libsass-python/"
-    description: "libSass for Python"
-
 articles:
   - name: "Sass vs. LESS"
     url: "http://css-tricks.com/sass-vs-less/"

data/libsass.yml

@@ -0,0 +1,13 @@
+resources:
+  - name: "libSass"
+    url: "http://libsass.org/"
+    description: "a C/C++ port of the Sass engine, that can be simple, fast, and easy to integrate."
+  - name: "Node-sass"
+    url: "https://www.npmjs.org/package/node-sass"
+    description: "libSass for Node.js"
+  - name: "Lightning fast Sass compiling with libsass, Node-sass and Grunt-sass"
+    url: "http://benfrain.com/lightning-fast-sass-compiling-with-libsass-node-sass-and-grunt-sass/"
+    description: "by Ben Frain, August 2013"
+  - name: "libSass Python"
+    url: "http://dahlia.kr/libsass-python/"
+    description: "libSass for Python"

source/assets/css/foundation/_block.scss

@@ -2,7 +2,8 @@ footer,
 header,
 main,
 nav,
-section { display: block; }
+section,
+figure { display: block; }
 
 %block-text,
 p {

source/assets/css/foundation/_media.scss

@@ -1,5 +1,7 @@
 img {
   display: inline-block;
+  max-width: 100%;
+  height: auto;
   border: 0;
   vertical-align: middle;
 }
@@ -19,3 +21,8 @@ hr {
 }
 
 svg:not(:root) { overflow: hidden; }
+
+figure {
+  @extend %block-text;
+  @include breakpoint($tablet-large) { max-width: 50%; }
+}

source/assets/css/regions/_complementary.scss

@@ -19,5 +19,7 @@
   @include breakpoint($tablet-large) {
     @include padding-leader(3);
     @include padding-trailer(2);
+
+    p { text-align: left; }
   }
 }

source/code-snippets/_libsass-execute.md

@@ -0,0 +1,3 @@
+```
+./bin/sassc [input file] > output.css
+```

source/code-snippets/_libsass-setup.md

@@ -0,0 +1,3 @@
+```
+export SASS_LIBSASS_PATH=/Users/hcatlin/path/libsass
+```

source/community.html.haml

@@ -25,7 +25,7 @@ layout: layout_1_column
       The Sass community is amazing. There are a number of
       [frameworks](#Frameworks) that make using Sass simple. Want try Sass in
       Node, Python, or another framework? Check out the
-      [libSass resources](#libSass).
+      [libSass resources](/libsass).
 
   %li
     :markdown
@@ -109,11 +109,3 @@ layout: layout_1_column
         = link_to project.name, project.url
         —
         = project.description
-
-  %h3#libSass libSass Resources
-  %ul
-    - for project in data.community.libsass
-      %li
-        = link_to project.name, project.url
-        —
-        = project.description

source/layouts/regions/_banner.haml

@@ -1,6 +1,6 @@
 %header.banner(role="banner")
   .container
-    %h1.site-brand= link_to (image_tag "logo.png", height: "48", alt: "Sass"), "/"
+    %h1.site-brand= link_to (image_tag "logos/logo.png", height: "48", alt: "Sass"), "/"
 
     %nav.navigation.collapse(role="navigation")
       :markdown
@@ -9,6 +9,7 @@
         * [Blog](http://blog.sass-lang.com/)
         * [Documentation](/documentation/file.SASS_REFERENCE.html)
         * [Get Involved](/community)
+        * [libSass](/libsass)
 
     .banner-toggle
       %button(type="button" data-toggle="collapse" data-target=".navigation")

source/libsass.html.haml

@@ -0,0 +1,48 @@
+---
+title: libSass
+---
+
+%p.introduction
+  We want everyone to enjoy Sass, no matter what language they use. Sass was
+  originally written in Ruby.
+  = link_to "libSass", "http://libsass.org/"
+  is a C/C++ port of the Sass engine. The point is to be simple, faster, and
+  easy to integrate. Find out more about the project over at
+  = succeed "." do
+    = link_to "GitHub", "http://github.com/hcatlin/libsass"
+
+:markdown
+  ## SassC
+
+  LibSass is just a library. To run the code locally (i.e. to compile your stylesheets), you need an implementer. SassC (get it?) is an implementer written in C. There are a number of other implementations of LibSass - for example Node. We encourage you to write your own port - the whole point of Libsass is that we want to bring Sass to many other languages, not just Ruby!
+
+  To run the compiler on your local machine, you need to build SassC. To build SassC, you must have either a local copy of the libsass source or it must be installed into your system. For development, please use the source version. You must then setup an environment variable pointing to the LibSass folder, for example:
+
+~ partial "code-snippets/libsass-setup"
+
+%p
+  The executable will be in the bin folder. To run it, simply try something like:
+
+~ partial "code-snippets/libsass-execute"
+
+%h2 About libSass
+
+:markdown
+  This project is the brainchild of
+  [Hampton Catlin](http://twitter.com/hcatlin), the original creator of Sass,
+  and is sponsored by [Moovweb](http://moovweb.com/).
+  [Aaron Leung](http://github.com/akhleung) from Moovweb is the primary
+  developer.
+
+%figure
+  = image_tag "logos/libsass.png", alt: "libSass logo"
+
+- content_for :complementary do
+  %h3 Resources
+
+  %ul
+    - for project in data.libsass.resources
+      %li
+        = link_to project.name, project.url
+        —
+        = project.description