Add $family-secondary, $family-tertiary, and 6 font family helpers (#2178)

* Add secondary and tertiary font families to derived-variables.sass

* Add font family helpers to helpers.sass

* Add has-font-* to typography-helpers.html

* Correct number of font family helpers in typography-helpers.html

* Remove $family-tertiary, change has-font to is-family, and update docs.

docs/documentation/modifiers/typography-helpers.html

@@ -396,7 +396,7 @@ breadcrumb:
   <tbody>
   <tr>
     <td><code>has-text-weight-light</code></td>
-    <td>Transforms  text weight to <strong>light</strong></td>
+    <td>Transforms text weight to <strong>light</strong></td>
   </tr>
   <tr>
     <td><code>has-text-weight-normal</code></td>
@@ -412,3 +412,48 @@ breadcrumb:
   </tr>
   </tbody>
 </table>
+
+{% include elements/anchor.html name="Font family" %}
+
+<div class="content">
+  <p>
+    You can change the font family with the use of one of <strong>5 font family
+    helpers</strong>:
+  </p>
+</div>
+
+<table class="table is-bordered">
+  <thead>
+  <tr>
+    <th>
+      Class
+    </th>
+    <th>
+      Family
+    </th>
+  </tr>
+  </thead>
+  <tbody>
+  <tr>
+    <td><code>is-family-primary</code></td>
+    <td>Changes font family to <strong>$family-primary</strong></td>
+  </tr>
+  <tr>
+    <td><code>is-family-secondary</code></td>
+    <td>Changes font family to <strong>$family-secondary</strong></td>
+  </tr>
+  <tr>
+    <td><code>is-family-sans-serif</code></td>
+    <td>Changes font family to <strong>$family-sans-serif</strong></td>
+  </tr>
+  <tr>
+    <td><code>is-family-monospace</code></td>
+    <td>Changes font family to <strong>$family-monospace</strong></td>
+  </tr>
+  <tr>
+    <td><code>is-family-code</code></td>
+    <td>Changes font family to <strong>$family-code</strong></td>
+  </tr>
+  </tbody>
+</table>
+