rename and reorganize guide pages

src/components/navigation/sidebars/nav/RootNav.astro

@@ -21,7 +21,8 @@ const guidePages = await getCollection("guide");
 
 function genGuideNav(base: string): TreeEntry[] | undefined {
   const pages = guidePages
-    .filter(page => page.id.match(`^${base}[^/]*$`) !== null)
+    .filter(page => page.id.match(`^${base}[^/]*$`) !== null && page.id != "index")
+    .sort((a, b) => a.data.index - b.data.index)
     .map(page => ({
       title: page.data.title,
       link: `/docs/guide/${page.id}`,
@@ -33,7 +34,7 @@ function genGuideNav(base: string): TreeEntry[] | undefined {
 }
 
 const guide = {
-  title: "Guide",
+  title: "Usage Guide",
   link: "/docs/guide",
   current: currentRoute.startsWith("guide"),
   entries: genGuideNav(""),

src/content.config.ts

@@ -5,6 +5,7 @@ const guide = defineCollection({
 	loader: glob({ pattern: "**/*", base: "src/guide" }),
 	schema: z.object({
 		title: z.string(),
+    index: z.number(),
 	}),
 });
 

src/guide/index.mdx

@@ -1,17 +1,6 @@
 ---
-title: "Configuration"
+title: "Usage Guide"
 description: "Configuring the shell"
+index: -1
 ---
 # {frontmatter.title}
-
-See [Getting Started](/docs/configuration/getting-started) for installation and editor configuration instructions.
-
-You should start with the [Introduction](/docs/configuration/intro) which will guide you
-through the basics of QML by creating a simple topbar with a clock.
-
-From there you can read the [QML Overview](/docs/configuration/qml-overview) to get an overview of
-the QML language, or jump right into the [Type Reference](/docs/types) to find
-types you can use in your shell.
-
-The [quickshell-examples](https://git.outfoxxed.me/quickshell/quickshell-examples) repo contains
-fully working example configurations you can read and modify.

src/guide/install-setup.mdx

@@ -1,5 +1,6 @@
 ---
-title: "Getting Started"
+title: "Installation & Setup"
+index: 0
 ---
 # {frontmatter.title}
 > [!NOTE]

src/guide/introduction.mdx

@@ -1,5 +1,6 @@
 ---
 title: "Introduction"
+index: 2
 ---
 
 import Collapsible from "@components/Collapsible.astro";

src/guide/positioning.mdx

@@ -1,5 +1,6 @@
 ---
 title: "Positioning"
+index: 2
 ---
 import MD_Title from "@components/MD_Title.tsx"
 

src/guide/qml-language.mdx

@@ -1,5 +1,6 @@
 ---
-title: "QML Overview"
+title: "QML Language"
+index: 10
 ---
 import MD_Title from "@components/MD_Title.tsx"
 import Collapsible from "@components/Collapsible.astro";

src/pages/docs/index.astro

@@ -4,7 +4,7 @@ import DocsLayout from "@layouts/DocsLayout.astro";
 <DocsLayout title="Quickshell Docs" description="Quickshell Documentation">
   <h2>Docs</h2>
   <div class="root-nav">
-    <h3><a href="/docs/guide">Guide</a></h3>
+    <h3><a href="/docs/guide">Usage Guide</a></h3>
     <h3><a href="/docs/types">Type Definitions</a></h3>
   </div>
 </DocsLayout>

src/pages/index.astro

@@ -15,7 +15,7 @@ const title = "Quickshell";
     <Marquee/>
     <section class="main-page_links">
       <section class="main-page_links_set">
-        <a href="/docs/configuration/getting-started" class="main-page_link-card">
+        <a href="/docs/guide/install-setup" class="main-page_link-card">
           <h3>Get started</h3>
         </a>
         <a href="/docs/types" class="main-page_link-card">