Fixes #1111 | Make buttons page compatible with Lexicon website

clayui.com/content/docs/components/buttons.md

@@ -8,7 +8,66 @@ Buttons communicate an action to happen on user interaction.
 
 <div class="alert alert-info">Check the <a href="https://lexicondesign.io">Lexicon</a> <a href="https://lexicondesign.io/docs/patterns/buttons.html">Buttons Pattern</a> for a more in-depth look at the motivations and proper usage of this component.</div>
 
-<article id="clay-button">
+<article id="types">
+
+### Types
+
+#### Primary
+
+<button class="btn btn-primary" type="button">Primary</button>
+
+```soy
+{call ClayButton.render}
+	{param label: 'Primary' /}
+	{param type: 'button' /}
+{/call}
+```
+```html
+<clay-button label="Primary" type="button"></clay-button>
+```
+```html
+<button class="btn btn-primary" type="button">Primary</button>
+```
+
+#### Secondary
+
+<button class="btn btn-secondary" type="button">Secondary</button>
+
+```soy
+{call ClayButton.render}
+	{param label: 'Secondary' /}
+	{param style: 'secondary' /}
+	{param type: 'button' /}
+{/call}
+```
+```html
+<clay-button label="Secondary" style="secondary" type="button"></clay-button>
+```
+```html
+<button class="btn btn-secondary" type="button">Secondary</button>
+```
+
+#### Link
+
+<button class="btn btn-link" type="button">Link</button>
+
+```soy
+{call ClayButton.render}
+	{param label: 'Link' /}
+	{param style: 'link' /}
+	{param type: 'button' /}
+{/call}
+```
+```html
+<clay-button label="Link" style="link" type="button"></clay-button>
+```
+```html
+<button class="btn btn-link" type="button">Link</button>
+```
+
+</article>
+
+<article id="states">
 
 ### States
 
@@ -171,30 +230,38 @@ Buttons communicate an action to happen on user interaction.
 
 ### Sizes
 
+#### Small
+
 <button class="btn btn-primary btn-sm" type="button">Small</button>
-<button class="btn btn-primary" type="button">Default</button>
 
 ```soy
 {call ClayButton.render}
 	{param label: 'Small' /}
 	{param size: 'sm' /}
 {/call}
-
-{call ClayButton.render}
-	{param label: 'Default' /}
-{/call}
 ```
 ```html
 <clay-button label="Small" size="sm"></clay-button>
-
-<clay-button label="Default"></clay-button>
 ```
 ```html
 <button class="btn btn-secondary btn-sm" type="button">Small</button>
 
 <button class="btn btn-secondary" type="button">Default</button>
 ```
 
+#### Default
+
+<button class="btn btn-primary" type="button">Default</button>
+
+```soy
+{call ClayButton.render}
+	{param label: 'Default' /}
+{/call}
+```
+```html
+<clay-button label="Default"></clay-button>
+```
+
 </article>