Merge branch 'master' into versioning

.gitignore

@@ -0,0 +1,4 @@
+node_modules
+.DS_Store
+lib/core/metadata.js
+yarn.lock

docs/doc-markdown.md

@@ -1,11 +1,6 @@
 ---
 id: doc-markdown
-title: Documentation Markdown Features
-layout: docs
-category: Docusaurus
-permalink: docs/en/doc-markdown.html
-previous: site-config
-next: translation
+title: Markdown Features
 ---
 
 Docusaurus supports some extra features when writing documentation in markdown.

docs/getting-started.md

@@ -1,10 +1,6 @@
 ---
 id: getting-started
-title: Docusaurus
-layout: docs
-category: Docusaurus
-permalink: docs/en/getting-started.html
-next: site-config
+title: Up and Running
 ---
 
 ## Getting Started
@@ -230,5 +226,5 @@ DEPLOY_USER=deltice GIT_USER=test-site-bot CIRCLE_PROJECT_USERNAME=deltice CIRCL
 
 ## More Information
 
-For details on how to set up translation support, read [here](/docs/en/translation.md).
-For details on how to set up documentation search, read [here](/docs/en/search.md).
+For details on how to set up translation support, read [here](translation.md).
+For details on how to set up documentation search, read [here](search.md).

docs/guides-navigation.md

@@ -0,0 +1,115 @@
+---
+id: navigation
+title: Navigation and Sidebars
+---
+
+## New Hidden Docs
+
+New markdown files within `docs` will show up as pages on the website. Creating a file such as "docs/getting-started.md" will enable the new page `/docs/getting-started.html`.
+
+To change the id (link name) of the file, set the `id` field in the markdown header. At the top of `getting-started.md`:
+
+```
+---
+id: intro
+title: Getting Started
+---
+
+My *new content* here..
+```
+
+Now, the doc can be accessed from `/docs/intro.html`.
+
+
+## Adding Docs to a Sidebar
+
+Now we want our new page to show up on the sidebar. We configure the order of the sidebar in `website/sidebars.json`.
+
+Within `sidebars.json`, add the doc ID within an existing sidebar/category:
+
+```
+{
+  "docs": {
+    "Getting Started": [
+      "getting-started"
+```
+
+Or you can create a new category within the sidebar:
+
+```
+{
+  "docs": {
+    ...
+    "My New Sidebar Category": [
+      "getting-started"
+    ],
+    ...
+```
+
+## New Hidden Sections
+
+You can also put the doc in a new sidebar. In this case we are creating a `intro` section within `sidebars.json`.
+
+```
+{
+  "intro": {
+    "My Sidebar Category": [
+      "getting-started"
+    ],
+  },
+  ...
+```
+
+Keep in mind, until you add the section to the nav bar (below), this new "intro" section of the site will be hidden with no links going to it.
+
+
+
+## Adding doc to site nav bar
+
+After creating a new section of the site by adding to `sidebars.json`, you can link to the new doc from the top navigation bar by editing the `headerLinks` field of `siteConfig.js`.
+
+```
+headerLinks: [
+  ...
+  {doc: 'intro', label: 'Getting Started'},
+  ...
+],
+```
+
+## Custom page links in nav bar
+
+To add custom pages to the navigation bar, entries can be added to the `headerLinks` of `siteConfig.js`. For example, if we have a page within `website/pages/help.js`, we can link to it by adding the following:
+
+```
+headerLinks: [
+  ...
+  {page: 'help', label: 'Help'},
+  ...
+],
+```
+
+## External links in nav bar
+
+Custom links can be added to the nav bar with the following entry in `siteConfig.js`:
+
+```
+headerLinks: [
+  ...
+  {href: 'https://github.com/facebookexperimental/Docusaurus', label: 'GitHub'},
+  ...
+],
+```
+
+To open external links in a new tab, provide an `external: true` flag within the header link config.
+
+## Search bar position in nav bar
+
+If search is enabled on your site, your search bar will appear to the right of your links. If you want to put the search bar between links in the header, add a search entry in the `headerLinks` config array:
+
+```
+headerLinks: [
+  {doc: 'foo', label: 'Foo'},
+  {search: true},
+  {doc: 'bar', label: 'Bar'},
+],
+```

docs/search.md

@@ -1,10 +1,6 @@
 ---
 id: search
