Added ordered pages

lib/package-lock.json

 {
   "name": "@tecnojest/widget-base",
-  "version": "1.4.32",
+  "version": "1.4.40",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

lib/package.json

 {
   "name": "@tecnojest/widget-base",
   "author": "Tecnojest srl https://www.invidea.it",
-  "version": "1.4.32",
+  "version": "1.4.40",
   "publishConfig": {
     "registry": "https://npm.invidea.it"
   },

pages/config.js

@@ -26,12 +26,13 @@ const config = {
   },
   sidebar: {
     forcedNavOrder: [
-      "/introduction", // add trailing slash if enabled above
-      "/codeblock"
-    ],
-    collapsedNav: [
-      "/codeblock" // add trailing slash if enabled above
+      "/about", // add trailing slash if enabled above
+      "/getting-started",
+      "/embeddable-widget",
+      "/templates",
+      "/contributing"
     ],
+    collapsedNav: [],
     links: [
       { text: "Energenious", link: "https://energenious.eu" },
       { text: "Live Examples", link: `${pathPrefix}/storybook` }

pages/content/about.md

+---
+title: "About"
+---

pages/content/about/purpose.md

+---
+title: "Purpose"
+---

pages/content/about/use-cases.md

+---
+title: "Use cases"
+---

pages/content/codeblock.md

----
-title: "Syntax Highlighting"
-metaTitle: "Syntax Highlighting is the meta title tag for this page"
-metaDescription: "This is the meta description for this page"
----
-
-The following is a code block with JavaScript language syntax highlighting.
-
-```javascript
-import React from 'react';
-```
-
-Supports multiple languages.
-
-The following is a code block with diff. Lines with `+` highlighted in green shade indicating an addition. Lines with `-` highlighted in red shade indicating a deletion.
-
-```javascript
-- const data = ['1','2'];
-+ const data = [1,2];
-```
-
-## Live Editing example
-
-```javascript react-live=true
-<button className={'btn btn-default'}>Change my text</button>
-```

pages/content/codeblock/1-index.md

----
-title: "Sub Page"
-metaTitle: "Syntax Highlighting is the meta title tag for this page"
-metaDescription: "This is the meta description for this page"
----
-
-The following is a code block with JavaScript language syntax highlighting.
-
-```javascript
-import React from 'react';
-```
-
-Supports multiple languages.
-
-The following is a code block with diff. Lines with `+` highlighted in green shade indicating an addition. Lines with `-` highlighted in red shade indicating a deletion.
-
-```javascript
-- const data = ['1','2'];
-+ const data = [1,2];
-```
-
-## Live Editing example
-
-```javascript react-live=true
-<button className={'btn btn-default'}>Change my text</button>
-```

pages/content/index.mdx

 ---
-metaTitle: "Landing Page"
+title: "Widgets"
+metaTitle: "Widgets - Energenious"
+metaDescription: "Documentation of the library and templates for creating widgets."
 ---
-
-Some introduction text. Lists out all the headings from h1 to h6. Easy to customise. Some more text. Additional text.
-
-# Heading H1
-
-Heading 1 text
-
-## Heading H2
-
-Heading 2 text
-
-### Heading H3
-
-Heading 3 text
-
-#### Heading H4
-
-Heading 4 text
-
-##### Heading H5
-
-Heading 5 text
-
-###### Heading H6
-
-Heading 6 text
-
-## Lists
-
-- Item 1
-- Item 2
-- Item 3
-- Item 4
-- Item 5

pages/content/introduction.md

----
-title: "Introduction"
-metaTitle: "This is the title tag of this page"
-metaDescription: "This is the meta description"
----
-
-Some introduction text. Lists out all the headings from h1 to h6. Easy to customise.
-
-# Heading H1
-Heading 1 text
-
-## Heading H2
-Heading 2 text
-
-### Heading H3
-Heading 3 text
-
-#### Heading H4
-Heading 4 text
-
-##### Heading H5
-Heading 5 text
-
-###### Heading H6
-Heading 6 text
-
-## Lists
-- Item 1
-- Item 2
-- Item 3
-- Item 4
-- Item 5

pages/src/components/styles/GlobalStyles.js

@@ -464,6 +464,10 @@ export const baseStyles = injectGlobal`
     border-left: 1px solid #e6ecf1;
   }
 
+  .firstLevel ul .item ul .item > a {
+    color: #bbb;
+  }
+
   .sideBarUL .item {
     list-style: none;
     padding: 0;