From 50fb74d6c8e74772a5a31e94457bbf35462a092f Mon Sep 17 00:00:00 2001
From: Les Leslie <les@wedgwoodwebworks.com>
Date: Sun, 28 Oct 2018 15:12:52 -0700
Subject: [PATCH] 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.
---
 .../modifiers/typography-helpers.html         | 47 ++++++++++++++++++-
 sass/base/helpers.sass                        | 15 ++++++
 sass/utilities/derived-variables.sass         |  1 +
 3 files changed, 62 insertions(+), 1 deletion(-)

diff --git a/docs/documentation/modifiers/typography-helpers.html b/docs/documentation/modifiers/typography-helpers.html
index 1d5d9ffb..e29985ed 100644
--- a/docs/documentation/modifiers/typography-helpers.html
+++ b/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>
+
diff --git a/sass/base/helpers.sass b/sass/base/helpers.sass
index 10c9056e..17fdf15a 100644
--- a/sass/base/helpers.sass
+++ b/sass/base/helpers.sass
@@ -120,6 +120,21 @@ $alignments: ('centered': 'center', 'justified': 'justify', 'left': 'left', 'rig
 .has-text-weight-bold
   font-weight: $weight-bold !important
 
+.is-family-primary
+  font-family: $family-primary !important
+
+.is-family-secondary
+  font-family: $family-secondary !important
+
+.is-family-sans-serif
+  font-family: $family-sans-serif !important
+
+.is-family-monospace
+  font-family: $family-monospace !important
+
+.is-family-code
+  font-family: $family-code !important
+
 // Visibility
 
 $displays: 'block' 'flex' 'inline' 'inline-block' 'inline-flex'
diff --git a/sass/utilities/derived-variables.sass b/sass/utilities/derived-variables.sass
index aa912813..c464814a 100644
--- a/sass/utilities/derived-variables.sass
+++ b/sass/utilities/derived-variables.sass
@@ -67,6 +67,7 @@ $link-active-border: $grey-dark !default
 // Typography
 
 $family-primary: $family-sans-serif !default
+$family-secondary: $family-sans-serif !default
 $family-code: $family-monospace !default
 
 $size-small: $size-7 !default