text: export const fontSizes = {
    xxSmall: '12px',
    xSmall: '14px',
    small: '16px',
    medium: '18px',
    xMedium: '20px',
    large: '22px',
    xLarge: '28px',
    xxLarge: '32px'
  };
  
  export const lineHeights = {
    xSmall: 16,
    xMedium: 28
  };
  
  export const fontFamilies = {
    robotoCondensed: '"Roboto Condensed", "Open Sans"',
    roboto: '"Roboto", "Open Sans"'
  };
  
  export const fontWeights = {
    light: 300,
    regular: 400,
    medium: 500,
    bold: 700
  };
  
  export const typography = {
    display2: `
      font-size: 45px;
      line-height: 52px;
      font-weight: ${fontWeights.regular};
    `,
    display1: `
      font-size: 34px;
      line-height: 40px;
      font-weight: ${fontWeights.regular};
    `,
    headline: `
      font-size: 24px;
      line-height: 32px;
      font-weight: ${fontWeights.regular};
    `,
    title: `
      font-size: 20px;
      line-height: 28px;
      font-weight: ${fontWeights.medium};
      letter-spacing: 0.5px;
    `,
    subhead2: `
      font-size: 16px;
      line-height: 28px;
      font-weight: ${fontWeights.bold};
      letter-spacing: 0.5px;
    `,
    subhead1: `
      font-size: 16px;
      line-height: 24px;
      font-weight: ${fontWeights.regular};
      letter-spacing: 0.5px;
    `,
    body2: `
      font-size: 14px;
      line-height: 24px;
      font-weight: ${fontWeights.medium};
      letter-spacing: 0.5px;
    `,
    body1: `
      font-size: 14px;
      line-height: 20px;
      font-weight: ${fontWeights.regular};
      letter-spacing: 0.5px;
    `,
    bodyCompact: `
      font-size: 14px;
      line-height: 16px;
      font-weight: ${fontWeights.regular};
      letter-spacing: 0.5px;
    `,
    caption: `
      font-size: 12px;
      line-height: 16px;
      font-weight: ${fontWeights.regular};
      letter-spacing: 0.5px;
    `
  };