Update to new website

.gitignore

@@ -107,3 +107,5 @@ website/demos/sense2vec/
 # Website
 website/_deploy.sh
 website/package.json
+
+website/blog/announcement.jade

website/404.jade

@@ -1,7 +1,11 @@
-//- ----------------------------------
 //- 💫 404 ERROR
-//- ----------------------------------
 
 include _includes/_mixins
 
-p.u-text-large.u-text-center Ooops, this page does not exist. Click #[a(href="javascript:history.go(-1)") here] to go back.
++landing-header
+    h1.c-landing__title.u-heading-0
+        | Ooops, this page#[br]
+        | does not exist!
+
+    h2.c-landing__title.u-heading-3.u-padding-small
+        a(href="javascript:history.go(-1)") Click here to go back.

website/README.md

@@ -1,13 +1,13 @@
 <a href="https://explosion.ai"><img src="https://explosion.ai/assets/img/logo.svg" width="125" height="125" align="right" /></a>
 
-# Source files for the spacy.io website and docs
+# spacy.io website and docs
 
 The [spacy.io](https://spacy.io) website is implemented in [Jade (aka Pug)](https://www.jade-lang.org), and is built or served by [Harp](https://harpjs.com). Jade is an extensible templating language with a readable syntax, that compiles to HTML.
 The website source makes extensive use of Jade mixins, so that the design system is abstracted away from the content you're
 writing. You can read more about our approach in our blog post, ["Rebuilding a Website with Modular Markup"](https://explosion.ai/blog/modular-markup).
 
 
-## Building the site
+## Viewing the site locally
 
 ```bash
 sudo npm install --global harp
@@ -17,3 +17,102 @@ harp server
 ```
 
 This will serve the site on [http://localhost:9000](http://localhost:9000).
+
+
+## Making changes to the site
+
+The docs can always use another example or more detail, and they should always be up to date and not misleading. If you see something, say something – we always appreciate a [pull request](https://github.com/explosion/spaCy/pulls). To quickly find the correct file to edit, simply click on the "Suggest edits" button at the bottom of a page.
+
+### File structure
+
+While all page content lives in the `.jade` files, article meta (page titles, sidebars etc.) is stored as JSON. Each folder contains a `_data.json` with all required meta for its files.
+
+For simplicity, all sites linked in the [tutorials](https://spacy.io/docs/usage/tutorials) and [showcase](https://spacy.io/docs/usage/showcase) are also stored as JSON. So in order to edit those pages, there's no need to dig into the Jade files – simply edit the [`_data.json`](website/docs/usage/_data.json).
+
+### Markup language and conventions
+
+Jade/Pug is a whitespace-sensitive markup language that compiles to HTML. Indentation is used to nest elements, and for template logic, like `if`/`else` or `for`, mainly used to iterate over objects and arrays in the meta data. It also allows inline JavaScript expressions.
+
+For an overview of Harp and Jade, see [this blog post](https://ines.io/blog/the-ultimate-guide-static-websites-harp-jade). For more info on the Jade/Pug syntax, check out their [documentation](https://pugjs.org).
+
+In the [spacy.io](https://spacy.io) source, we use 4 spaces to indent and hard-wrap at 80 characters.
+
+```pug
+p This is a very short paragraph. It stays inline.
+
+p
+    |  This is a much longer paragraph. It's hard-wrapped at 80 characters to
+    |  make it easier to read on GitHub and in editors that do not have soft
+    |  wrapping enabled. To prevent Jade from interpreting each line as a new
+    |  element, it's prefixed with a pipe and two spaces. This ensures that no
+    |  spaces are dropped – for example, if your editor strips out trailing
+    |  whitespace by default. Inline links are added using the inline syntax,
+    |  like this: #[+a("https://google.com") Google].
+```
+
+Note that for external links, `+a("...")` is used instead of `a(href="...")` – it's a mixin that takes care of adding all required attributes.
+
+### Mixins
+
+Each file includes a collection of [custom mixins](website/_includes/_mixins.jade) that make it easier to add content components – no HTML or class names required.
+
+For example:
+```pug
+//- Bulleted list
+
++list
+    +item This is a list item.
+    +item This is another list item.
+
+//- Table with header
+
++table([ "Header one", "Header two" ])
+    +row
+        +cell Table cell
+        +cell Another one
+
+    +row
+        +cell And one more.
+        +cell And the last one.
+
+//- Headlines with optional permalinks
+
++h(2, "link-id") Headline 2 with link to #link-id
+```
+
+Code blocks are implemented using the `+code` or `+aside-code` (to display them in the sidebar). A `.` is added after the mixin call to preserve whitespace:
+
+```pug
++code("This is a label").
+    import spacy
+    en_nlp = spacy.load('en')
+    en_doc = en_nlp(u'Hello, world. Here are two sentences.')
+```
+
+You can find the documentation for the available mixins in [`_includes/_mixins.jade`](website/_includes/_mixins.jade).
+
+### Linking to the Github repo
+
+Since GitHub links can be long and tricky, you can use the `gh()` function to generate them automatically for spaCy and all repositories owned by [explosion](https://github.com/explosion):
+
+```pug
+//- Syntax: gh(repo, [file], [branch])
+
++src(gh("spaCy", "spacy/matcher.pyx"))
+
+//- https://github.com/explosion/spaCy/blob/master/spacy/matcher.pyx
+
+```
+
+`+src()` creates a link with a little source icon to indicate it's linking to a code source.
+
+### Most common causes of compile errors
+
+| Problem | Fix |
+| --- | --- |
+| JSON formatting errors | make sure last elements of objects don't end with commas and/or use a JSON linter |
+| unescaped characters like `<` or `>` and sometimes `'` in inline elements | replace with encoded version: `&lt;`, `&gt;` etc. |
+| "Cannot read property 'call' of undefined" / "foo is not a function" | make sure mixin names are spelled correctly and mixins file is included with the correct path |
+| "no closing bracket found" | make sure inline elements end with a `]`, like `#[code spacy.load('en')]` and for nested inline elements, make sure they're all on the same line and contain spaces between them (**bad:** `#[+api("doc")#[code Doc]]`) |
+
+If Harp fails and throws a Jade error, don't take the reported line number at face value – it's often wrong, as the page is compiled from templates and several files.

website/_data.json

@@ -2,27 +2,27 @@
     "index": {
         "landing": true,
         "logos": [
-            [
-                ["chartbeat", "https://chartbeat.com"],
-                ["socrata", "https://www.socrata.com"],
-                ["chattermill", "https://chattermill.io"],
-                ["cytora", "http://www.cytora.com"],
-                ["signaln", "http://signaln.com"],
-                ["duedil", "https://www.duedil.com/"],
-                ["spyjack", "https://spyjack.io"]
-            ],
-            [
-                ["keyreply", "https://keyreply.com/"],
-                ["dato", "https://dato.com"],
-                ["kip", "http://kipthis.com"],
-                ["wonderflow", "http://www.wonderflow.co"],
-                ["foxtype", "https://foxtype.com"]
-            ],
-            [
-                ["synapsify", "http://www.gosynapsify.com"],
-                ["stitchfix", "https://www.stitchfix.com/"],
-                ["wayblazer", "http://wayblazer.com"]
-            ]
+            {
+                "chartbeat": "https://chartbeat.com",
+                "cytora": "http://www.cytora.com",
+                "duedil": "https://www.duedil.com",
+                "socrata": "https://www.socrata.com",
+                "indico": "https://indico.io",
+                "signaln": "http://signaln.com"
+            },
+            {
+                "keyreply": "https://keyreply.com",
+                "dato": "https://dato.com",
+                "kip": "http://kipthis.com",
+                "wonderflow": "http://www.wonderflow.co",
+                "foxtype": "https://foxtype.com"
+            },
+            {
+                "synapsify": "http://www.gosynapsify.com",
+                "stitchfix": "https://www.stitchfix.com",
+                "wayblazer": "http://wayblazer.com",
+                "chattermill": "https://chattermill.io"
+            }
         ]
     },
 
@@ -32,28 +32,10 @@
 
     "404": {
         "title": "404 Error",
-        "asides": false
+        "landing": true
     },
 
-    "styleguide": {
-        "title" : "Styleguide",
-        "asides": true,
-
-        "sidebar": {
-            "About": [
-                ["Introduction", "#section-introduction", "introduction"]
-            ],
-            "Design": [
-                ["Colors", "#section-colors", "colors"],
-                ["Logo", "#section-logo", "logo"],
-                ["Typography", "#section-typography", "typography"],
-                ["Grid", "#section-grid", "grid"],
-                ["Elements", "#section-elements", "elements"],
-                ["Components", "#section-components", "components"]
-            ],
-            "Code": [
-                ["Source", "#section-source", "source"]
-            ]
-        }
+    "announcement" : {
+        "title": "Important Announcement"
     }
 }

website/_harp.json

@@ -1,17 +1,19 @@
 {
     "globals": {
-        "title": "spaCy.io",
+        "title": "spaCy",
         "description": "spaCy is a free open-source library featuring state-of-the-art speed and accuracy and a powerful Python API.",
 
         "SITENAME": "spaCy",
-        "SLOGAN": "Industrial-strength Natural Language Processing",
+        "SLOGAN": "Industrial-strength Natural Language Processing in Python",
         "SITE_URL": "https://spacy.io",
         "EMAIL": "[email protected]",
 
         "COMPANY": "Explosion AI",
         "COMPANY_URL": "https://explosion.ai",
         "DEMOS_URL": "https://demos.explosion.ai",
 
+        "SPACY_VERSION": "1.1",
+
         "SOCIAL": {
             "twitter": "spacy_io",
             "github": "explosion",
@@ -21,9 +23,39 @@
         "SCRIPTS" : [ "main", "prism" ],
         "DEFAULT_SYNTAX" : "python",
         "ANALYTICS": "UA-58931649-1",
+        "MAILCHIMP": {
+            "user": "spacy.us12",
+            "id": "83b0498b1e7fa3c91ce68c3f1",
+            "list": "89ad33e698"
+        },
+
+        "NAVIGATION": {
+            "Home": "/",
+            "Docs": "/docs",
+            "Demos": "/docs/usage/showcase",
+            "Blog": "https://explosion.ai/blog"
+        },
+
+        "FOOTER": {
+            "spaCy": {
+                "Usage": "/docs/usage",
+                "API Reference": "/docs/api",
+                "Tutorials": "/docs/usage/tutorials",
+                "Showcase": "/docs/usage/showcase"
+            },
+            "Support": {
+                "Issue Tracker": "https://github.com/explosion/spaCy/issues",
+                "StackOverflow": "http://stackoverflow.com/questions/tagged/spacy",
+                "Reddit usergroup": "https://www.reddit.com/r/spacynlp/",
+                "Gitter chat": "https://gitter.im/explosion/spaCy"
+            },
+            "Connect": {
+                "Twitter": "https://twitter.com/spacy_io",
+                "GitHub": "https://github.com/explosion/spaCy",
+                "Blog": "https://explosion.ai/blog",
+                "Contact": "mailto:[email protected]"
+            }
+        }
 
-        "SPACY_VERSION": "1.0",
-        "SPACY_STARS": "2500",
-        "GITHUB": { "user": "explosion", "repo": "spacy" }
     }
 }

website/_includes/_footer.jade

@@ -1,17 +1,30 @@
-//- ----------------------------------
 //- 💫 INCLUDES > FOOTER
-//- ----------------------------------
 
 include _mixins
 
-footer.o-footer.o-inline-list.u-pattern.u-text-center.u-text-label.u-text-strong
-    span © #{new Date().getFullYear()} #[+a(COMPANY_URL, true)=COMPANY]
+footer.o-footer.u-text.u-border-dotted
+    +grid.o-content
+        each group, label in FOOTER
+            +grid-col("quarter")
+                ul
+                    li.u-text-label.u-color-subtle=label
 
-    +a(COMPANY_URL + "/legal", true) Legal / Imprint
-    a(href="mailto:#{EMAIL}") #[+icon("mail", 16)]
+                    each url, item in group
+                        li
+                            +a(url)(target=url.includes("http") ? "_blank" : "")=item
 
-    +a("https://twitter.com/" + SOCIAL.twitter)(aria-label="Twitter")
-        +icon("twitter", 20)
+        if SECTION != "docs"
+            +grid-col("quarter")
+                include _newsletter
 
-    +a("https://github.com/" + SOCIAL.github + "/spaCy")(aria-label="GitHub")
-        +icon("github", 20)
+    if SECTION == "docs"
+        .o-content.o-block.u-border-dotted
+            include _newsletter
+
+    .o-inline-list.u-text-center.u-text-tiny.u-color-subtle
+        span © #{new Date().getFullYear()} #[+a(COMPANY_URL, true)=COMPANY]
+
+        +a(COMPANY_URL, true)
+            +svg("graphics", "explosion", 45).o-icon.u-color-theme.u-grayscale
+
+        +a(COMPANY_URL + "/legal", true) Legal / Imprint

website/_includes/_functions.jade

@@ -1,6 +1,11 @@
-//- ----------------------------------
 //- 💫 INCLUDES > FUNCTIONS
-//- ----------------------------------
+
+//- More descriptive variables for current.path and current.source
+
+- CURRENT = current.source
+- SECTION = current.path[0]
+- SUBSECTION = current.path[1]
+
 
 //- Add prefixes to items of an array (for modifier CSS classes)
 
@@ -9,3 +14,10 @@
 -           return prefix + '--' + arg;
 -       }).join(' ');
 -   }
+
+
+//- Generate GitHub links
+
+-   function gh(repo, filepath, branch) {
+-       return 'https://github.com/' + SOCIAL.github + '/' + repo + (filepath ? '/blob/' + (branch || 'master') + '/' + filepath : '' );
+-   }