Living Style Guide: Document select size modifiers

[ci skip]

Signed-off-by: Alex Coles <alex@alexbcoles.com>

app/assets/stylesheets/content/_forms.md

@@ -1,4 +1,4 @@
-# Forms
+# Forms: Checkboxes
 
 ```
 <label class="checkbox-label">
@@ -24,3 +24,63 @@
   checkbox label
 </label>
 ```
+
+# Forms: Select
+
+## Default Select
+
+_with no class (uses default Foundation form styling)_
+
+```
+<select>
+  <option>one</option>
+  <option>two</option>
+  <option>three</option>
+</select>
+```
+
+_with class applied_
+
+```
+<select>
+  <option>one</option>
+  <option>two</option>
+  <option>three</option>
+</select>
+```
+
+## Default Select with Option Groups
+
+```
+<select>
+  <optgroup label="group one">
+    <option>one dot one</option>
+  </optgroup>
+  <optgroup label="group two">
+    <option>two dot one</option>
+    <option>two dot two</option>
+  </optgroup>
+</select>
+```
+
+## Select Sizes
+
+```
+<select class="form--select -tiny">
+  <option>one</option>
+  <option>two</option>
+  <option>three</option>
+</select>
+
+<select class="form--select -small">
+  <option>one</option>
+  <option>two</option>
+  <option>three</option>
+</select>
+
+<select class="form--select -large">
+  <option>one</option>
+  <option>two</option>
+  <option>three</option>
+</select>
+```