updated categories accordingly

verygoodgraphics · Jan 30, 2024 · 426cd38 · 426cd38
1 parent 017541a
commit 426cd38
Show file tree

Hide file tree

Showing 4 changed files with 58 additions and 22 deletions.
diff --git a/docs/specs/overview.md b/docs/specs/overview.md
@@ -1,5 +1,5 @@
 ---
-title: Specs Overview
+title: VGG Specs
 ---
 
 VGG Specs is a set of JSON-based specifications for the next generation of vector graphics.

diff --git a/docusaurus.config.js b/docusaurus.config.js
@@ -90,9 +90,15 @@ const config = {
           },
           {
             type: "docSidebar",
-            sidebarId: "guideSidebar",
+            sidebarId: "featSidebar",
             position: "left",
-            label: "Guides",
+            label: "Features",
+          },
+          {
+            type: "docSidebar",
+            sidebarId: "workflowSidebar",
+            position: "left",
+            label: "Workflow",
           },
           {
             type: "docSidebar",
@@ -123,10 +129,6 @@ const config = {
                 label: "VGG Home",
                 href: "https://verygoodgraphics.com",
               },
-              {
-                label: "VGG Playground",
-                href: "https://verygoodgraphics.com/playground",
-              },
               {
                 label: "Daruma",
                 href: "https://verygoodgraphics.com/daruma",

diff --git a/sidebars.js b/sidebars.js
@@ -14,7 +14,11 @@
 /** @type {import('@docusaurus/plugin-content-docs').SidebarsConfig} */
 const sidebars = {
   specSidebar: [
-    "specs/overview",
+    {
+      type: "doc",
+      id: "specs/overview",
+      label: "Overview",
+    },
     "specs/file",
     {
       type: "category",
@@ -49,14 +53,37 @@ const sidebars = {
     "specs/script",
   ],
 
-  guideSidebar: [
+  featSidebar: [
+    {
+      type: "doc",
+      id: "features/overview",
+      label: "Overview",
+    },
+    {
+      type: "category",
+      label: "Graphic Features (WIP)",
+      items: [
+        {
+          type: "autogenerated",
+          dirName: "features/graphic",
+        },
+      ],
+    },
+  ],
+
+  workflowSidebar: [
     {
       type: "autogenerated",
-      dirName: "guides",
+      dirName: "workflow",
     },
   ],
 
-  containerSidebar: ["containers/overview"],
+  containerSidebar: [
+    {
+      type: "autogenerated",
+      dirName: "containers"
+    },
+  ],
 
   exampleSidebar: ["examples/overview"],
 }

diff --git a/src/pages/index.js b/src/pages/index.js
@@ -5,37 +5,44 @@ import {
   ArrowPathIcon,
   DocumentTextIcon,
   RectangleGroupIcon,
-  AcademicCapIcon,
+  CodeBracketSquareIcon,
+  SparklesIcon
 } from "@heroicons/react/20/solid"
 
 const features = [
   {
-    name: "Specs",
+    name: "VGG Specs",
     description:
       "Descriptions of a set of JSON-based specifications for vector graphics.",
     href: "/specs/overview",
     icon: DocumentTextIcon,
     badge: "Beta",
   },
   {
-    name: "Guides",
+    name: "VGG Features",
+    description: "Illustrations of each feature defined by VGG Specs and implemented by VGG Runtime.",
+    href: "/features/overview",
+    icon: SparklesIcon,
+  },
+  {
+    name: "VGG Workflow",
     description:
-      "Introduces VGG's Design-as-Code workflow and describes how to integrate it well with your existing dev workflow.",
-    href: "/guides/overview",
-    icon: AcademicCapIcon,
+      "Introduces VGG's Design-as-Code workflow and describes how to integrate it into your own develpment workflow.",
+    href: "/workflow/overview",
+    icon: ArrowPathIcon,
   },
   {
-    name: "Containers",
+    name: "VGG Containers",
     description:
-      "VGG containers for multiple platforms to help with both development and deployment of VGG applications.",
+      "VGG containers for multiple platforms for both development and deployment of VGG applications.",
     href: "/containers/overview",
     icon: RectangleGroupIcon,
   },
   {
-    name: "Examples",
+    name: "VGG Examples",
     description: "Various VGG examples demonstrating VGG capabilities.",
     href: "/examples/overview",
-    icon: ArrowPathIcon,
+    icon: CodeBracketSquareIcon,
   },
 ]
 
@@ -67,7 +74,7 @@ export default function Home() {
               </p>
             </div>
             <div className="mx-auto mt-12 max-w-2xl sm:mt-10 lg:mt-12 lg:max-w-none">
-              <dl className="grid max-w-xl grid-cols-1 gap-x-8 gap-y-16 lg:max-w-none lg:grid-cols-4">
+              <dl className="grid max-w-xl grid-cols-1 gap-x-8 gap-y-16 lg:max-w-none lg:grid-cols-3">
                 {features.map((feature) => (
                   <a
                     key={feature.name}