diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000000..719599b1f0 --- /dev/null +++ b/.gitignore @@ -0,0 +1,4 @@ +node_modules +.DS_Store +lib/core/metadata.js +yarn.lock diff --git a/docs/en/doc-markdown.md b/docs/doc-markdown.md similarity index 91% rename from docs/en/doc-markdown.md rename to docs/doc-markdown.md index 10c14efde3..077e77fa5d 100644 --- a/docs/en/doc-markdown.md +++ b/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. diff --git a/docs/en/getting-started.md b/docs/getting-started.md similarity index 96% rename from docs/en/getting-started.md rename to docs/getting-started.md index 213eea2d43..1bbaf30708 100644 --- a/docs/en/getting-started.md +++ b/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). diff --git a/docs/guides-navigation.md b/docs/guides-navigation.md new file mode 100644 index 0000000000..cff907eca4 --- /dev/null +++ b/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'}, +], +``` \ No newline at end of file diff --git a/docs/en/search.md b/docs/search.md similarity index 87% rename from docs/en/search.md rename to docs/search.md index 23f4237e44..253374ac59 100644 --- a/docs/en/search.md +++ b/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 = { ... } ``` - diff --git a/docs/en/site-config.md b/docs/site-config.md similarity index 96% rename from docs/en/site-config.md rename to docs/site-config.md index c63026375f..af352d2086 100644 --- a/docs/en/site-config.md +++ b/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. @@ -127,10 +122,9 @@ const siteConfig = { "0f9f28b9ab9efae89810921a351753b5", indexName: "github" } - gaTrackingId: "U-A2352" + gaTrackingId: "U-A2352" }; module.exports = siteConfig; ``` - diff --git a/docs/en/translation.md b/docs/translation.md similarity index 97% rename from docs/en/translation.md rename to docs/translation.md index 2c989e416a..c3deb7ce6c 100644 --- a/docs/en/translation.md +++ b/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 diff --git a/lib/build-files.js b/lib/build-files.js old mode 100644 new mode 100755 index 5d8c5e47fe..f67b3ebb48 --- a/lib/build-files.js +++ b/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"); diff --git a/lib/copy-examples.js b/lib/copy-examples.js old mode 100644 new mode 100755 diff --git a/lib/core/DocsSidebar.js b/lib/core/DocsSidebar.js index d49604028e..83ab10d5a7 100644 --- a/lib/core/DocsSidebar.js +++ b/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 ( { - 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 (
-        {Token.reactify(_.tokenize(this.props.children, grammar))}
+        {Token.reactify(Prism.tokenize(this.props.children, grammar))}
         {lines.map((line, ii) => {
           return (
             
{ - const categories = sidebar[sb]; + Object.keys(sidebars).forEach(sb => { + const categories = sidebars[sb]; Object.keys(categories).forEach(category => { translations["localized-strings"][category] = category; }); diff --git a/package.json b/package.json index 48f7ca938f..da5157ec44 100644 --- a/package.json +++ b/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", diff --git a/website/core/Footer.js b/website/core/Footer.js new file mode 100644 index 0000000000..3a224fa401 --- /dev/null +++ b/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 ( + + ); + } +} + +module.exports = Footer; diff --git a/website/package.json b/website/package.json new file mode 100644 index 0000000000..b822a2450f --- /dev/null +++ b/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" + } +} diff --git a/website/pages/en/help.js b/website/pages/en/help.js new file mode 100755 index 0000000000..6b7457debb --- /dev/null +++ b/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 ( +
+ +
+
+

Need help?

+
+

This project is maintained by a dedicated group of people.

+ +
+
+
+ ); + } +} + +module.exports = Help; diff --git a/website/pages/en/index.js b/website/pages/en/index.js new file mode 100755 index 0000000000..eb3b21740c --- /dev/null +++ b/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 ( +
+ + {this.props.children} + +
+ ); + } +} + +class HomeSplash extends React.Component { + render() { + return ( +
+
+
+
+ +
+
+

+ {siteConfig.title} + + {siteConfig.tagline} + +

+
+
+
+ +
+
+
+
+
+
+
+ ); + } +} + +class Index extends React.Component { + render() { + let language = this.props.language || "en"; + const showcase = siteConfig.users + .filter(user => { + return user.pinned; + }) + .map(user => { + return ( + + + + ); + }); + + return ( +
+ +
+ + +
+
+ +
+ + + + + + + + + + +
+

+ {"Who's Using This?"} +

+

Docusaurus is building websites for these projects

+
+ {showcase} +
+ +
+
+
+ ); + } +} + +module.exports = Index; diff --git a/website/pages/en/users.js b/website/pages/en/users.js new file mode 100644 index 0000000000..e5d9f16b42 --- /dev/null +++ b/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 ( + + + + ); + }); + + return ( +
+ +
+
+

Who's Using This?

+

This project is used by many folks

+
+
+ {showcase} +
+

Are you using this project?

+ + Add your company + +
+
+
+ ); + } +} + +Users.defaultProps = { + language: "en" +}; + +module.exports = Users; diff --git a/website/sidebars.json b/website/sidebars.json new file mode 100644 index 0000000000..0cdcc2ef9d --- /dev/null +++ b/website/sidebars.json @@ -0,0 +1,16 @@ +{ + "docs": { + "Getting Started": [ + "getting-started" + ], + "Guides": [ + "navigation", + "translation", + "search" + ], + "API": [ + "site-config", + "doc-markdown" + ] + } +} diff --git a/website/siteConfig.js b/website/siteConfig.js new file mode 100644 index 0000000000..6d1029abee --- /dev/null +++ b/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; diff --git a/website/static/img/docusaurus.svg b/website/static/img/docusaurus.svg new file mode 100644 index 0000000000..f80b2217c7 --- /dev/null +++ b/website/static/img/docusaurus.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/website/static/img/docusaurus_live.webp b/website/static/img/docusaurus_live.webp new file mode 100644 index 0000000000..9b221d705e Binary files /dev/null and b/website/static/img/docusaurus_live.webp differ diff --git a/website/static/img/favicon.png b/website/static/img/favicon.png new file mode 100644 index 0000000000..122f0a56c5 Binary files /dev/null and b/website/static/img/favicon.png differ diff --git a/website/static/img/favicon/favicon.ico b/website/static/img/favicon/favicon.ico new file mode 100644 index 0000000000..eaced0fd8e Binary files /dev/null and b/website/static/img/favicon/favicon.ico differ diff --git a/website/static/img/markdown.png b/website/static/img/markdown.png new file mode 100644 index 0000000000..ebe191814a Binary files /dev/null and b/website/static/img/markdown.png differ diff --git a/website/static/img/oss_logo.png b/website/static/img/oss_logo.png new file mode 100644 index 0000000000..8183e289b1 Binary files /dev/null and b/website/static/img/oss_logo.png differ diff --git a/website/static/img/prettier.png b/website/static/img/prettier.png new file mode 100644 index 0000000000..47a2f82eb2 Binary files /dev/null and b/website/static/img/prettier.png differ diff --git a/website/static/img/react.svg b/website/static/img/react.svg new file mode 100644 index 0000000000..d338d72f1f --- /dev/null +++ b/website/static/img/react.svg @@ -0,0 +1,21 @@ + + + + + + + + + diff --git a/website/static/img/translation.svg b/website/static/img/translation.svg new file mode 100644 index 0000000000..9588283380 --- /dev/null +++ b/website/static/img/translation.svg @@ -0,0 +1,3 @@ + + +