Living Style Guide: Document text field sizes

[ci skip]

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

app/assets/stylesheets/content/_forms.md

@@ -84,3 +84,34 @@ _with class applied_
   <option>three</option>
 </select>
 ```
+
+# Forms: Text fields
+
+## Default text field
+
+_with no class (uses default Foundation form styling)_
+
+```
+<label>Text:<input type="text"></label>
+<label>Email:<input type="email" placeholder="a valid email"></label>
+<label>Number:<input type="number"></label>
+```
+
+_with class applied_
+
+
+```
+<label>Text:<input type="text" class="form--text-field"></label>
+<label>Email:<input type="email" class="form--text-field" placeholder="a valid email"></label>
+<label>Number:<input type="number" class="form--text-field"></label>
+```
+
+## Text field sizes
+
+```
+<label>Tiny:<input type="text" class="form--text-field -tiny" value="a tiny value"></label>
+
+<label>Small:<input type="text" class="form--text-field -small" value="a small value"></label>
+
+<label>Large:<input type="text" class="form--text-field -large" value="a large value"></label>
+```