Fix imports, add build script

docs/grid/floats.md

@@ -1,4 +1,4 @@
-import { Alert } from '../ui'
+import { Alert } from '../../site/ui'
 
 export const meta = {
   title: 'Floats / Grid / Docs / TACHYONS',

docs/grid/tables.md

@@ -1,4 +1,4 @@
-import { Alert } from '../ui'
+import { Alert } from '../../site/ui'
 
 export const meta = {
   title: 'Tables / Grid / Docs / TACHYONS',

docs/migrating.md

@@ -1,13 +1,19 @@
 # Migrating
 
+This documents migrating to the latest version of Tachyons, v7.
+
 ## Media queries
 
+`CLASS-ns` => `CLASS-m CLASS-l`
+
 ## Colors
 
 ## Border colors
 
 ## Class changes
 
+The following class names have changed, please update them in your apps.
+
 - `pre` => `ws-pre`
 - `nowrap` => `ws-nowrap`
 - `paX` => `pX`

docs/scales.md

@@ -1,4 +1,4 @@
-import { BigQuote } from './ui'
+import { BigQuote } from '../site/ui'
 
 export const meta = {
   title: 'Scales / Overview / Docs / TACHYONS',

docs/typography/line-height.md

@@ -1,4 +1,4 @@
-import { BigQuote } from '../ui'
+import { BigQuote } from '../../site/ui'
 
 export const meta =  {
   title: 'Line Height / Typography / Docs / TACHYONS',
@@ -11,7 +11,7 @@ export const meta =  {
 
 **line-height** is a css property
 
-**lead** [*rhyming with red*]: 
+**lead** [*rhyming with red*]:
 Originally a strip of soft metal used for vertical spacing between lines of type. Now meaning the vertical distance from the baseline of one line to the baseline of the next. Also called **leading**.
 
 “Many people with cognitive disabilities have trouble tracking lines of text when a block of text is single spaced. Providing spacing between 1.5 to 2 allows them to start a new line more easily once they have finished the previous one.”
@@ -68,7 +68,7 @@ Line-height affects how easy it is to read a piece of text, so having a well con
 </h4>
 ```
 
-### Solid Leading (1) 
+### Solid Leading (1)
 
 ```
 <h4 class="lh-solid">Paragraph content</h4>

docs/typography/measure.md

@@ -1,4 +1,4 @@
-import MeasureHero from '../ui/MeasureHero'
+import MeasureHero from '../../site/ui/MeasureHero'
 
 export const meta =  {
   title: 'Measure / Typography / Docs / TACHYONS',

docs/typography/scale.md

@@ -1,6 +1,6 @@
-import { BigQuote } from '../ui'
-import ScaleHero from '../ui/ScaleHero'
-import FontSizes from '../ui/FontSizes'
+import { BigQuote } from '../../site/ui'
+import ScaleHero from '../../site/ui/ScaleHero'
+import FontSizes from '../../site/ui/FontSizes'
 
 export const meta =  {
   title: 'Scale / Typography / Docs / TACHYONS',

package.json

@@ -51,5 +51,8 @@
     "design",
     "responsive",
     "performance"
-  ]
+  ],
+  "dependencies": {
+    "@compositor/kit": "^1.0.47"
+  }
 }

site/data/components.json

@@ -492,14 +492,6 @@
     }
   ],
   "forms": [
-    {
-      "name": "checkbox-list",
-      "title": "Checkbox List",
-      "section": "forms",
-      "src": "forms/checkbox-list.html",
-      "slug": "/docs/components/forms/checkbox-list",
-      "importPath": "../../../..//docs/components/forms/checkbox-list.html"
-    },
     {
       "name": "input-text-label",
       "title": "Input Text Label",
@@ -508,6 +500,14 @@
       "slug": "/docs/components/forms/input-text-label",
       "importPath": "../../../..//docs/components/forms/input-text-label.html"
     },
+    {
+      "name": "checkbox-list",
+      "title": "Checkbox List",
+      "section": "forms",
+      "src": "forms/checkbox-list.html",
+      "slug": "/docs/components/forms/checkbox-list",
+      "importPath": "../../../..//docs/components/forms/checkbox-list.html"
+    },
     {
       "name": "newsletter-subscription",
       "title": "Newsletter Subscription",
@@ -575,40 +575,6 @@
       "importPath": "../../../..//docs/components/headers/startup-hero.html"
     }
   ],
-  "links": [
-    {
-      "name": "animate-background-color",
-      "title": "Animate Background Color",
-      "section": "links",
-      "src": "links/animate-background-color.html",
-      "slug": "/docs/components/links/animate-background-color",
-      "importPath": "../../../..//docs/components/links/animate-background-color.html"
-    },
-    {
-      "name": "animate-color",
-      "title": "Animate Color",
-      "section": "links",
-      "src": "links/animate-color.html",
-      "slug": "/docs/components/links/animate-color",
-      "importPath": "../../../..//docs/components/links/animate-color.html"
-    },
-    {
-      "name": "dim-no-underline",
-      "title": "Dim No Underline",
-      "section": "links",
-      "src": "links/dim-no-underline.html",
-      "slug": "/docs/components/links/dim-no-underline",
-      "importPath": "../../../..//docs/components/links/dim-no-underline.html"
-    },
-    {
-      "name": "underline-on-hover",
-      "title": "Underline On Hover",
-      "section": "links",
-      "src": "links/underline-on-hover.html",
-      "slug": "/docs/components/links/underline-on-hover",
-      "importPath": "../../../..//docs/components/links/underline-on-hover.html"
-    }
-  ],
   "layout": [
     {
       "name": "aspect-ratio-16x9",
@@ -939,14 +905,38 @@
       "importPath": "../../../..//docs/components/layout/two-column.html"
     }
   ],
-  "marketing": [
+  "links": [
     {
-      "name": "iphone-app",
-      "title": "Iphone App",
-      "section": "marketing",
-      "src": "marketing/iphone-app.html",
-      "slug": "/docs/components/marketing/iphone-app",
-      "importPath": "../../../..//docs/components/marketing/iphone-app.html"
+      "name": "animate-background-color",
+      "title": "Animate Background Color",
+      "section": "links",
+      "src": "links/animate-background-color.html",
+      "slug": "/docs/components/links/animate-background-color",
+      "importPath": "../../../..//docs/components/links/animate-background-color.html"
+    },
+    {
+      "name": "animate-color",
+      "title": "Animate Color",
+      "section": "links",
+      "src": "links/animate-color.html",
+      "slug": "/docs/components/links/animate-color",
+      "importPath": "../../../..//docs/components/links/animate-color.html"
+    },
+    {
+      "name": "dim-no-underline",
+      "title": "Dim No Underline",
+      "section": "links",
+      "src": "links/dim-no-underline.html",
+      "slug": "/docs/components/links/dim-no-underline",
+      "importPath": "../../../..//docs/components/links/dim-no-underline.html"
+    },
+    {
+      "name": "underline-on-hover",
+      "title": "Underline On Hover",
+      "section": "links",
+      "src": "links/underline-on-hover.html",
+      "slug": "/docs/components/links/underline-on-hover",
+      "importPath": "../../../..//docs/components/links/underline-on-hover.html"
     }
   ],
   "lists": [
@@ -1079,6 +1069,16 @@
       "importPath": "../../../..//docs/components/lists/title-text.html"
     }
   ],
+  "marketing": [
+    {
+      "name": "iphone-app",
+      "title": "Iphone App",
+      "section": "marketing",
+      "src": "marketing/iphone-app.html",
+      "slug": "/docs/components/marketing/iphone-app",
+      "importPath": "../../../..//docs/components/marketing/iphone-app.html"
+    }
+  ],
   "nav": [
     {
       "name": "fixed-semi-transparent",

site/now.json

@@ -0,0 +1,6 @@
+{
+  "version": 2,
+  "builds": [
+    { "src": "next.config.js", "use": "@now/next" }
+  ]
+}

site/package.json

@@ -8,12 +8,12 @@
   "license": "MIT",
   "scripts": {
     "start": "next start",
-    "build": "next build",
     "build:components": "node build/components",
     "build:modules": "node build/modules",
     "deploy": "now --public",
     "dev": "next",
     "format": "prettier *.js {ui,pages}/*.js pages/**/*.js pages/{components,docs}/**/*.js --write --no-semi --single-quote",
+    "now-build": "npm run prepare && next build && next export -o dist",
     "prepare": "npm run build:modules && npm run build:components && npm run format"
   },
   "contributors": [

site/pages/docs/themes/skins-pseudo.js

@@ -1,6 +1,6 @@
 import React from 'react'
 
 import withDocLayout from '../../../ui/withDocLayout'
-import SkinsAnimations, { meta } from '../../../../docs/themes/skins-pseudo.md'
+import SkinsAnimations, { meta } from '../../../../docs/themes/colors-pseudo.md'
 
 export default withDocLayout(SkinsAnimations, meta)

site/pages/sites.js

@@ -1,7 +1,7 @@
 import React from 'react'
 
 import withDocLayout from '../ui/withDocLayout'
-import Doc from '../sites.md'
+import Doc from '../../docs/sites.md'
 
 export default withDocLayout(Doc, {
   title: 'Sites using TACHYONS',