text: // @flow
  import gray from "gray-percentage"
  import { MOBILE_MEDIA_QUERY } from "typography-breakpoint-constants"
  import Typography from "typography"
  import CodePlugin from "typography-plugin-code"
  
  const Wordpress2016 = {
    title: "Wordpress Theme 2016",
    plugins: [new CodePlugin()],
    baseFontSize: "16px",
    baseLineHeight: 1.75,
    scaleRatio: 5 / 2,
    headerFontFamily: ["Playfair Display", "Georgia", "serif"],
    bodyFontFamily: ["Merriweather", "Georgia", "serif"],
    bodyColor: "hsla(0,0%,0%,0.9)",
    headerWeight: 900,
    bodyWeight: 400,
    boldWeight: 700,
    overrideStyles: ({ adjustFontSizeTo, scale, rhythm }, options) => ({
      blockquote: {
        ...scale(1 / 5),
        color: gray(41),
        fontStyle: "italic",
        paddingLeft: rhythm(13 / 16),
        marginLeft: rhythm(-1),
        borderLeft: `${rhythm(3 / 16)} solid ${gray(10)}`,
      },
      "blockquote > :last-child": {
        marginBottom: 0,
      },
      "blockquote cite": {
        ...adjustFontSizeTo(options.baseFontSize),
        color: options.bodyColor,
        fontWeight: options.bodyWeight,
      },
      "blockquote cite:before": {
        content: '"— "',
      },
      ul: {
        listStyle: "disc",
      },
      "ul,ol": {
        marginLeft: 0,
      },
      [MOBILE_MEDIA_QUERY]: {
        "ul,ol": {
          marginLeft: rhythm(1),
        },
        blockquote: {
          marginLeft: rhythm(-3 / 4),
          marginRight: 0,
          paddingLeft: rhythm(9 / 16),
        },
      },
      h4: {
        letterSpacing: "0.140625em",
        textTransform: "uppercase",
      },
      h6: {
        fontStyle: "italic",
      },
      a: {
        boxShadow: "0 1px 0 0 currentColor",
        color: "#007acc",
        textDecoration: "none",
      },
      "a:hover,a:active": {
        boxShadow: "none",
      },
      "mark,ins": {
        background: "#007acc",
        color: "white",
        padding: `${rhythm(1 / 16)} ${rhythm(1 / 8)}`,
        textDecoration: "none",
      },
    }),
    overrideThemeStyles: () => {
      return {
        "a.gatsby-resp-image-link": {
          boxShadow: `none`,
        },
      }
    },
  }
  
  const typography = new Typography(Wordpress2016)
  
  // Hot reload typography in development.
  if (process.env.NODE_ENV !== `production`) {
    typography.injectStyles()
  }
  
  export default typography
  export const rhythm = typography.rhythm
  export const scale = typography.scale
  