//  GOV.UK font stacks, referred to in typography.scss

//  Font stack weirdness
//
//  To ensure embedded fonts fall back to appropriate
//  system fonts (eg, bold embedded font falls back to
//  bold system font, without anyone getting horrible
//  artificially emboldened weights) we're setting
//  the font-stack in a font-face declaration rather
//  than with the usual font-family.

// Allow uppercase letters in font stack variable names
// scss-lint:disable NameFormat

// New Transport Light
$NTA-Light: "nta", Arial, sans-serif;
$NTA-Light-Tabular: "ntatabularnumbers", $NTA-Light;

// Allow font stack to be overridden
// Not all apps using toolkit use New Transport
$toolkit-font-stack: $NTA-Light !default;
$toolkit-font-stack-tabular: $NTA-Light-Tabular !default;

// Helvetica Regular
@font-face {
  font-family: GDS-Logo;
  src: local("HelveticaNeue"),
       local("Helvetica Neue"),
       local("Arial"),
       local("Helvetica");
}

$Helvetica-Regular: "GDS-Logo", sans-serif;

// Font reset for print
$Print-reset: sans-serif;

//  GOV.UK font stacks, referred to in typography.scss

//  Font stack weirdness
//
//  To ensure embedded fonts fall back to appropriate
//  system fonts (eg, bold embedded font falls back to
//  bold system font, without anyone getting horrible
//  artificially emboldened weights) we're setting
//  the font-stack in a font-face declaration rather
//  than with the usual font-family.

// Allow uppercase letters in font stack variable names
// scss-lint:disable NameFormat

// New Transport Light
$NTA-Light: "nta", Arial, sans-serif;
$NTA-Light-Tabular: "ntatabularnumbers", $NTA-Light;

// Helvetica Regular
$Helvetica-Regular: "HelveticaNeue", "Helvetica Neue", "Arial", "Helvetica", sans-serif;

// Allow font stack to be overridden
// Not all apps using toolkit use New Transport
$toolkit-font-stack: $NTA-Light !default;
$toolkit-font-stack-tabular: $NTA-Light-Tabular !default;

// Font reset for print
$Print-reset: sans-serif;

Remove the @font-face declaration for Helvetica
Remove the @font-face declaration for Helvetica

The only reason we use this instead of just a font-family declaration is an unspecified ‘Firefox bug with font names’: https://github.com/alphagov/whitehall/commit/7a873f8c1f5af67136da70523d12769f0f0afb9f . This doesn’t seem to exist any more, or at least I can’t find any differences in display in current versions.

There’s also an existing bug in with the Helvetica font-face: it renders too light in Firefox and Chrome with a bold font weight. Load this demo in Chrome and Safari to see the difference: http://codepen.io/anon/pen/KzYMby . Changing ‘Helvetica Neue’ to ‘Helvetica Neue Bold’ normalises the rendering, but at the cost of having to have separate @font-face declarations for normal and bold weights.

This doesn’t directly affect GOV.UK because we only use $Helvetica-Regular for organisations, which don’t use the bold weight.