Switching to Docsify and adding search

README.md

@@ -1,7 +1,7 @@
 # mermaid [![Build Status](https://travis-ci.org/mermaid-js/mermaid.svg?branch=master)](https://travis-ci.org/mermaid-js/mermaid) [![NPM](https://img.shields.io/npm/v/mermaid)](https://www.npmjs.com/package/mermaid) [![Coverage Status](https://coveralls.io/repos/github/mermaid-js/mermaid/badge.svg?branch=master)](https://coveralls.io/github/mermaid-js/mermaid?branch=master) [![Join our Slack!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=slack&label=slack)](https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE) [![This project is using Percy.io for visual regression testing.](https://percy.io/static/images/percy-badge.svg)](https://percy.io/Mermaid/mermaid)
 
 ![banner](./img/header.png)
-**Edit this Page** [![N|Solid](./docs/assets/img/GitHub-Mark-32px.png)](https://github.com/mermaid-js/mermaid/blob/develop/docs/README.md)
+**Edit this Page** [![N|Solid](./docs/img/GitHub-Mark-32px.png)](https://github.com/mermaid-js/mermaid/blob/develop/docs/README.md)
 
 :trophy: **Mermaid was nominated and won the [JS Open Source Awards (2019)](https://osawards.com/javascript/2019) in the category "The most exciting use of technology"!!!**
 

docs/.debug.yml

@@ -1,5 +0,0 @@
-remote_theme: false
-
-baseurl: /mermaid
-
-theme: jekyll-rtd-theme

docs/8.6.0_docs.md

@@ -1,217 +1,212 @@
----
+# Version 8.6.0 Changes
-sort: 4
+
-title: Directives
+## [New Mermaid Live-Editor Beta](https://mermaid-js.github.io/docs/mermaid-live-editor-beta/#/edit/eyJjb2RlIjoiJSV7aW5pdDoge1widGhlbWVcIjogXCJmb3Jlc3RcIiwgXCJsb2dMZXZlbFwiOiAxIH19JSVcbmdyYXBoIFREXG4gIEFbQ2hyaXN0bWFzXSAtLT58R2V0IG1vbmV5fCBCKEdvIHNob3BwaW5nKVxuICBCIC0tPiBDe0xldCBtZSB0aGlua31cbiAgQyAtLT58T25lfCBEW0xhcHRvcF1cbiAgQyAtLT58VHdvfCBFW2lQaG9uZV1cbiAgQyAtLT58VGhyZWV8IEZbZmE6ZmEtY2FyIENhcl1cblx0XHQiLCJtZXJtYWlkIjp7InRoZW1lIjoiZGFyayJ9fQ)
----
+
-
+## [CDN](https://unpkg.com/mermaid/)
-# Version 8.6.0 Changes
+
-
+With version 8.6.0 comes the release of directives for mermaid, a new system for modifying configurations, with the aim of establishing centralized, sane defaults and simple implementation.
-## [New Mermaid Live-Editor Beta](https://mermaid-js.github.io/docs/mermaid-live-editor-beta/#/edit/eyJjb2RlIjoiJSV7aW5pdDoge1widGhlbWVcIjogXCJmb3Jlc3RcIiwgXCJsb2dMZXZlbFwiOiAxIH19JSVcbmdyYXBoIFREXG4gIEFbQ2hyaXN0bWFzXSAtLT58R2V0IG1vbmV5fCBCKEdvIHNob3BwaW5nKVxuICBCIC0tPiBDe0xldCBtZSB0aGlua31cbiAgQyAtLT58T25lfCBEW0xhcHRvcF1cbiAgQyAtLT58VHdvfCBFW2lQaG9uZV1cbiAgQyAtLT58VGhyZWV8IEZbZmE6ZmEtY2FyIENhcl1cblx0XHQiLCJtZXJtYWlkIjp7InRoZW1lIjoiZGFyayJ9fQ)
+
-
+`directives` allow for a diagram specific overriding of `config`, as it has been discussed in [Configurations](./Setup.md).
-## [CDN](https://unpkg.com/mermaid/)
+This allows site users to input modifications to `config` alongside diagram definitions, when creating diagrams on a private webpage that supports mermaid.
-
+
-With version 8.6.0 comes the release of directives for mermaid, a new system for modifying configurations, with the aim of establishing centralized, sane defaults and simple implementation.
+**A likely application for this is in the creation of diagrams/charts inside company/organizational webpages, that rely on mermaid for diagram and chart rendering.**
-
+
-`directives` allow for a diagram specific overriding of `config`, as it has been discussed in [Configurations](./Setup.md).
+the `init` directive is the main method of configuration for Site and Current Levels.
-This allows site users to input modifications to `config` alongside diagram definitions, when creating diagrams on a private webpage that supports mermaid.
+
-
+The three levels of are Configuration, Global, Site and Current.
-**A likely application for this is in the creation of diagrams/charts inside company/organizational webpages, that rely on mermaid for diagram and chart rendering.**
+
-
+| Level of Configuration | Description |
-the `init` directive is the main method of configuration for Site and Current Levels.
+| --- | --- |
-
+| Global Configuration| Default Mermaid Configurations|
-The three levels of are Configuration, Global, Site and Current.
+| Site Configuration| Configurations made by site owner|
-
+| Current Configuration| Configurations made by Implementors|
-| Level of Configuration | Description |
+
-| --- | --- |
+
-| Global Configuration| Default Mermaid Configurations|
+# Limits to Modifying Configurations
-| Site Configuration| Configurations made by site owner|
+**secure Array**
-| Current Configuration| Configurations made by Implementors|
+
-
+| Parameter | Description |Type | Required | Values|
-
+| --- | --- | --- | --- | --- |
-# Limits to Modifying Configurations
+| secure | Array of parameters excluded from init directive| Array | Required | Any parameters|
-**secure Array**
+
-
+The modifiable parts of the Configuration are limited by the secure array, which is an array of immutable parameters, this array can be expanded by site owners.
-| Parameter | Description |Type | Required | Values|
+
-| --- | --- | --- | --- | --- |
+**Notes**: secure arrays work like nesting dolls, with the Global Configurations’ secure array being the default and immutable list of immutable parameters, or the smallest doll, to which site owners may add to, but implementors may not modify it.
-| secure | Array of parameters excluded from init directive| Array | Required | Any parameters|
+
-
+# Secure Arrays
-The modifiable parts of the Configuration are limited by the secure array, which is an array of immutable parameters, this array can be expanded by site owners.
+
-
+Site owners can add to the **secure** array using this command:
-**Notes**: secure arrays work like nesting dolls, with the Global Configurations’ secure array being the default and immutable list of immutable parameters, or the smallest doll, to which site owners may add to, but implementors may not modify it.
+mermaidAPI.initialize( { startOnLoad: true, secure: ['parameter1', 'parameter2'] } );
-
+
-# Secure Arrays
+default values for the `secure array` consists of: ['secure', 'securityLevel', 'startOnLoad', 'maxTextSize']. These default values are immutable.
-
+
-Site owners can add to the **secure** array using this command:
+Implementors can only modify configurations using directives, but cannot change the `secure` array.
-mermaidAPI.initialize( { startOnLoad: true, secure: ['parameter1', 'parameter2'] } );
+
-
+# Modifying Configurations and directives:
-default values for the `secure array` consists of: ['secure', 'securityLevel', 'startOnLoad', 'maxTextSize']. These default values are immutable.
+The Two types of directives: are `init` or `initialize` and `wrap`.
-
+
-Implementors can only modify configurations using directives, but cannot change the `secure` array.
+```note
-
+All directives are enclosed in `%%{ }%%.`
-# Modifying Configurations and directives:
+```
-The Two types of directives: are `init` or `initialize` and `wrap`.
+
-
+Older versions of mermaid will not parse directives because `%%` will comment out the directive. This makes the update backward compatible.
-```note
+
-All directives are enclosed in `%%{ }%%.`
+# Init
-```
+`init`, or `initialize`: the init or initialize directive gives the user the ability to overwrite and change the values for configuration parameters, with respect to the secure array that is in effect.
-
+
-Older versions of mermaid will not parse directives because `%%` will comment out the directive. This makes the update backward compatible.
+| Parameter | Description |Type | Required | Values|
-
+| --- | --- | --- | --- | --- |
-# Init
+| init | modifies configurations| Directive| Optional | Any parameters not included in the secure array|
-`init`, or `initialize`: the init or initialize directive gives the user the ability to overwrite and change the values for configuration parameters, with respect to the secure array that is in effect.
+
-
+
-| Parameter | Description |Type | Required | Values|
+```note
-| --- | --- | --- | --- | --- |
+init would be an argument-directive: `%%{init: { **insert argument here**}}%%`
-| init | modifies configurations| Directive| Optional | Any parameters not included in the secure array|
+
-
+The json object that is passed as {**argument** } must be valid, quoted json or it will be ignored.
-
+    **for example**:
-```note
+
-init would be an argument-directive: `%%{init: { **insert argument here**}}%%`
+`%%{init: {"theme": default, "logLevel": 1 }}%%`
-
+
-The json object that is passed as {**argument** } must be valid, quoted json or it will be ignored.
+Configurations that are passed through init cannot change the parameters in secure arrays of higher levels. In the event of a conflict, mermaid will give priority to secure arrays and parse the request, without changing the values of the parameters in conflict.
-    **for example**:
+
-
+When deployed within code, init is called before the graph/diagram description.
-`%%{init: {"theme": default, "logLevel": 1 }}%%`
+```
-
+
-Configurations that are passed through init cannot change the parameters in secure arrays of higher levels. In the event of a conflict, mermaid will give priority to secure arrays and parse the request, without changing the values of the parameters in conflict.
+**for example**:
-
+```
-When deployed within code, init is called before the graph/diagram description.
+%%{init: {"theme": "default", "logLevel": 1 }}%%
-```
+ graph LR
-
+  a-->b
-**for example**:
+  b-->c
-```
+  c-->d
-%%{init: {"theme": "default", "logLevel": 1 }}%%
+  d-->e
- graph LR
+  e-->f
-  a-->b
+  f-->g
-  b-->c
+  g-->
-  c-->d
+```
-  d-->e
+# Wrap
-  e-->f
+
-  f-->g
+| Parameter | Description |Type | Required | Values|
-  g-->
+| --- | --- | --- | --- | --- |
-```
+| wrap | a callable text-wrap function| Directive| Optional | %%{wrap}%%|
-# Wrap
+
-
+```note
-| Parameter | Description |Type | Required | Values|
+Wrap is a function that is currently only deployable for sequence diagrams.
-| --- | --- | --- | --- | --- |
+
-| wrap | a callable text-wrap function| Directive| Optional | %%{wrap}%%|
+wrap respects manually added <br\> so if the user wants to break up their text, they have full control over those breaks by adding their own <br\> tags.
-
+
-```note
+It is a non-argument directive and can be executed thusly:
-Wrap is a function that is currently only deployable for sequence diagrams.
+
-
+`%%{wrap}%%` .
-wrap respects manually added <br\> so if the user wants to break up their text, they have full control over those breaks by adding their own <br\> tags.
+```
-
+
-It is a non-argument directive and can be executed thusly:
+**an example of text wrapping in a sequence diagram**:
-
+
-`%%{wrap}%%` .
+![Image showing wrapped text](img/wrapped%20text.png)
-```
+
-
+
-**an example of text wrapping in a sequence diagram**:
+# Resetting Configurations:
-
+There are two more functions in the mermaidAPI that can be called by site owners: **reset** and **globalReset**.
-![Image showing wrapped text](../assets/img/wrapped%20text.png)
+
-
+**reset**: resets the configuration to whatever the last configuration was. This can be done to undo more recent changes to the last mermaidAPI.initialize({...}) configuration.
-
+
-# Resetting Configurations:
+**globalReset** will reset both the current configuration AND the site configuration back to the global defaults.
-There are two more functions in the mermaidAPI that can be called by site owners: **reset** and **globalReset**.
+
-
+**Notes**:  both reset and globalReset are only available to site owners, as such implementors would have to edit their configs with init.
-**reset**: resets the configuration to whatever the last configuration was. This can be done to undo more recent changes to the last mermaidAPI.initialize({...}) configuration.
+
-
+# Additional Utils to mermaid
-**globalReset** will reset both the current configuration AND the site configuration back to the global defaults.
+•	**memoize**: simple caching for computationally expensive functions. It reduces the rendering time for computationally intensive diagrams by about 90%.
-
+
-**Notes**:  both reset and globalReset are only available to site owners, as such implementors would have to edit their configs with init.
+•	**assignWithDepth** - this is an improvement on previous functions with config.js and Object.assign. The purpose of this function is to provide a sane mechanism for merging objects, similar to object.assign, but with depth.
-
+
-# Additional Utils to mermaid
+Example of **assignWithDepth**:
-•	**memoize**: simple caching for computationally expensive functions. It reduces the rendering time for computationally intensive diagrams by about 90%.
+
-
+![Image showing assignWithDepth](img/assignWithDepth.png)
-•	**assignWithDepth** - this is an improvement on previous functions with config.js and Object.assign. The purpose of this function is to provide a sane mechanism for merging objects, similar to object.assign, but with depth.
+
-
+
-Example of **assignWithDepth**:
+Example of **object.Assign**:
-
+
-![Image showing assignWithDepth](../assets/img/assignWithDepth.png)
+![Image showing object.assign without depth](img/object.assign%20without%20depth.png)
-
+
-
+•	**calculateTextDimensions, calculateTextWidth,** and **calculateTextHeight** - for measuring text dimensions, width and height.
-Example of **object.Assign**:
+
-
+**Notes**:For more information on usage, parameters, and return info for these new functions take a look at the jsdocs for them in the utils package.
-![Image showing object.assign without depth](../assets/img/object.assign%20without%20depth.png)
+
-
+
-•	**calculateTextDimensions, calculateTextWidth,** and **calculateTextHeight** - for measuring text dimensions, width and height.
+# New API Requests Introduced in Version 8.6.0
-
+
-**Notes**:For more information on usage, parameters, and return info for these new functions take a look at the jsdocs for them in the utils package.
+## setSiteConfig
-
+
-
+| Function | Description         | Type    | Values             |Parameters|Returns|
-# New API Requests Introduced in Version 8.6.0
+| --------- | ------------------- | ------- | ------------------ | ------------------ | ------------------ |
-
+| setSiteConfig|Sets the siteConfig to desired values | Put Request | Any Values, except ones in secure array|conf|siteConfig|
-## setSiteConfig
+
-
+```note
-| Function | Description         | Type    | Values             |Parameters|Returns|
+Sets the siteConfig. The siteConfig is a protected configuration for repeat use. Calls to reset() will reset
-| --------- | ------------------- | ------- | ------------------ | ------------------ | ------------------ |
+the currentConfig to siteConfig. Calls to reset(configApi.defaultConfig) will reset siteConfig and currentConfig
-| setSiteConfig|Sets the siteConfig to desired values | Put Request | Any Values, except ones in secure array|conf|siteConfig|
+to the defaultConfig
-
+Note: currentConfig is set in this function
-```note
+Default value: At default, will mirror Global Config
-Sets the siteConfig. The siteConfig is a protected configuration for repeat use. Calls to reset() will reset
+```
-the currentConfig to siteConfig. Calls to reset(configApi.defaultConfig) will reset siteConfig and currentConfig
+
-to the defaultConfig
+## getSiteConfig
-Note: currentConfig is set in this function
+
-Default value: At default, will mirror Global Config
+| Function | Description         | Type    |  Values             |
-```
+| --------- | ------------------- | ------- |  ------------------ |
-
+| setSiteConfig|Returns the current siteConfig base configuration | Get Request | Returns Any Values  in siteConfig|
-## getSiteConfig
+
-
+```note
-| Function | Description         | Type    |  Values             |
+Returns   any   values in siteConfig.
-| --------- | ------------------- | ------- |  ------------------ |
+```
-| setSiteConfig|Returns the current siteConfig base configuration | Get Request | Returns Any Values  in siteConfig|
+
-
+## setConfig
-```note
+
-Returns   any   values in siteConfig.
+| Function  | Description         | Type    | Values             |Parameters|Returns|
-```
+| --------- | ------------------- | ------- | ------------------ |----------|-------|
-
+| setSiteConfig|Sets the siteConfig to desired values | Put Request| Any Values, those in secure array|conf|currentConfig merged with the sanitized conf|
-## setConfig
+
-
+```note
-| Function  | Description         | Type    | Values             |Parameters|Returns|
+Sets the currentConfig. The parameter conf is sanitized based on the siteConfig.secure keys. Any
-| --------- | ------------------- | ------- | ------------------ |----------|-------|
+values found in conf with key found in siteConfig.secure will be replaced with the corresponding
-| setSiteConfig|Sets the siteConfig to desired values | Put Request| Any Values, those in secure array|conf|currentConfig merged with the sanitized conf|
+siteConfig value.
-
+```
-```note
+
-Sets the currentConfig. The parameter conf is sanitized based on the siteConfig.secure keys. Any
+## getConfig
-values found in conf with key found in siteConfig.secure will be replaced with the corresponding
+
-siteConfig value.
+| Function  | Description         | Type    | Return Values            |
-```
+| --------- | ------------------- | ------- | ------------------ |
-
+| getConfig |Obtains the currentConfig | Get Request | Any Values from currentConfig|
-## getConfig
+
-
+
-| Function  | Description         | Type    | Return Values            |
+```note
-| --------- | ------------------- | ------- | ------------------ |
+Returns any values in currentConfig.
-| getConfig |Obtains the currentConfig | Get Request | Any Values from currentConfig|
+```
-
+
-
+## sanitize
-```note
+
-Returns any values in currentConfig.
+| Function  | Description         | Type    | Values             |
-```
+| --------- | ------------------- | ------- | ------------------ |
-
+| sanitize  |Sets the siteConfig to desired values. | Put Request(?) |None|
-## sanitize
+
-
+```note
-| Function  | Description         | Type    | Values             |
+modifies options in-place
-| --------- | ------------------- | ------- | ------------------ |
+Ensures options parameter does not attempt to override siteConfig secure keys.
-| sanitize  |Sets the siteConfig to desired values. | Put Request(?) |None|
+```
-
+
-```note
+## reset
-modifies options in-place
+
-Ensures options parameter does not attempt to override siteConfig secure keys.
+| Function | Description         | Type    | Required | Values             |Parameter|
-```
+| --------- | -------------------| ------- | -------- | ------------------ |---------|
-
+| reset|Resets currentConfig to conf| Put Request | Required | None| conf|
-## reset
+
-
+## conf
-| Function | Description         | Type    | Required | Values             |Parameter|
+
-| --------- | -------------------| ------- | -------- | ------------------ |---------|
+| Parameter | Description |Type | Required | Values|
-| reset|Resets currentConfig to conf| Put Request | Required | None| conf|
+| --- | --- | --- | --- | --- |
-
+| conf| base set of values, which currentConfig coul be   reset   to.| Dictionary | Required | Any Values, with respect to the secure Array|
-## conf
+
-
+```note
-| Parameter | Description |Type | Required | Values|
+default: current siteConfig  (optional, default `getSiteConfig()`)
-| --- | --- | --- | --- | --- |
+```
-| conf| base set of values, which currentConfig coul be   reset   to.| Dictionary | Required | Any Values, with respect to the secure Array|
+
-
+## For more information, read [Setup](Setup.md).
-```note
-default: current siteConfig  (optional, default `getSiteConfig()`)
-```
-
-## For more information, read [Setup](Setup.md).

docs/CHANGELOG.md

@@ -1,8 +1,3 @@
----
-sort: 3
-title: Changelog
----
-
 # Change Log
 
 Here is the list of the newest versions in Descending Order, beginning from the latest version.

docs/Gemfile

@@ -1,5 +0,0 @@
-source "https://rubygems.org"
-
-gem "jekyll-rtd-theme"
-
-gem "github-pages", group: :jekyll_plugins

docs/Makefile

@@ -1,14 +0,0 @@
-default:
-	@gem install jekyll bundler && bundle install
-
-update:
-	@bundle update
-
-clean:
-	@bundle exec jekyll clean
-
-build: clean
-	@bundle exec jekyll build --profile --config _config.yml,.debug.yml
-
-server: clean
-	@bundle exec jekyll server --livereload --config _config.yml,.debug.yml

docs/README.md

@@ -1,6 +1,6 @@
 # mermaid [![Build Status](https://travis-ci.org/mermaid-js/mermaid.svg?branch=master)](https://travis-ci.org/mermaid-js/mermaid) [![NPM](https://img.shields.io/npm/v/mermaid)](https://www.npmjs.com/package/mermaid) [![Coverage Status](https://coveralls.io/repos/github/mermaid-js/mermaid/badge.svg?branch=master)](https://coveralls.io/github/mermaid-js/mermaid?branch=master) [![Join our Slack!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=slack&label=slack)](https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE) [![This project is using Percy.io for visual regression testing.](https://percy.io/static/images/percy-badge.svg)](https://percy.io/Mermaid/mermaid)
 
-![banner](assets/img/header.png)
+![banner](img/header.png)
 
 :trophy: **Mermaid was nominated and won the [JS Open Source Awards (2019)](https://osawards.com/javascript/#nominees) in the category "The most exciting use of technology"!!!**
 
@@ -43,7 +43,7 @@ graph TD;
     C-->D;
 ```
 
-![Flowchart](assets/img/flow.png)
+![Flowchart](img/flow.png)
 
 ### [Sequence diagram](https://mermaid-js.github.io/mermaid/diagrams-and-syntax-and-examples/sequenceDiagram.html)
 
@@ -61,7 +61,7 @@ sequenceDiagram
     Bob-->>John: Jolly good!
 ```
 
-![Sequence diagram](assets/img/sequence.png)
+![Sequence diagram](img/sequence.png)
 
 ### [Gantt diagram](https://mermaid-js.github.io/mermaid/diagrams-and-syntax-and-examples/gantt.html)
 
@@ -78,7 +78,7 @@ Future task               :         des3, after des2, 5d
 Future task2               :         des4, after des3, 5d
 ```
 
-![Gantt diagram](assets/img/gantt.png)
+![Gantt diagram](img/gantt.png)
 
 ### [Class diagram - :exclamation: experimental](https://mermaid-js.github.io/mermaid/diagrams-and-syntax-and-examples/classDiagram.html)
 
@@ -99,7 +99,7 @@ Class01 : int gorilla
 Class08 <--> C2: Cool label
 ```
 
-![Class diagram](assets/img/class.png)
+![Class diagram](img/class.png)
 
 ### Git graph - :exclamation: experimental
 
@@ -122,7 +122,7 @@ commit
 merge newbranch
 
 ```
-![Git graph](assets/img/git.png)
+![Git graph](img/git.png)
 
 ### [Entity Relationship Diagram - :exclamation: experimental](https://mermaid-js.github.io/mermaid/diagrams-and-syntax-and-examples/entityRelationshipDiagram.html)
 
@@ -134,7 +134,7 @@ erDiagram
 
 ```
 
-![ER diagram](assets/img/simple-er.png)
+![ER diagram](img/simple-er.png)
 
 ### [User Journey Diagram](https://mermaid-js.github.io/mermaid/diagrams-and-syntax-and-examples/user-journey.html)
 
@@ -149,7 +149,7 @@ journey
       Go downstairs: 5: Me
       Sit down: 5: Me
 ```
-![Journey diagram](assets/img/user-journey.png)
+![Journey diagram](img/user-journey.png)
 
 # Installation
 ## In depth guides and examples can be found in [Getting Started](getting-started/n00b-gettingStarted.md) and [Usage](getting-started/usage.md).

docs/Setup.md

@@ -1,8 +1,3 @@
----
-sort: 3
-title: Configurations
----
-
 <!-- Generated by documentation.js. Update this documentation by updating the source code. -->
 
 ## mermaidAPI

docs/_config.yml

@@ -1,37 +0,0 @@
-title: mermaid
-lang: en
-description: Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.
-
-remote_theme: rundocs/jekyll-rtd-theme
-
-mermaid:
-  custom: https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js
-
-copyright:
-  since: 2014
-  revision: true
-
-edit: true
-addons_branch: true
-
-google:
-  gtag: UA-153180559-1
-
-sass:
-  style: compressed
-
-addons:
-  - github
-  - i18n
-  - analytics
-
-plugins:
-  - jemoji
-
-readme_index:
-  with_frontmatter: true
-
-exclude:
-  - Makefile
-  - Gemfile
-  - Gemfile.lock

docs/_sidebar.md

@@ -0,0 +1,37 @@
+- Overview 📚
+  - [mermaid](README.md)
+  - [overview](n00b-overview.md)
+  - [Use-Cases and Integrations](integrations.md)
+  - [FAQ](faq.md)
+
+- Getting Started✒️
+
+  - [Getting started - easier](n00b-gettingStarted.md)
+  - [Tutorials](Tutorials.md)
+  - [API-Usage](usage.md)
+  - [Configurations](Setup.md)
+  - [Directives](8.6.0_docs.md)
+  - [Theming](theming.md)
+  - [mermaid CLI](mermaidCLI.md)
+  - [Advanced usage](n00b-advanced.md)
+
+
+- Contributions and Community 🙌
+
+  - [Development and Contribution ](development.md)
+  - [Mermaid Versions](versionUpdates.md)
+  - [Changelog](CHANGELOG.md)
+  - [Adding Diagrams ](newDiagram.md)
+
+- Diagrams and Syntax and Examples 📊
+
+  - [Diagram syntax intro](n00b-syntaxReference.md)
+  - [Examples](examples.md)
+  - [Flowchart](flowchart.md)
+  - [Sequence diagram](sequenceDiagram.md)
+  - [Class Diagram](classDiagram.md)
+  - [State Diagram](stateDiagram.md)
+  - [Entity Relationship Diagram](entityRelationshipDiagram.md)
+  - [User Journey](user-journey.md)
+  - [Gantt](gantt.md)
+  - [Pie Chart](pie.md)

docs/assets/_sidebar.md

@@ -1,37 +0,0 @@
-- Overview
-  - [mermaid](README.md)
-  <!-- - [overview](n00b-overview.md) -->
-  <!-- - [Use-Cases and Integrations](integrations.md) -->
-  <!-- - [FAQ](faq.md) -->
-
-- Getting Started
-
-  <!-- - [Getting started - easier](n00b-gettingStarted.md) -->
-  <!-- - [Tutorials](Tutorials.md) -->
-  <!-- - [API-Usage](usage.md) -->
-  <!-- - [Configurations](Setup.md) -->
-  <!-- - [Directives](8.6.0_docs.md) -->
-  <!-- - [Theming](theming.md) -->
-  <!-- - [mermaid CLI](mermaidCLI.md) -->
-  <!-- - [Advanced usage](n00b-advanced.md) -->
-
-
-- Contributions and Community
-
-  <!-- - [Development and Contribution](development.md)-->
-  <!-- - [Adding Diagrams](newDiagram.md)-->
-  <!-- - [Changelog](CHANGELOG.md) -->
-  
-
-- Diagrams and Syntax and Examples
-
-  <!-- - [Diagram syntax intro](n00b-syntaxReference.md) -->
-  <!-- - [Examples](examples.md)
-  - [Flowchart](flowchart.md) -->
-  <!-- - [Sequence diagram](sequenceDiagram.md)
-  - [Class Diagram](classDiagram.md)
-  - [State Diagram](stateDiagram.md)
-  - [Entity Relationship Diagram](entityRelationshipDiagram.md)
-  - [User Journey](user-journey.md)
-  - [Gantt](gantt.md)
-  - [Pie Chart](pie.md)

docs/classDiagram.md

@@ -1,7 +1,3 @@
----
-sort: 5
----
-
 # Class diagrams
 
 > "In software engineering, a class diagram in the Unified Modeling Language (UML) is a type of static structure diagram that describes the structure of a system by showing the system's classes, their attributes, operations (or methods), and the relationships among objects."

docs/development.md

@@ -1,8 +1,3 @@
----
-sort: 1
-title: Development and Contribution
----
-
 # Development 🙌
 
 
@@ -12,7 +7,7 @@ So you want to help? That's great!
 
 Here are a few things to know to get you started on the right path.
 
-**All the documents displayed in the github.io page are listed in [sidebar.md](https://github.com/mermaid-js/mermaid/edit/develop/docs/assets/_sidebar.md)**
+**All the documents displayed in the github.io page are listed in [sidebar.md](https://github.com/mermaid-js/mermaid/edit/develop/docs/_sidebar.md)**
  
 **Note: You will have to edit the document to see its contents. Commits and PR's should be directed to the develop branch.**
 
@@ -51,7 +46,7 @@ If it is not in the documentation, it's like it never happened. Wouldn't that be
 
 The docs are located in the `docs` folder and are written in MarkDown. Just pick the right section and start typing. If you want to propose changes to the structure of the documentation: 
 
-**All the documents displayed in the github.io page are listed in [sidebar.md](https://github.com/mermaid-js/mermaid/edit/develop/docs/assets/_sidebar.md). Click edit it to see them.**
+**All the documents displayed in the github.io page are listed in [sidebar.md](https://github.com/mermaid-js/mermaid/edit/develop/docs/_sidebar.md). Click edit it to see them.**
 
 The contents of [https://mermaid-js.github.io/mermaid/](https://mermaid-js.github.io/mermaid/) are based on the docs from **Master** Branch. 
 

docs/diagrams-and-syntax-and-examples/README.md

@@ -1,6 +0,0 @@
----
-sort: 4
----
-
-# Diagrams and Syntax and Examples
-{% include list.liquid %}

docs/directives.md

@@ -1,8 +1,4 @@
----
+# Directives
-sort: 10
----
-
-## Directives
 
 ## Directives were added in [Version 8.6.0](../getting-started/8.6.0_docs.md). Please Read it for more information.
 

docs/entityRelationshipDiagram.md

@@ -1,7 +1,3 @@
----
-sort: 7
----
-
 # Entity Relationship Diagrams
 
 > An entity–relationship model (or ER model) describes interrelated things of interest in a specific domain of knowledge. A basic ER model is composed of entity types (which classify the things of interest) and specifies relationships that can exist between entities (instances of those entity types). Wikipedia.

docs/examples.md

@@ -1,7 +1,3 @@
----
-sort: 2
----
-
 # Examples
 
 This page contains a collection of examples of diagrams and charts that can be created through mermaid and its myriad applications.

docs/faq.md

@@ -1,8 +1,3 @@
----
-sort: 3
-title: FAQ
----
-
 # Frequently Asked Questions
 
 1. [How to add title to flowchart?](https://github.com/knsv/mermaid/issues/556#issuecomment-363182217)

docs/flowchart.md

@@ -1,8 +1,3 @@
----
-sort: 3
-title: Flowchart
----
-
 # Flowcharts - Basic Syntax
 
 ## Graph

docs/gantt.md

@@ -1,8 +1,3 @@
----
-sort: 9
-title: Gantt
----
-
 # Gantt diagrams
 
 > A Gantt chart is a type of bar chart, first developed by Karol Adamiecki in 1896, and independently by Henry Gantt in the 1910s, that illustrates a project schedule and the amount of time it would take for any one project to finish. Gantt charts illustrate number of days between the start and finish dates of the terminal elements and summary elements of a project.
@@ -12,11 +7,11 @@ title: Gantt
 
 
  It is important to remember that when a date, day, or collection of dates specific to a task are "excluded", the Gantt Chart will accomodate those changes by extending an equal number of day, towards the right, not by creating a gap inside the task.
- As shown here ![](https://raw.githubusercontent.com/NeilCuzon/mermaid/develop/docs/assets/img/Gantt-excluded-days-within.png)
+ As shown here ![](https://raw.githubusercontent.com/NeilCuzon/mermaid/develop/docs/img/Gantt-excluded-days-within.png)
 
 
  However, if the excluded dates are between two tasks that are set to start consecutively, the excluded dates will be skipped graphically and left blank, and the following task will begin after the end of the excluded dates.   
- As shown here ![](https://raw.githubusercontent.com/NeilCuzon/mermaid/develop/docs/assets/img/Gantt-long-weekend-look.png)
+ As shown here ![](https://raw.githubusercontent.com/NeilCuzon/mermaid/develop/docs/img/Gantt-long-weekend-look.png)
 
  A Gantt chart is useful for tracking the amount of time it would take before a project is finished, but it can also be used to graphically represent "non-working days", with a few tweaks.
 

docs/getting-started/README.md

@@ -1,6 +0,0 @@
----
-sort: 2
----
-
-# Getting Started
-{% include list.liquid %}

docs/index.html

@@ -75,3 +75,5 @@
 </body>
 </html>
 <!--  -->
+
+</html>

docs/integrations.md

@@ -1,8 +1,3 @@
----
-sort: 2
-title: Use-Cases and Integrations
----
-
 # Integrations
 
 The following list is a compilation of different integrations and plugins that allow the rendering of mermaid definitions

docs/mermaidCLI.md

@@ -1,7 +1,3 @@
----
-sort: 6
----
-
 # mermaid CLI
 
 mermaid CLI has been moved to [mermaid-cli](https://github.com/mermaid-js/mermaid-cli). Please read its documentation instead.

docs/n00b-advanced.md

@@ -1,8 +1,3 @@
----
-sort: 7
-title: Advanced usage
----
-
 # Advanced n00b mermaid (Coming soon..)
 
 ## splitting mermaid code from html

docs/n00b-gettingStarted.md

@@ -1,8 +1,3 @@
----
-sort: 1
-title: Getting started - easier
----
-
 # A basic mermaid User-Guide for Beginners
 
 Creating diagrams and charts using mermaid code is simple.
@@ -31,15 +26,15 @@ In the `Code` section one can write or edit raw mermaid code, and instantly `Pre
 
 **This is a great way to learn how to define a mermaid diagram.**
 
-For some popular video tutorials on the live editor go to [Overview](../overview/n00b-overview.md).
+For some popular video tutorials on the live editor go to [Overview](/overview/n00b-overview.md).
 
-![Flowchart](../assets/img/n00b-liveEditor.png)
+![Flowchart](/img/n00b-liveEditor.png)
 
 **Notes:**
 
 You can also click "Copy Markdown" to copy the markdown code for the diagram, that can then be pasted directly into your documentation.
 
-![Flowchart](../assets/img/liveEditorOptions.png)
+![Flowchart](/img/liveEditorOptions.png)
 
 The `Mermaid configuration` is for controlling mermaid behaviour. An easy introduction to mermaid configuration is found in the [Advanced usage](n00b-advanced.md) section. A complete configuration reference cataloguing default values is found on the [mermaidAPI](Setup.md) page.
 
@@ -57,25 +52,25 @@ When the mermaid plugin is installed on a Confluence server, one can insert a me
 
 - In a Confluence page, Add Other macros.
 
-![Flowchart](../assets/img/n00b-Confluence1.png)
+![Flowchart](../img/n00b-Confluence1.png)
 
 ---
 
 - Search for mermaid.
 
-![Flowchart](../assets/img/n00b-Confluence2.png)
+![Flowchart](../img/n00b-Confluence2.png)
 
 ---
 
 - The mermaid object appears. Paste your mermaid code into it.
 
-![Flowchart](../assets/img/n00b-Confluence3.png)
+![Flowchart](../img/n00b-Confluence3.png)
 
 ---
 
 - Save the page and the diagram appears.
 
-![Flowchart](../assets/img/n00b-Confluence4.png)
+![Flowchart](../img/n00b-Confluence4.png)
 
 ---
 ## The following are two ways of hosting mermaid on a webpage.  

docs/n00b-overview.md

@@ -1,8 +1,3 @@
----
-sort: 1
-title: Overview
----
-
 # Overview for Beginners
 
 ## Explaining with a Diagram 	

docs/n00b-syntaxReference.md

@@ -1,8 +1,3 @@
----
-sort: 1
-title: Diagram syntax intro
----
-
 ## Diagram syntax
 
 If you are new to mermaid, read the [Getting Started](../getting-started/n00b-gettingStarted.md) and [Overview](../overview/n00b-overview.md) sections, to learn the basics of mermaid.

docs/newDiagram.md

@@ -1,8 +1,3 @@
----
-sort: 2
-title: Adding a New Diagram/Chart 
----
-
 # Adding a New Diagram/Chart 📊
 
 

docs/overview/README.md

@@ -1,7 +0,0 @@
----
-sort: 1
----
-
-# Overview
-
-{% include list.liquid %}

docs/pie.md

@@ -1,8 +1,3 @@
----
-sort: 10
-title: Pie Chart
----
-
 # Pie chart diagrams
 
 > A pie chart (or a circle chart) is a circular statistical graphic, which is divided into slices to illustrate numerical proportion. In a pie chart, the arc length of each slice (and consequently its central angle and area), is proportional to the quantity it represents. While it is named for its resemblance to a pie which has been sliced, there are variations on the way it can be presented. The earliest known pie chart is generally credited to William Playfair's Statistical Breviary of 1801

docs/sequenceDiagram.md

@@ -1,7 +1,3 @@
----
-sort: 4
----
-
 # Sequence diagrams
 
 > A Sequence diagram is an interaction diagram that shows how processes operate with one another and in what order.

docs/stateDiagram.md

@@ -1,7 +1,3 @@
----
-sort: 6
----
-
 # State diagrams
 
 > "A state diagram is a type of diagram used in computer science and related fields to describe the behavior of systems. State diagrams require that the system described is composed of a finite number of states; sometimes, this is indeed the case, while at other times this is a reasonable abstraction." Wikipedia

docs/theming.md

@@ -1,8 +1,3 @@
----
-sort: 5
-title: Theming
----
-
 # Version 8.7.0: Theme Configuration
 
 With Version 8.7.0 Mermaid comes out with a system for dynamic and integrated configuration of the diagram themes. The objective of this is to increase the customizability of mermaid and the ease of Styling, with the customization of themes through the `%%init%%` directive and `initialize` calls.

docs/tutorials-and-community/README.md

@@ -1,6 +0,0 @@
----
-sort: 3
----
-
-# Contributions and Community
-{% include list.liquid %}

docs/usage.md

@@ -1,8 +1,3 @@
----
-sort: 2
-title: API-Usage
----
-
 # Usage
 
 mermaid is a javascript tool that makes use of a markdown based syntax to render customizable diagrams and charts, for greater speed and ease.

docs/user-journey.md

@@ -1,7 +1,3 @@
----
-sort: 8
----
-
 # User Journey Diagram
 
 > User journeys describe at a high level of detail exactly what steps different users take to complete a specific task within a system, application or website. This technique shows the current (as-is) user workflow, and reveals areas of improvement for the to-be workflow. (Wikipedia)