Remove fontface support

There are far better tools for handling this and it's not in line with what Typography.js's mission. If someone really likes this, it could be added back with a plugin.
KyleAMathews · Aug 1, 2016 · ffab1e9 · ffab1e9
1 parent 727907f
commit ffab1e9
Show file tree

Hide file tree

Showing 5 changed files with 0 additions and 53 deletions.
diff --git a/README.md b/README.md
@@ -240,18 +240,6 @@ googleFonts: [
 * **headerWeight**: Specify the font weight for headers. Defaults to 900.
 * **bodyWeight**: Specify the font weight for body text. Defaults to 'normal'.
 * **boldWeight**: Specify the font weight for bold (b, strong, dt, th) elements. Defaults to "bold".
-* **fontFaces**: Specify custom font faces.
-```javascript
-fontFaces: [
-  {
-    fontFamily: 'DinNextRounded'
-    fontWeight: 700
-    src: [
-      "url(http://example.com/dinbold.eot?#iefix) format(embedded-opentype),url(http://example.com/dinbold.woff) format(woff),url(http://example.com/dinbold.ttf) format(truetype),url(http://example.com/dinbold.svg) format(svg)"
-    ]
-  }
-]
-```
 * **blockMarginBottom**: Specify the default margin-bottom for block elements. Defaults to one "rhythm unit" or the base line height.
 * **includeNormalize**: Include in generated CSS normalize.css. Normalize.css is an excellent project which works to normalize the base CSS across browsers and serves as an excellent foundation for Typography.js. We include normalize.CSS by default but if you're already including it elsewhere in your project, you can disable including it here by passing `false`.
 * **overrideStyles**: Imperative API for directly adding to or

diff --git a/Types.js b/Types.js
@@ -1,7 +1,6 @@
 // @flow
 type ModularScaleType = {scale: number | string; maxWidth?: string}
 type GoogleFontsType = {name: string; styles: string[]}
-type FontFaceType = {fontFamily: string; fontWeight: number; src: string[]}
 
 export type OptionsType = {
   baseFontSize?: string,
@@ -17,7 +16,6 @@ export type OptionsType = {
   headerWeight?: number | string,
   bodyWeight?: number | string,
   boldWeight?: number | string,
-  fontFaces?: FontFaceType[],
   blockMarginBottom?: number | string,
   includeNormalize?: boolean,
   overrideStyles?: (

diff --git a/packages/typography/README.md b/packages/typography/README.md
@@ -239,18 +239,6 @@ googleFonts: [
 * **headerWeight**: Specify the font weight for headers. Defaults to 900.
 * **bodyWeight**: Specify the font weight for body text. Defaults to 'normal'.
 * **boldWeight**: Specify the font weight for bold (b, strong, dt, th) elements. Defaults to "bold".
-* **fontFaces**: Specify custom font faces.
-```javascript
-fontFaces: [
-  {
-    fontFamily: 'DinNextRounded'
-    fontWeight: 700
-    src: [
-      "url(http://example.com/dinbold.eot?#iefix) format(embedded-opentype),url(http://example.com/dinbold.woff) format(woff),url(http://example.com/dinbold.ttf) format(truetype),url(http://example.com/dinbold.svg) format(svg)"
-    ]
-  }
-]
-```
 * **blockMarginBottom**: Specify the default margin-bottom for block elements. Defaults to one "rhythm unit" or the base line height.
 * **includeNormalize**: Include in generated CSS normalize.css. Normalize.css is an excellent project which works to normalize the base CSS across browsers and serves as an excellent foundation for Typography.js. We include normalize.CSS by default but if you're already including it elsewhere in your project, you can disable including it here by passing `false`.
 * **overrideStyles**: Imperative API for directly adding to or

diff --git a/packages/typography/src/index.js b/packages/typography/src/index.js
@@ -44,7 +44,6 @@ const typography = function (opts: OptionsType) {
     boldWeight: 'bold',
     includeNormalize: true,
     blockMarginBottom: 1,
-    fontFaces: [],
   }
 
   const options = objectAssign({}, defaults, opts)

diff --git a/packages/typography/src/utils/compileStyles.js b/packages/typography/src/utils/compileStyles.js
@@ -7,31 +7,6 @@ import isObject from 'lodash/isObject'
 
 import type { OptionsType } from 'Types'
 
-const generateFontFaceRules = function (vr, options: OptionsType) {
-  let styles = ''
-  let properties = ''
-
-  // Return if there's no font-faces defined.
-  if ((options.fontFaces == null) || options.fontFaces.length <= 0) {
-    return styles
-  }
-  for (let i = 0; i < options.fontFaces.length; i++) {
-    const fontFace = options.fontFaces[i]
-    const srcs = fontFace.src.map(s => `src:${s};`)
-    each(fontFace, (v, k) => { // eslint-disable-line
-      if (k !== 'src') {
-        properties += `${decamelize(k, '-')}:${v};\n`
-      }
-    })
-    styles += `@font-face {
-  ${properties}
-  ${srcs.join('\n')}
-}`
-  }
-
-  return styles
-}
-
 const compileStyles = (styles) => (
   reduce(styles, ((stylesStr, ruleSet, selector) => {
     stylesStr += `${selector}{` // eslint-disable-line
@@ -52,7 +27,6 @@ const compileStyles = (styles) => (
 module.exports = (vr: any, options: OptionsType, styles: any) => {
   // Compile styles to string.
   let stylesStr = compileStyles(styles)
-  stylesStr += `${generateFontFaceRules(vr, options)}`
 
   if (options.includeNormalize) {
     stylesStr = `${normalize}${stylesStr}`