Add fontWeights to theme

.github/main.workflow

@@ -1,14 +1,21 @@
 workflow "Lint and test" {
   on = "push"
-  resolves = ["lint", "test"]
+  resolves = ["install", "lint", "test"]
+}
+
+action "install" {
+  uses = "actions/npm@94e6933"
+  args = "ci"
 }
 
 action "lint" {
+  needs = ["install"]
   uses = "actions/npm@94e6933"
-  args = "lint"
+  args = "run lint"
 }
 
 action "test" {
-  args = "test"
+  needs = ["install"]
   uses = "actions/npm@94e6933"
+  args = "test"
 }

pages/doc-components/Header.js

@@ -51,7 +51,7 @@ const Header = ({router}) => (
               borderColor="gray.6"
               display="inline-block"
             >
-              <Text fontWeight="600" fontSize={1}>
+              <Text fontWeight="bold" fontSize={1}>
                 Menu
               </Text>
             </Box>

pages/doc-components/IndexHero.js

@@ -10,7 +10,7 @@ const IndexHero = () => (
         <Heading color="blue.4" fontSize={7} pb={3}>
           Primer Components
         </Heading>
-        <Text color="blue.2" fontSize={2} fontWeight={400} className="text-mono">
+        <Text color="blue.2" fontSize={2} className="text-mono">
           v{version}
         </Text>
       </Box>

src/__tests__/Heading.js

@@ -17,6 +17,12 @@ const theme = {
     normal: 1.5,
     condensed: 1.25,
     condensedUltra: 1
+  },
+  fontWeights: {
+    light: '300',
+    normal: '400',
+    semibold: '500',
+    bold: '600'
   }
 }
 
@@ -34,8 +40,16 @@ describe('Heading', () => {
   })
 
   it('respects fontWeight', () => {
-    expect(render(<Heading fontWeight="bold" theme={theme} />)).toHaveStyleRule('font-weight', 'bold')
-    expect(render(<Heading fontWeight="normal" theme={theme} />)).toHaveStyleRule('font-weight', 'normal')
+    expect(render(<Heading fontWeight="bold" theme={theme} />)).toHaveStyleRule('font-weight', theme.fontWeights.bold)
+    expect(render(<Heading fontWeight="normal" theme={theme} />)).toHaveStyleRule(
+      'font-weight',
+      theme.fontWeights.normal
+    )
+    expect(render(<Heading fontWeight="semibold" theme={theme} />)).toHaveStyleRule(
+      'font-weight',
+      theme.fontWeights.semibold
+    )
+    expect(render(<Heading fontWeight="light" theme={theme} />)).toHaveStyleRule('font-weight', theme.fontWeights.light)
   })
 
   it('respects lineHeight', () => {

src/__tests__/Text.js

@@ -41,8 +41,8 @@ describe('Text', () => {
   })
 
   it('respects fontWeight', () => {
-    expect(render(<Text fontWeight="bold" />)).toHaveStyleRule('font-weight', 'bold')
-    expect(render(<Text fontWeight="normal" />)).toHaveStyleRule('font-weight', 'normal')
+    expect(render(<Text fontWeight="bold" />)).toHaveStyleRule('font-weight', '600')
+    expect(render(<Text fontWeight="normal" />)).toHaveStyleRule('font-weight', '400')
   })
 
   it('respects lineHeight', () => {

src/theme.js

@@ -47,6 +47,12 @@ const theme = {
     ]),
     mono: fontStack(['SFMono-Regular', 'Consolas', 'Liberation Mono', 'Menlo', 'Courier', 'monospace'])
   },
+  fontWeights: {
+    light: 300,
+    normal: 400,
+    semibold: 500,
+    bold: 600
+  },
   colors,
   borders: [0, '1px solid'],
   fontSizes,