Support customizable fonts for title, headings, body

[mbrukman]

It looks like the the current title font family is hard-coded to Lobster, and it's not easy to change as it's hard-coded in many places, with no way to substitute a new family via params:

• assets/styles/partials/_header.scss shows:

  .title {
   /* [...] */
   font-family: $family-lobster;

• layouts/partials/head.html includes two explicit references, on line 127:

  <link rel="preload" href="https://fonts.googleapis.com/css?family=Lobster" as="style">

  and on line 142:

  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lobster">

• assets/service-worker-template.js explicitly requests Lobster font:

  // Google fonts
  'https://fonts.googleapis.com/css?family=Lobster',
  'https://fonts.gstatic.com/s/lobster/v20/neILzCirqoswsqX9zoKmM4MwWJU.woff2',

• assets/styles/partials/_variables.scss explicitly calls the style with the name "lobster":

  $family-lobster: 'Lobster', cursive, $family-sans-serif;

This makes it hard to swap out the font style for the heading for a different font family, without there being parameters to change it easily.

Would it be possible to make it parameterized to enable easier font substitution? Thanks!