Font Loading Strategy

[sherakama]

Re: #4

• Figure out a font loading strategy that is dynamic and light.
• It would be nice to have conditional loads and on-demand imports.

[kgcreative]

on variables/_typography.scss

/// Font Stack Monospace.
/// This is outputted via `font-family: $font-stack-monospace;`
$font-stack-monospace: 'Source Code Pro', $font-stack-monaco !default;

/// Monospace Source. (Defines the @import source for the generic 'monospace' font)
$monospace-source: 'https://fonts.googleapis.com/css?family=Source+Code+Pro' !default;

/// Font stack sans serif.
$font-stack-sans-serif: 'Noto Sans', $font-stack-helvetica !default;

/// Sans serif source.
$sans-serif-source: 'https://fonts.googleapis.com/css?family=Noto+Sans:400,400i,700,700i' !default;

/// Font stack serif.
$font-stack-serif: 'Noto Serif', $font-stack-georgia !default;

/// Serif Source.
$serif-source: 'https://fonts.googleapis.com/css?family=Noto+Serif:400,400i,700,700i' !default;

on base/_fonts.scss

/// Import declared monospace font
@if(global-variable-exists(monospace-source)) {
  @import url($monospace-source);
}

/// Import declared Sans Serif font
@if(global-variable-exists(sans-serif-source)) {
  @import url($sans-serif-source);
}

/// Import declared Serif font
@if(global-variable-exists(serif-source)) {
  @import url($serif-source);
}

This allows us to override the generic monospace, sans-serif serif font stacks (and optionally import paths)

We can discuss this further, but so far this seems to work in Homesite and Stanford Basic, so we could potentially call this done, unless we want to spend more time on it.

[kgcreative]

#43 addresses this.

@include load-fonts($load);