-title: Documentation Search
-layout: docs
-category: Docusaurus
-permalink: docs/en/search.html
-previous: translation
+title: Enabling Search
 ---
 
 ## Algolia Search Integration
@@ -23,4 +19,3 @@ const siteConfig = {
   ...
 }
 ```
-

docs/site-config.md

@@ -1,11 +1,6 @@
 ---
 id: site-config
-title: Customizing siteConfig
-layout: docs
-category: Docusaurus
-permalink: docs/en/site-config.html
-previous: getting-started
-next: doc-markdown
+title: siteConfig.js
 ---
 
 A large part of site configuration is done by editing the `siteConfig.js` file.
@@ -133,4 +128,3 @@ const siteConfig = {
 module.exports = siteConfig;
 
 ```
-

docs/translation.md

@@ -1,11 +1,6 @@
 ---
 id: translation
-title: Translations with Docusaurus
-layout: docs
-category: Docusaurus
-permalink: docs/en/translation.html
-previous: doc-markdown
-next: search
+title: Translations
 ---
 
 ## Overview

lib/build-files.js

@@ -10,10 +10,9 @@
  */
 
 require("babel-register")({
-  ignore: false,
   babelrc: false,
   plugins: [require("./server/translate-plugin.js")],
-  presets: ["react"]
+  presets: ["react", "latest", "stage-0"]
 });
 
 const generate = require("./server/generate.js");

lib/core/DocsSidebar.js

