Use PT Serif

package.json

@@ -1,6 +1,6 @@
 {
   "scripts": {
-    "start": "concurrently \"tsc --watch\" \"nodemon lib\"",
+    "start": "tsc && concurrently \"tsc --watch\" \"nodemon lib\"",
     "test": "tsc && jest && prettier --check src"
   },
   "dependencies": {

src/index.tsx

@@ -144,6 +144,16 @@ function Layout({ children }: { children: React.ReactNode }) {
           sizes="16x16"
         />
         <link rel="icon" type="image/x-icon" href="/favicon.ico" />
+        <link
+          rel="stylesheet"
+          type="text/css"
+          href="/fonts/typeface-pt-serif/index.css"
+        />
+        <link
+          rel="stylesheet"
+          type="text/css"
+          href="/fonts/typeface-pt-mono/index.css"
+        />
         <link rel="stylesheet" type="text/css" href="/styles.css" />
         <title>Kill the Newsletter!</title>
       </head>

static/fonts/typeface-pt-mono/README.md

@@ -0,0 +1,34 @@
+
+# typeface-pt-mono
+
+The CSS and web font files to easily self-host “PT Mono”.
+
+## Install
+
+`npm install --save typeface-pt-mono`
+
+## Use
+
+Typefaces assume you’re using webpack to process CSS and files. Each typeface
+package includes all necessary font files (woff2, woff) and a CSS file with
+font-face declarations pointing at these files.
+
+You will need to have webpack setup to load css and font files. Many tools built
+with Webpack will work out of the box with Typefaces such as [Gatsby](https://github.com/gatsbyjs/gatsby)
+and [Create React App](https://github.com/facebookincubator/create-react-app).
+
+To use, simply require the package in your project’s entry file e.g.
+
+```javascript
+// Load PT Mono typeface
+require('typeface-pt-mono')
+```
+
+## About the Typefaces project.
+
+Our goal is to add all open source fonts to NPM to simplify using great fonts in
+our web projects. We’re currently maintaining 939 typeface packages
+including all typefaces on Google Fonts.
+
+If your favorite typeface isn’t published yet, [let us know](https://github.com/KyleAMathews/typefaces)
+and we’ll add it!

static/fonts/typeface-pt-mono/files-hash.json

@@ -0,0 +1 @@
+{"hash":"24310e0c7ef042b882b1e59f6112fa88","updatedAt":"2019-02-28T18:44:13.339Z"}

static/fonts/typeface-pt-mono/index.css

@@ -0,0 +1,13 @@
+/* pt-mono-400normal - latin */
+@font-face {
+  font-family: 'PT Mono';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 400;
+  src:
+    local('PT Mono Regular '),
+    local('PT Mono-Regular'),
+    url('./files/pt-mono-latin-400.woff2') format('woff2'), /* Super Modern Browsers */
+    url('./files/pt-mono-latin-400.woff') format('woff'); /* Modern Browsers */
+}
+

static/fonts/typeface-pt-mono/package.json

@@ -0,0 +1,48 @@
+{
+  "_from": "typeface-pt-mono",
+  "_id": "typeface-pt-mono@0.0.72",
+  "_inBundle": false,
+  "_integrity": "sha512-7AMVSvB0oT2TDPyCJlVKSIxPjspI08Rlhg/SEUwQORSyalZgtSt2pDJEvVZuJbBIak70oB2ts6vL4iunYPUGKA==",
+  "_location": "/typeface-pt-mono",
+  "_phantomChildren": {},
+  "_requested": {
+    "type": "tag",
+    "registry": true,
+    "raw": "typeface-pt-mono",
+    "name": "typeface-pt-mono",
+    "escapedName": "typeface-pt-mono",
+    "rawSpec": "",
+    "saveSpec": null,
+    "fetchSpec": "latest"
+  },
+  "_requiredBy": [
+    "#USER",
+    "/"
+  ],
+  "_resolved": "https://registry.npmjs.org/typeface-pt-mono/-/typeface-pt-mono-0.0.72.tgz",
+  "_shasum": "1ce4a636d335c77bb01712ba136a99f764647a04",
+  "_spec": "typeface-pt-mono",
+  "_where": "/Users/leafac/Projects/www.leafac.com",
+  "author": {
+    "name": "Kyle Mathews",
+    "email": "mathews.kyle@gmail.com"
+  },
+  "bundleDependencies": false,
+  "deprecated": false,
+  "description": "PT Mono typeface",
+  "keywords": [
+    "typeface",
+    "font",
+    "font family",
+    "google fonts",
+    "pt-mono"
+  ],
+  "license": "MIT",
+  "main": "index.css",
+  "name": "typeface-pt-mono",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/KyleAMathews/typefaces/tree/master/packages/pt-mono"
+  },
+  "version": "0.0.72"
+}

static/fonts/typeface-pt-serif/README.md

@@ -0,0 +1,34 @@
+
+# typeface-pt-serif
+
+The CSS and web font files to easily self-host “PT Serif”.
+
+## Install
+
+`npm install --save typeface-pt-serif`
+
+## Use
+
+Typefaces assume you’re using webpack to process CSS and files. Each typeface
+package includes all necessary font files (woff2, woff) and a CSS file with
+font-face declarations pointing at these files.
+
+You will need to have webpack setup to load css and font files. Many tools built
+with Webpack will work out of the box with Typefaces such as [Gatsby](https://github.com/gatsbyjs/gatsby)
+and [Create React App](https://github.com/facebookincubator/create-react-app).
+
+To use, simply require the package in your project’s entry file e.g.
+
+```javascript
+// Load PT Serif typeface
+require('typeface-pt-serif')
+```
+
+## About the Typefaces project.
+
+Our goal is to add all open source fonts to NPM to simplify using great fonts in
+our web projects. We’re currently maintaining 939 typeface packages
+including all typefaces on Google Fonts.
+
+If your favorite typeface isn’t published yet, [let us know](https://github.com/KyleAMathews/typefaces)
+and we’ll add it!

static/fonts/typeface-pt-serif/files-hash.json

@@ -0,0 +1 @@
+{"hash":"f24beeb816ce0f4678f1a9f6a6d421da","updatedAt":"2019-02-28T18:41:29.859Z"}

static/fonts/typeface-pt-serif/index.css

@@ -0,0 +1,52 @@
+/* pt-serif-400normal - latin */
+@font-face {
+  font-family: 'PT Serif';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 400;
+  src:
+    local('PT Serif Regular '),
+    local('PT Serif-Regular'),
+    url('./files/pt-serif-latin-400.woff2') format('woff2'), /* Super Modern Browsers */
+    url('./files/pt-serif-latin-400.woff') format('woff'); /* Modern Browsers */
+}
+
+/* pt-serif-400italic - latin */
+@font-face {
+  font-family: 'PT Serif';
+  font-style: italic;
+  font-display: swap;
+  font-weight: 400;
+  src:
+    local('PT Serif Regular italic'),
+    local('PT Serif-Regularitalic'),
+    url('./files/pt-serif-latin-400italic.woff2') format('woff2'), /* Super Modern Browsers */
+    url('./files/pt-serif-latin-400italic.woff') format('woff'); /* Modern Browsers */
+}
+
+/* pt-serif-700normal - latin */
+@font-face {
+  font-family: 'PT Serif';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 700;
+  src:
+    local('PT Serif Bold '),
+    local('PT Serif-Bold'),
+    url('./files/pt-serif-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
+    url('./files/pt-serif-latin-700.woff') format('woff'); /* Modern Browsers */
+}
+
+/* pt-serif-700italic - latin */
+@font-face {
+  font-family: 'PT Serif';
+  font-style: italic;
+  font-display: swap;
+  font-weight: 700;
+  src:
+    local('PT Serif Bold italic'),
+    local('PT Serif-Bolditalic'),
+    url('./files/pt-serif-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
+    url('./files/pt-serif-latin-700italic.woff') format('woff'); /* Modern Browsers */
+}
+

static/fonts/typeface-pt-serif/package.json

@@ -0,0 +1,48 @@
+{
+  "_from": "typeface-pt-serif",
+  "_id": "typeface-pt-serif@0.0.72",
+  "_inBundle": false,
+  "_integrity": "sha512-R/ZnbjL3H8mfeWrkYSU1fCk8TAsz+dyw+W5jnqlXXJPcsdu7sT/cGJGqx02zskaMeDCHwdNfTCORN8/NxN7x9w==",
+  "_location": "/typeface-pt-serif",
+  "_phantomChildren": {},
+  "_requested": {
+    "type": "tag",
+    "registry": true,
+    "raw": "typeface-pt-serif",
+    "name": "typeface-pt-serif",
+    "escapedName": "typeface-pt-serif",
+    "rawSpec": "",
+    "saveSpec": null,
+    "fetchSpec": "latest"
+  },
+  "_requiredBy": [
+    "#USER",
+    "/"
+  ],
+  "_resolved": "https://registry.npmjs.org/typeface-pt-serif/-/typeface-pt-serif-0.0.72.tgz",
+  "_shasum": "d8761c02a298bd0203e53a2028081b6f03246cd5",
+  "_spec": "typeface-pt-serif",
+  "_where": "/Users/leafac/Projects/www.leafac.com",
+  "author": {
+    "name": "Kyle Mathews",
+    "email": "mathews.kyle@gmail.com"
+  },
+  "bundleDependencies": false,
+  "deprecated": false,
+  "description": "PT Serif typeface",
+  "keywords": [
+    "typeface",
+    "font",
+    "font family",
+    "google fonts",
+    "pt-serif"
+  ],
+  "license": "MIT",
+  "main": "index.css",
+  "name": "typeface-pt-serif",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/KyleAMathews/typefaces/tree/master/packages/pt-serif"
+  },
+  "version": "0.0.72"
+}

static/styles.css

@@ -1,5 +1,5 @@
 body {
-  font-family: Charter, Georgia, serif;
+  font-family: "PT Serif", Charter, Georgia, serif;
   line-height: 1.5;
   max-width: 600px;
   padding: 0 2em;
@@ -11,8 +11,7 @@ a {
 }
 
 code {
-  font-family: Menlo, Consolas, monospace;
+  font-family: "PT Mono", Menlo, Consolas, monospace;
-  font-size: 0.875em;
 }
 
 h1,