From 67804b265d90ed26a94fb247ad533767e495b5b3 Mon Sep 17 00:00:00 2001
From: darcyclarke <darcy@darcyclarke.me>
Date: Fri, 15 Mar 2013 12:18:14 -0400
Subject: [PATCH] Modified readme, added new stylus example as we now support
 it as well

---
 README.md        | 58 ++++++++++++++++++++++++++++++++++++++++++----
 example/foo.styl | 60 ++++++++++++++++++++++++++++++++++++++++++++++++
 tasks/DSS.js     |  2 +-
 3 files changed, 115 insertions(+), 5 deletions(-)
 create mode 100644 example/foo.styl

diff --git a/README.md b/README.md
index 9d78b35..ceea7d8 100644
--- a/README.md
+++ b/README.md
@@ -1,11 +1,10 @@
-![DSS](http://f.cl.ly/items/1J353X3U172A1u3r2K3b/dss-logo.png)
-
 DSS
 ===
 
 **@version 1.0**
+**@logo [DSS](http://f.cl.ly/items/1J353X3U172A1u3r2K3b/dss-logo.png)**
 
-**DSS**, Documented Style Sheets, is a [Grunt](http://gruntjs.com) plugin that exposes a [KSS](https://github.com/kneath/kss) style of comment blocking and parser of CSS, LESS, SASS and SCSS code for UI documentation generation.
+**DSS**, Documented Style Sheets, is a [Grunt](http://gruntjs.com) plugin that exposes a [KSS](https://github.com/kneath/kss) style of comment blocking and parser of CSS, LESS, STYLUS, SASS and SCSS code for UI documentation generation.
 
 ### Example Comment Block
 
@@ -23,6 +22,57 @@ DSS
   *   <button>This is a button</button>
   */ 
 ````
+#### or
+
+```scss
+//
+// @name Button
+// @description Your standard form button.
+// 
+// @state :hover - Highlights when hovering.
+// @state :disabled - Dims the button when disabled.
+// @state .primary - Indicates button is the primary action.
+// @state .smaller - A smaller button
+// 
+// @markup
+//   <button>This is a button</button>
+// 
+````
+
+### Example Generated Object
+
+```javascript
+{
+  "name": "Button",
+  "description": "Your standard form button.",
+  "state": [
+    { 
+      "name": ":hover",
+      "escaped": "pseudo-class-hover",
+      "description": "Highlights when hovering."
+    },
+    {
+      "name": ":disabled",
+      "escaped": "pseudo-class-disabled",
+      "description": "Dims the button when disabled."
+    },
+    {
+      "name": ".primary",
+      "escaped": "primary",
+      "description": "Indicates button is the primary action."
+    },
+    {
+      "name": ".smaller",
+      "escaped": "smaller",
+      "description": "A smaller button"
+    }
+  ],
+  "markup": {
+    "example": "<button>This is a button</button>",
+    "escaped": "&lt;button&gt;This is a button&lt;/button&gt;"
+  }
+}
+````
 
 ## Getting Started
 This plugin requires Grunt `~0.4.0`
@@ -101,4 +151,4 @@ grunt.initConfig({
     }
   }
 });
-````
+````
\ No newline at end of file
diff --git a/example/foo.styl b/example/foo.styl
new file mode 100644
index 0000000..392cf94
--- /dev/null
+++ b/example/foo.styl
@@ -0,0 +1,60 @@
+//
+// @name Button
+// @description Your standard form button.
+// 
+// @state :hover - Highlights when hovering.
+// @state :disabled - Dims the button when disabled.
+// @state .primary - Indicates button is the primary action.
+// @state .smaller - A smaller button
+//
+// @markup
+//   <button>This is a button</button>
+//
+button {
+  padding: 5px 15px;
+  line-height: normal;
+  font-family: "Helvetica Neue", Helvetica;
+  font-size: 12px;
+  font-weight: bold;
+  color: #666;
+  text-shadow: 0 1px rgba(255, 255, 255, 0.9);
+  border-radius: 3px;
+  border: 1px solid #ddd;
+  border-bottom-color: #bbb;
+  background: #f5f5f5;
+  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='$start', endColorstr='$end');
+  background: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e5e5e5));
+  background: -moz-linear-gradient(top, #f5f5f5, #e5e5e5);
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
+  cursor: pointer; 
+}
+
+//
+// @name Anchor Tag
+// @description Your standard link tag.
+// 
+// @state :hover - Background changes when hovering.
+// @state .active - Highlights link when active.
+// 
+// @markup
+//   <a href="#">This is a link</a>
+//
+a {
+  text-decoration: none;
+  color: red;
+  padding: 10px;
+  display: inline-block;
+  background: #efefef;
+  bored-radius: 5px;
+}
+  
+  // Hover
+  a:hover {
+    background: #cccccc;
+  }
+
+  // Active
+  a:active,
+  a.active {
+    background: green;
+  }
\ No newline at end of file
diff --git a/tasks/DSS.js b/tasks/DSS.js
index c4035fc..30080e5 100644
--- a/tasks/DSS.js
+++ b/tasks/DSS.js
@@ -376,7 +376,7 @@ module.exports = function(grunt) {
           temp = {};
 
         }); 
-        
+                
         // Execute callback with filename and blocks
         callback({ file: options.file, blocks: blocks });