Restructure styleguide configuration file

* Add version of the library
* Change colors
* Set tocMode  to "collapse"

styleguide.config.js

@@ -1,39 +1,56 @@
 /*
- * Copyright (C) 2019 CZ.NIC z.s.p.o. (http://www.nic.cz/)
+ * Copyright (C) 2019-2022 CZ.NIC z.s.p.o. (https://www.nic.cz/)
  *
  * This is free software, licensed under the GNU General Public License v3.
  * See /LICENSE for more information.
  */
-
 const path = require("path");
+const pjson = require("./package.json");
 
 module.exports = {
-    title: "Foris JS docs",
+    title: "Foris JS Docs",
+    version: `v${pjson.version}`,
+    theme: {
+        color: {
+            link: "#0075a3",
+            linkHover: "#00a2e2",
+        },
+    },
+    tocMode: "collapse",
+    pagePerSection: true,
     sections: [
         {
             name: "Introduction",
             content: "docs/introduction.md",
         },
         {
-            name: "Development (Linking)",
+            name: "Development",
             content: "docs/development.md",
         },
         {
-            name: "Foris forms",
+            name: "Components",
-            components: [
+            description: "Set of main components.",
-                "src/form/components/ForisForm.js",
+            sections: [
-                "src/form/components/alerts.js",
+                {
-                "src/form/components/SubmitButton.js",
+                    name: "Foris forms",
+                    components: [
+                        "src/form/components/ForisForm.js",
+                        "src/form/components/alerts.js",
+                        "src/form/components/SubmitButton.js",
+                    ],
+                    exampleMode: "expand",
+                    usageMode: "expand",
+                },
+                {
+                    name: "Alert Context",
+                    components: ["src/alertContext/AlertContext.js"],
+                    exampleMode: "expand",
+                    usageMode: "expand",
+                },
             ],
-            exampleMode: "expand",
+            sectionDepth: 1,
-            usageMode: "expand",
-        },
-        {
-            name: "Alert Context",
-            components: ["src/alertContext/AlertContext.js"],
-            exampleMode: "expand",
-            usageMode: "expand",
         },
+
         {
             name: "Bootstrap components",
             description: "Set of bootstrap components.",
@@ -41,6 +58,7 @@ module.exports = {
             exampleMode: "expand",
             usageMode: "expand",
             ignore: ["src/bootstrap/constants.js"],
+            sectionDepth: 0,
         },
     ],
     require: [
@@ -73,5 +91,8 @@ module.exports = {
                 },
             ],
         },
+        devServer: {
+            publicPath: "/",
+        },
     },
 };