@@ -18,6 +18,10 @@ class DocsSidebar extends React.Component {
   render() {
     let sidebar = this.props.metadata.sidebar;
     let docsCategories = readCategories(sidebar);
+    const categoryName = docsCategories[this.props.metadata.language][0].name;
+    if (!categoryName) {
+      return null;
+    }
     return (
       <Container className="docsNavContainer" id="docsNav" wrapper={false}>
         <SideNav

lib/core/Prism.js

@@ -18,17 +18,17 @@ const React = require("react");
 // Private helper vars
 const lang = /\blang(?:uage)?-(?!\*)(\w+)\b/i;
 
-const _ = (Prism = {
+const Prism = {
   util: {
     encode(tokens) {
       if (tokens instanceof Token) {
         return new Token(
           tokens.type,
-          _.util.encode(tokens.content),
+          Prism.util.encode(tokens.content),
           tokens.alias
         );
-      } else if (_.util.type(tokens) === "Array") {
-        return tokens.map(_.util.encode);
+      } else if (Prism.util.type(tokens) === "Array") {
+        return tokens.map(Prism.util.encode);
       } else {
         return tokens
           .replace(/&/g, "&")
@@ -43,7 +43,7 @@ const _ = (Prism = {
 
     // Deep clone a language definition (e.g. to extend it)
     clone(o) {
-      const type = _.util.type(o);
+      const type = Prism.util.type(o);
 
       switch (type) {
         case "Object":
@@ -51,7 +51,7 @@ const _ = (Prism = {
 
           for (const key in o) {
             if (o.hasOwnProperty(key)) {
-              clone[key] = _.util.clone(o[key]);
+              clone[key] = Prism.util.clone(o[key]);
             }
           }
 
@@ -62,7 +62,7 @@ const _ = (Prism = {
           return (
             o.map &&
             o.map(v => {
-              return _.util.clone(v);
+              return Prism.util.clone(v);
             })
           );
       }
@@ -73,7 +73,7 @@ const _ = (Prism = {
 
   languages: {
     extend(id, redef) {
-      const lang = _.util.clone(_.languages[id]);
+      const lang = Prism.util.clone(Prism.languages[id]);
 
       for (const key in redef) {
         lang[key] = redef[key];
@@ -92,7 +92,7 @@ const _ = (Prism = {
      * @param root The object that contains `inside`. If equal to Prism.languages, it can be omitted.
      */
     insertBefore(inside, before, insert, root) {
-      root = root || _.languages;
+      root = root || Prism.languages;
       const grammar = root[inside];
 
       if (arguments.length == 2) {
@@ -124,7 +124,7 @@ const _ = (Prism = {
       }
 
       // Update references in other language definitions
-      _.languages.DFS(_.languages, function(key, value) {
+      Prism.languages.DFS(Prism.languages, function(key, value) {
         if (value === root[inside] && key != inside) {
           this[key] = ret;
         }
@@ -139,10 +139,10 @@ const _ = (Prism = {
         if (o.hasOwnProperty(i)) {
           callback.call(o, i, o[i], type || i);
 
-          if (_.util.type(o[i]) === "Object") {
-            _.languages.DFS(o[i], callback);
-          } else if (_.util.type(o[i]) === "Array") {
-            _.languages.DFS(o[i], callback, i);
+          if (Prism.util.type(o[i]) === "Object") {
+            Prism.languages.DFS(o[i], callback);
+          } else if (Prism.util.type(o[i]) === "Array") {
+            Prism.languages.DFS(o[i], callback, i);
           }
         }
       }
@@ -155,7 +155,7 @@ const _ = (Prism = {
     );
 
     for (let i = 0, element; (element = elements[i++]); ) {
-      _.highlightElement(element, async === true, callback);
+      Prism.highlightElement(element, async === true, callback);
     }
   },
 
@@ -171,7 +171,7 @@ const _ = (Prism = {
 
     if (parent) {
       language = (parent.className.match(lang) || [, ""])[1];
-      grammar = _.languages[language];
+      grammar = Prism.languages[language];
     }
 
     // Set language on the element, if not present
@@ -209,20 +209,20 @@ const _ = (Prism = {
       code
     };
 
-    _.hooks.run("before-highlight", env);
+    Prism.hooks.run("before-highlight", env);
 
-    if (async && _self.Worker) {
-      const worker = new Worker(_.filename);
+    if (async && Prismself.Worker) {
+      const worker = new Worker(Prism.filename);
 
       worker.onmessage = function(evt) {
         env.highlightedCode = Token.stringify(JSON.parse(evt.data), language);
 
-        _.hooks.run("before-insert", env);
+        Prism.hooks.run("before-insert", env);
 
         env.element.innerHTML = env.highlightedCode;
 
         callback && callback.call(env.element);
-        _.hooks.run("after-highlight", env);
+        Prism.hooks.run("after-highlight", env);
       };
 
       worker.postMessage(
@@ -232,25 +232,25 @@ const _ = (Prism = {
         })
       );
     } else {
-      env.highlightedCode = _.highlight(env.code, env.grammar, env.language);
+      env.highlightedCode = Prism.highlight(env.code, env.grammar, env.language);
 
-      _.hooks.run("before-insert", env);
+      Prism.hooks.run("before-insert", env);
 
       env.element.innerHTML = env.highlightedCode;
 
       callback && callback.call(element);
 
-      _.hooks.run("after-highlight", env);
+      Prism.hooks.run("after-highlight", env);
     }
   },
 
   highlight(text, grammar, language) {
-    const tokens = _.tokenize(text, grammar);
-    return Token.stringify(_.util.encode(tokens), language);
+    const tokens = Prism.tokenize(text, grammar);
+    return Token.stringify(Prism.util.encode(tokens), language);
   },
 
   tokenize(text, grammar, language) {
-    const Token = _.Token;
+    const Token = Prism.Token;
 
     const strarr = [text];
 
@@ -270,7 +270,7 @@ const _ = (Prism = {
       }
 
       let patterns = grammar[token];
-      patterns = _.util.type(patterns) === "Array" ? patterns : [patterns];
+      patterns = Prism.util.type(patterns) === "Array" ? patterns : [patterns];
 
       for (let j = 0; j < patterns.length; ++j) {
         let pattern = patterns[j],
@@ -319,7 +319,7 @@ const _ = (Prism = {
 
             const wrapped = new Token(
               token,
-              inside ? _.tokenize(match, inside) : match,
+              inside ? Prism.tokenize(match, inside) : match,
               alias
             );
 
@@ -342,7 +342,7 @@ const _ = (Prism = {
     all: {},
 
     add(name, callback) {
-      const hooks = _.hooks.all;
+      const hooks = Prism.hooks.all;
 
       hooks[name] = hooks[name] || [];
 
@@ -350,7 +350,7 @@ const _ = (Prism = {
     },
 
     run(name, env) {
-      const callbacks = _.hooks.all[name];
+      const callbacks = Prism.hooks.all[name];
 
       if (!callbacks || !callbacks.length) {
         return;
@@ -361,9 +361,9 @@ const _ = (Prism = {
       }
     }
   }
-});
+};
 
-const Token = (_.Token = function(type, content, alias) {
+const Token = (Prism.Token = function(type, content, alias) {
   this.type = type;
   this.content = content;
   this.alias = alias;
@@ -374,7 +374,7 @@ Token.reactify = function(o, language, parent, key) {
     return o;
   }
 
-  if (_.util.type(o) === "Array") {
+  if (Prism.util.type(o) === "Array") {
     return o.map((element, i) => {
       return Token.reactify(element, language, o, i);
     });
@@ -395,11 +395,11 @@ Token.reactify = function(o, language, parent, key) {
   }
 
   if (o.alias) {
-    const aliases = _.util.type(o.alias) === "Array" ? o.alias : [o.alias];
+    const aliases = Prism.util.type(o.alias) === "Array" ? o.alias : [o.alias];
     Array.prototype.push.apply(env.classes, aliases);
   }
 
-  _.hooks.run("wrap", env);
+  Prism.hooks.run("wrap", env);
 
   env.attributes.className = env.classes.join(" ");
 
@@ -1100,7 +1100,7 @@ Prism.languages.yaml = {
 
 const PrismComponent = React.createClass({
   statics: {
-    _
+    Prism
   },
   getDefaultProps() {
     return {
@@ -1123,10 +1123,10 @@ const PrismComponent = React.createClass({
         }
       });
     }
-    const grammar = _.languages[this.props.language];
+    const grammar = Prism.languages[this.props.language];
     return (
       <pre className={"prism language-" + this.props.language}>
-        {Token.reactify(_.tokenize(this.props.children, grammar))}
+        {Token.reactify(Prism.tokenize(this.props.children, grammar))}
         {lines.map((line, ii) => {
           return (
             <div

lib/server/readMetadata.js

@@ -32,7 +32,7 @@ if (fs.existsSync(CWD + "/languages.js")) {
 }
 
 function readSidebar() {
-  let allSidebars = require(CWD + "/sidebar.json");
+  let allSidebars = require(CWD + "/sidebars.json");
   Object.assign(allSidebars, versionFallback.sidebarData());
 
   const order = {};
@@ -142,6 +142,7 @@ function processMetadata(file) {
   const order = readSidebar();
   const id = metadata.localized_id;
 
+  if (order[id]) {
     metadata.sidebar = order[id].sidebar;
     metadata.category = order[id].category;
 
@@ -153,6 +154,7 @@ function processMetadata(file) {
       metadata.previous_id = order[id].previous;
       metadata.previous = language + "-" + order[id].previous;
     }
+  }
   
   return { metadata, rawContent: rawContent };
 }

lib/server/server.js

@@ -472,6 +472,7 @@ function execute(port) {
 
   app.listen(port);
   console.log("listening on port: " + port);
+  console.log("Open http://localhost:" + port + "/");
 }
 
 module.exports = execute;

lib/start-server.js

@@ -10,10 +10,9 @@
  */
 
 require("babel-register")({
-  ignore: false,
   babelrc: false,
   plugins: [require("./server/translate-plugin.js")],
-  presets: ["react"]
+  presets: ["react", "latest", "stage-0"]
 });
 
 const program = require("commander");

lib/write-translations.js

@@ -20,7 +20,7 @@ const path = require("path");
 const siteConfig = require(CWD + "/siteConfig.js");
 const babylon = require("babylon");
 const traverse = require("babel-traverse").default;
-const sidebar = require(CWD + "/sidebar.json");
+const sidebars = require(CWD + "/sidebars.json");
 
 function writeFileAndCreateFolder(file, content) {
   mkdirp.sync(file.replace(new RegExp("/[^/]*$"), ""));
@@ -67,8 +67,8 @@ function execute() {
   }
 
   /* find sidebar category titles to translate */
-  Object.keys(sidebar).forEach(sb => {
-    const categories = sidebar[sb];
+  Object.keys(sidebars).forEach(sb => {
+    const categories = sidebars[sb];
     Object.keys(categories).forEach(category => {
       translations["localized-strings"][category] = category;
     });

package.json

@@ -6,7 +6,9 @@
     "examples": "./lib/copy-examples.js"
   },
   "dependencies": {
+    "babel-preset-latest": "^6.24.1",
     "babel-preset-react": "^6.24.1",
+    "babel-preset-stage-0": "^6.24.1",
     "babel-register": "^6.24.1",
     "babel-traverse": "^6.25.0",
     "babylon": "^6.17.4",

website/core/Footer.js

@@ -0,0 +1,84 @@
+/**
+ * Copyright (c) 2017-present, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ */
+
+const React = require("react");
+
+class Footer extends React.Component {
+  render() {
+    const currentYear = new Date().getFullYear();
+    return (
+      <footer className="nav-footer" id="footer">
+        <section className="sitemap">
+          <a href={this.props.config.baseUrl} className="nav-home">
+            <img
+              src={`${this.props.config.baseUrl}${this.props.config.footerIcon}`}
+              alt={this.props.config.title}
+              width="66"
+              height="58"
+            />
+          </a>
+          <div>
+            <h5>Docs</h5>
+            <a
+              href={`
+                ${this.props.config.baseUrl}docs/${this.props
+                .language}/getting-started.html`}
+            >
+              Getting Started
+            </a>
+          </div>
+          <div>
+            <h5>Community</h5>
+            <a
+              href={`${this.props.config.baseUrl}${this.props
+                .language}/users.html`}
+            >
+              User Showcase
+            </a>
+          </div>
+          <div>
+            <h5>More</h5>
+            <a href="https://github.com/facebookexperimental/docusaurus">
+              GitHub
+            </a>
+            <a
+              className="github-button"
+              href="https://github.com/facebookexperimental/docusaurus"
+              data-icon="octicon-star"
+              data-count-href="/facebookexperimental/docusaurus/stargazers"
+              data-count-api="/repos/facebookexperimental/docusaurus#stargazers_count"
+              data-count-aria-label="# stargazers on GitHub"
+              aria-label="Star this project on GitHub"
+            >
+              Star
+            </a>
+          </div>
+        </section>
+
+        <a
+          href="https://code.facebook.com/projects/"
+          target="_blank"
+          className="fbOpenSource"
+        >
+          <img
+            src={`${this.props.config.baseUrl}img/oss_logo.png`}
+            alt="Facebook Open Source"
+            width="170"
+            height="45"
+          />
+        </a>
+        <section className="copyright">
+          Copyright &copy; {currentYear} Facebook Inc.
+        </section>
+      </footer>
+    );
+  }
+}
+
+module.exports = Footer;

website/package.json

@@ -0,0 +1,9 @@
+{
+  "scripts": {
+    "start": "../lib/start-server.js",
+    "build": "../lib/build-files.js",
+    "publish-gh-pages": "../lib/publish-gh-pages.js",
+    "examples": "../lib/copy-examples.js",
+    "write-translations": "../lib/write-translations.js"
+  }
+}

website/pages/en/help.js

@@ -0,0 +1,58 @@
+/**
+ * Copyright (c) 2017-present, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ */
+
+const React = require("react");
+
+const CompLibrary = require("../../core/CompLibrary.js");
+const Container = CompLibrary.Container;
+const GridBlock = CompLibrary.GridBlock;
+
+const siteConfig = require(process.cwd() + "/siteConfig.js");
+
+class Help extends React.Component {
+  static defaultProps = {
+    language: "en"
+  };
+
+  render() {
+    const supportLinks = [
+      {
+        content:
+          "Learn more using the [documentation on this site](/docusaurus/docs/en/getting-started.html).",
+        title: "Browse Docs"
+      },
+      {
+        content:
+          "Submit issues and pull requests for any new features you may want to see or bugs you've found on [GitHub](https://github.com/facebookexperimental/docusaurus).",
+        title: "Join the community"
+      },
+      {
+        content:
+          "Find out what's new with this project by checking back on the site.",
+        title: "Stay up to date"
+      }
+    ];
+
+    return (
+      <div className="docMainWrapper wrapper">
+        <Container className="mainContainer documentContainer postContainer">
+          <div className="post">
+            <header className="postHeader">
+              <h2>Need help?</h2>
+            </header>
+            <p>This project is maintained by a dedicated group of people.</p>
+            <GridBlock contents={supportLinks} layout="threeColumn" />
+          </div>
+        </Container>
+      </div>
+    );
+  }
+}
+
+module.exports = Help;

website/pages/en/index.js

@@ -0,0 +1,208 @@
+/**
+ * Copyright (c) 2017-present, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ */
+
+const React = require("react");
+
+const CompLibrary = require("../../core/CompLibrary.js");
+const Marked = CompLibrary.Marked; /* Used to read markdown */
+const Container = CompLibrary.Container;
+const GridBlock = CompLibrary.GridBlock;
+
+const siteConfig = require(process.cwd() + "/siteConfig.js");
+
+class Button extends React.Component {
+  static defaultProps = {
+    target: "_self"
+  };
+
+  render() {
+    return (
+      <div className="pluginWrapper buttonWrapper">
+        <a className="button" href={this.props.href} target={this.props.target}>
+          {this.props.children}
+        </a>
+      </div>
+    );
+  }
+}
+
+class HomeSplash extends React.Component {
+  render() {
+    return (
+      <div className="homeContainer">
+        <div className="homeSplashFade">
+          <div className="wrapper homeWrapper">
+            <div className="projectLogo">
+              <img src={`${siteConfig.baseUrl}img/docusaurus.svg`} />
+            </div>
+            <div className="inner">
+              <h2 className="projectTitle">
+                {siteConfig.title}
+                <small>
+                  {siteConfig.tagline}
+                </small>
+              </h2>
+              <div className="section promoSection">
+                <div className="promoRow">
+                  <div className="pluginRowBlock">
+                    <Button
+                      href={`
+                        ${siteConfig.baseUrl}docs/getting-started.html
+                        `}
+                    >
+                      Get Started
+                    </Button>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+class Index extends React.Component {
+  render() {
+    let language = this.props.language || "en";
+    const showcase = siteConfig.users
+      .filter(user => {
+        return user.pinned;
+      })
+      .map(user => {
+        return (
+          <a href={user.infoLink}>
+            <img src={user.image} title={user.caption} />
+          </a>
+        );
+      });
+
+    return (
+      <div>
+        <HomeSplash language={language} />
+        <div className="mainContainer">
+          <Container padding={["bottom", "top"]}>
+            <GridBlock
+              align="center"
+              contents={[
+                {
+                  content:
+                    "Save time and focus on your project's documentation. Simply write docs and blog posts with Markdown and Docusaurus will publish a set of static html files ready to serve.",
+                  image: `${siteConfig.baseUrl}img/markdown.png`,
+                  imageAlign: "top",
+                  title: "Powered by Markdown"
+                },
+                {
+                  content:
+                    "Extend or customize your project's layout by reusing React. Docusaurus can be extended while reusing the same header and footer.",
+                  image: `${siteConfig.baseUrl}img/react.svg`,
+                  imageAlign: "top",
+                  title: "Built Using React"
+                },
+                {
+                  content:
+                    "Localization comes pre-configured. Use Crowdin to translate your docs into over 70 languages.",
+                  image: `${siteConfig.baseUrl}img/translation.svg`,
+                  imageAlign: "top",
+                  title: "Ready for Translations"
+                }
+              ]}
+              layout="threeColumn"
+            />
+            <br />
+            <br />
+            <GridBlock
+              align="center"
+              contents={[
+                {
+                  content:
+                    "Support users on all versions of your project. Document Versioning helps you keep documentation in sync with project releases.",
+                  image: `${siteConfig.baseUrl}img/docusaurus.svg`,
+                  imageAlign: "top",
+                  title: "Document Versioning"
+                },
+                {
+                  content:
+                    "Make it easy for your community to find what they need in your documentation. Currently supports Algolia DocSearch.",
+                  image: `${siteConfig.baseUrl}img/docusaurus.svg`,
+                  imageAlign: "top",
+                  title: "Document Search"
+                }
+              ]}
+              layout="twoColumn"
+            />
+          </Container>
+          <Container padding={["bottom", "top"]} background="light">
+            <GridBlock
+              contents={[
+                {
+                  content:
+                    "Get up and running quickly without having having to worry about site design.",
+                  imageAlign: "right",
+                  image: `${siteConfig.baseUrl}img/docusaurus.svg`,
+                  title: "Quick Setup"
+                }
+              ]}
+              layout="twoColumn"
+            />
+          </Container>
+          <Container padding={["bottom", "top"]}>
+            <GridBlock
+              contents={[
+                {
+                  content:
+                    "Make design and documentation changes by using the included live server. Publish your site to GitHub pages or other static file hosts manually, using a script, or with continuous integration like CircleCI.",
+                  imageAlign: "left",
+                  image: `${siteConfig.baseUrl}img/docusaurus_live.webp`,
+                  title: "Develop and Deploy"
+                }
+              ]}
+              layout="twoColumn"
+            />
+          </Container>
+          <Container padding={["bottom", "top"]} background="light">
+            <GridBlock
+              contents={[
+                {
+                  content:
+                    "Docusaurus currently provides support to help your website use [translations](/docs/translation.html), [search](/docs/search.html), and [versioning](/docs/versioning.html), along with some other special [documentation markdown features](/docs/doc-markdown.html). If you have ideas for useful features, feel free to contribute on [GitHub](https://github.com/facebookexperimental/docusaurus)!",
+                  imageAlign: "right",
+                  image: `${siteConfig.baseUrl}img/docusaurus.svg`,
+                  title: "Website Features"
+                }
+              ]}
+              layout="twoColumn"
+            />
+          </Container>
+
+          <div className="productShowcaseSection paddingBottom">
+            <h2>
+              {"Who's Using This?"}
+            </h2>
+            <p>Docusaurus is building websites for these projects</p>
+            <div className="logos">
+              {showcase}
+            </div>
+            <div className="more-users">
+              <a
+                className="button"
+                href={`${siteConfig.baseUrl}${this.props.language}/users.html`}
+              >
+                All Docusaurus Users
+              </a>
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+module.exports = Index;

website/pages/en/users.js

@@ -0,0 +1,56 @@
+/**
+ * Copyright (c) 2017-present, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ */
+
+const React = require("react");
+
+const CompLibrary = require("../../core/CompLibrary.js");
+const Container = CompLibrary.Container;
+
+const siteConfig = require(process.cwd() + "/siteConfig.js");
+
+class Users extends React.Component {
+  render() {
+    const showcase = siteConfig.users.map(user => {
+      return (
+        <a href={user.infoLink}>
+          <img src={user.image} title={user.caption} />
+        </a>
+      );
+    });
+
+    return (
+      <div className="mainContainer">
+        <Container padding={["bottom", "top"]}>
+          <div className="showcaseSection">
+            <div className="prose">
+              <h1>Who's Using This?</h1>
+              <p>This project is used by many folks</p>
+            </div>
+            <div className="logos">
+              {showcase}
+            </div>
+            <p>Are you using this project?</p>
+            <a
+              href="https://github.com/deltice/test-site/edit/master/website/siteConfig.js"
+              className="button"
+            >
+              Add your company
+            </a>
+          </div>
+        </Container>
+      </div>
+    );
+  }
+}
+
+Users.defaultProps = {
+  language: "en"
+};
+
+module.exports = Users;

website/sidebars.json

@@ -0,0 +1,16 @@
+{
+  "docs": {
+    "Getting Started": [
+      "getting-started"
+    ],
+    "Guides": [
+      "navigation",
+      "translation",
+      "search"
+    ],
+    "API": [
+      "site-config",
+      "doc-markdown"
+    ]
+  }
+}

website/siteConfig.js

@@ -0,0 +1,55 @@
+/**
+ * Copyright (c) 2017-present, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ */
+
+/* List of projects/orgs using your project for the users page */
+const users = [
+  {
+    caption: "Prettier",
+    image: "/docusaurus/img/prettier.png",
+    infoLink: "https://www.prettier.io",
+    pinned: true
+  }
+];
+
+const siteConfig = {
+  title: "Docusaurus",
+  tagline: "Open Source Documentation Websites",
+  url: "https://facebookexperimental.github.io",
+  baseUrl: "/docusaurus/",
+  projectName: "docusaurus",
+  users,
+  editUrl:
+    "https://github.com/facebookexperimental/docusaurus/edit/master/docs/",
+  headerLinksInternal: [
+    {
+      section: "docs",
+      href: "/docusaurus/docs/getting-started.html",
+      text: "Docs"
+    },
+    { section: "help", href: "/docusaurus/LANGUAGE/help.html", text: "Help" }
+  ],
+  headerLinksExternal: [
+    {
+      section: "github",
+      href: "https://github.com/facebookexperimental/docusaurus",
+      text: "GitHub"
+    }
+  ],
+  headerIcon: "img/docusaurus.svg",
+  footerIcon: "img/docusaurus.svg",
+  favicon: "img/favicon.png",
+  colors: {
+    primaryColor: "#2E8555",
+    secondaryColor: "#205C3B",
+    prismColor:
+      "rgba(46, 133, 85, 0.03)"
+  }
+};
+
+module.exports = siteConfig;

website/static/img/react.svg

@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	width="600px" height="600px" viewBox="0 0 600 600" enable-background="new 0 0 600 600" xml:space="preserve">
+<rect fill="none" width="600" height="600"/>
+<circle fill="#00D8FF" cx="299.529" cy="299.628" r="50.167"/>
+<path fill="none" stroke="#00D8FF" stroke-width="24" stroke-miterlimit="10" d="M299.529,197.628
+	c67.356,0,129.928,9.665,177.107,25.907c56.844,19.569,91.794,49.233,91.794,76.093c0,27.991-37.041,59.503-98.083,79.728
+	c-46.151,15.291-106.879,23.272-170.818,23.272c-65.554,0-127.63-7.492-174.29-23.441c-59.046-20.182-94.611-52.103-94.611-79.559
+	c0-26.642,33.37-56.076,89.415-75.616C167.398,207.503,231.515,197.628,299.529,197.628z"/>
+<path fill="none" stroke="#00D8FF" stroke-width="24" stroke-miterlimit="10" d="M210.736,248.922
+	c33.649-58.348,73.281-107.724,110.92-140.48c45.35-39.466,88.507-54.923,111.775-41.505
+	c24.248,13.983,33.042,61.814,20.067,124.796c-9.81,47.618-33.234,104.212-65.176,159.601
+	c-32.749,56.788-70.25,106.819-107.377,139.272c-46.981,41.068-92.4,55.929-116.185,42.213
+	c-23.079-13.31-31.906-56.921-20.834-115.233C153.281,368.316,176.758,307.841,210.736,248.922z"/>
+<path fill="none" stroke="#00D8FF" stroke-width="24" stroke-miterlimit="10" d="M210.821,351.482
+	c-33.746-58.292-56.731-117.287-66.312-166.255c-11.544-58.999-3.382-104.109,19.864-117.566
+	c24.224-14.024,70.055,2.244,118.14,44.94c36.356,32.28,73.688,80.837,105.723,136.173c32.844,56.733,57.461,114.209,67.036,162.582
+	c12.117,61.213,2.309,107.984-21.453,121.74c-23.057,13.348-65.249-0.784-110.239-39.499
+	C285.567,460.886,244.898,410.344,210.821,351.482z"/>
+</svg>

website/static/img/translation.svg

@@ -0,0 +1,3 @@
+<svg class="language {{include.class}}" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
+  <path fill="#000000" d="M19.753 10.909c-.624-1.707-2.366-2.726-4.661-2.726-.09 0-.176.002-.262.006l-.016-2.063 3.525-.607c.115-.019.133-.119.109-.231-.023-.111-.167-.883-.188-.976-.027-.131-.102-.127-.207-.109-.104.018-3.25.461-3.25.461l-.013-2.078c-.001-.125-.069-.158-.194-.156l-1.025.016c-.105.002-.164.049-.162.148l.033 2.307s-3.061.527-3.144.543c-.084.014-.17.053-.151.143.019.09.19 1.094.208 1.172.018.08.072.129.188.107l2.924-.504.035 2.018c-1.077.281-1.801.824-2.256 1.303-.768.807-1.207 1.887-1.207 2.963 0 1.586.971 2.529 2.328 2.695 3.162.387 5.119-3.06 5.769-4.715 1.097 1.506.256 4.354-2.094 5.98-.043.029-.098.129-.033.207l.619.756c.08.096.206.059.256.023 2.51-1.73 3.661-4.515 2.869-6.683zm-7.386 3.188c-.966-.121-.944-.914-.944-1.453 0-.773.327-1.58.876-2.156a3.21 3.21 0 0 1 1.229-.799l.082 4.277a2.773 2.773 0 0 1-1.243.131zm2.427-.553l.046-4.109c.084-.004.166-.01.252-.01.773 0 1.494.145 1.885.361.391.217-1.023 2.713-2.183 3.758zm-8.95-7.668a.196.196 0 0 0-.196-.145h-1.95a.194.194 0 0 0-.194.144L.008 16.916c-.017.051-.011.076.062.076h1.733c.075 0 .099-.023.114-.072l1.008-3.318h3.496l1.008 3.318c.016.049.039.072.113.072h1.734c.072 0 .078-.025.062-.076-.014-.05-3.083-9.741-3.494-11.04zm-2.618 6.318l1.447-5.25 1.447 5.25H3.226z"/>
+</svg>