docs(button): button attribute docs

ionic/components/button/button.ts

@@ -4,7 +4,28 @@ import {Config} from '../../config/config';
 
 
 /**
- * TODO
+  * @name Button
+  * @module ionic
+  * @property [primary] - sets button color to default primary
+  * @property [secondary] - sets button color to default secondary
+  * @property [danger] - sets button color to default danger
+  * @property [light] - sets button color to default light
+  * @property [dark] - sets button color to default dark
+  * @property [outline] - for an unfilled outline button
+  * @property [clear] - for a transparent button that only shows text and icons
+  * @property [round] - for a button with rounded corners
+  * @property [block] - for a block button that fills it's parent container
+  * @property [full] - for a full width button
+  * @property [small] - sets button size to small
+  * @property [large] - sets button size to large
+  * @property [fab] - for a floating action button
+  * @property [fab-left] - position a fab button to the left
+  * @property [fab-right] - position a fab button to the right
+  * @property [fab-center] - position a fab button towards the center
+  * @property [fab-top] - position a fab button towards the top
+  * @property [fab-bottom] - position a fab button towards the bottom
+  * @description
+  * Buttons are simple components in Ionic, can consist of text, an icon, or both, and can be enhanced with a wide range of attributes.
  */
 @Directive({
   selector: 'button,[button]'

scripts/docs/templates/common.template.html

@@ -11,6 +11,7 @@ doc: "<$ doc.name $>"
 docType: "<$ doc.docType $>"
 ---
 
+
 <@ macro paramList(paramData) -@>
   <@- if paramData -@><span class="params">(
     <@- for param in paramData -@>
@@ -53,6 +54,7 @@ docType: "<$ doc.docType $>"
 </table>
 <@ endmacro @>
 
+
 <@- macro functionSyntax(fn) @>
 <@- set sep = joiner(', ') -@>
 <code><$ fn.name $>(<@- for param in fn.params @><$ sep() $>
@@ -153,5 +155,29 @@ defined in <$ githubViewLink(doc) $>
 <@ endfor -@>
 <@- endif -@>
 
+<@ if doc.properties @> 
+  <h2>Attributes:</h2>
+  <table class="table" style="margin:0;">
+    <thead>
+      <tr>
+        <th>Attribute</th>
+        <th>Description</th>
+      </tr>
+    </thead>
+    <tbody>
+      <@ for prop in doc.properties @>
+      <tr>
+        <td>
+          <$ prop.name $>
+        </td>
+        <td>
+          <$ prop.description $>
+        </td>
+      </tr>
+      <@ endfor @>
+    </tbody>
+  </table>
+<@ endif @>
+
 <@ endblock @>
 <@ endblock @>