Complete Docs rewrite!

.gitignore

@@ -26,3 +26,6 @@ phoenix
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+
+# Working notes for in-progress docs overhaul (local scratchpad)
+DOCS_NOTES.md

api/01-getting-started.md

@@ -11,33 +11,21 @@ The Phoenix Code API documentation is organized into sections for easy navigatio
 ### [Creating Themes](./creating-themes)
 This page provides guidelines on how to create custom Themes for **Phoenix Code**.
 
----
-
 ### [Creating Extensions](./creating-extensions)
 This page provides guidelines on how to write Extensions for **Phoenix Code**.
 
----
-
 ### [Use Node.js from extension](./creating-node-extensions)
 This page explains how to use Node.js inside **Phoenix Code** extensions.
 
----
-
 ### [Debugging Extensions](./debugging-extensions)
 This page provides a detailed guide on efficiently debugging your **Phoenix Code** extensions.
 
----
-
 ### [Publishing Themes & Extensions](./publishing-extensions)
 This page provides guidelines on how to publish Themes/Extensions to **Phoenix Code**.
 
----
-
 ### [Available Standard Libraries](./available-standard-libs)
 This page lists all the standard libraries that are available for use inside **Phoenix Code**.
 
----
-
 ## API Reference
 
 The API-Reference directory contains detailed reference documentation for each part of the Phoenix Code API. Each page here corresponds to different components, functions, or modules of the API, providing explanations, usage examples, and detailed parameter descriptions.

api/08-How-To/Dialogs.md

@@ -8,8 +8,6 @@ This document outlines the basic features of working with Dialogs, including:
 * [How to create custom Dialog Box](#creating-custom-dialog-boxes)
 * [How to handle the button clicks](#handle-button-clicks)
 
----
-
 ## Adding a Dialog Box and Buttons
 
 To add a dialog box, follow these steps:

api/08-How-To/Menus.md

@@ -10,8 +10,6 @@ This document outlines the basic features of working with Menus, including:
 * [How to position a Menu item](#position-the-menu-item)
 * [How to add a keyboard shortcut to a Menu item](#attach-a-keyboard-shortcut-to-a-menu-item)
 
----
-
 
 ## Adding a Menu
 

api/08-How-To/Panels.md

@@ -22,8 +22,6 @@ This document outlines the basic features of working with Panels.
 * [How to manage Bottom Panel state](#managing-bottom-panel-state)
 * [Best Practices for Panels](#best-practices)
 
----
-
 ## Creating a Plugin Panel
 
 To create a plugin panel, follow these steps:

api/08-How-To/StatusBar.md

@@ -6,8 +6,6 @@ This document outlines the basic features of working with Status Bar, including:
 
 * [How to add a button on Status Bar](#adding-a-button-on-status-bar)
 
----
-
 ## Adding a button on Status Bar
 
 1. Import the `StatusBar` module.

app-links.js

@@ -74,11 +74,11 @@ export const appLinks = [
 	},
     {
 		from: '/app-links/indent-guide-lines',
-		to: '/docs/editing-text#indent-guide-lines',
+		to: '/docs/customizing-editor#indent-guide-lines',
 	},
     {
 		from: '/app-links/emmet',
-		to: '/docs/editing-text#emmet',
+		to: '/docs/Features/emmet',
 	},
     {
 		from: '/app-links/git',
@@ -106,7 +106,7 @@ export const appLinks = [
 	},
     {
 		from: '/app-links/editor-rulers',
-		to: '/docs/Features/editor-rulers',
+		to: '/docs/customizing-editor#editor-rulers',
 	},
     {
 		from: '/app-links/find-in-files',
@@ -130,30 +130,30 @@ export const appLinks = [
 	},
 	{
 		from: '/app-links/claude-code-integration',
-		to: '/docs/file-management',
+		to: '/docs/Pro Features/ai-chat',
 	},
 	{
 		from: '/app-links/claude-code-config',
-		to: '/docs/file-management',
+		to: '/docs/Pro Features/ai-chat',
 	},
 	{
 		from: '/app-links/design-mode',
-		to: '/docs/file-management',
+		to: '/docs/design-mode',
 	},
 	{
 		from: '/app-links/ai-chat',
-		to: '/docs/file-management',
+		to: '/docs/Pro Features/ai-chat',
 	},
 	{
 		from: '/app-links/markdown-editor',
-		to: '/docs/file-management',
+		to: '/docs/Pro Features/markdown-editor',
 	},
 	{
 		from: '/app-links/resize-ruler',
-		to: '/docs/file-management',
+		to: '/docs/Pro Features/device-preview',
 	},
 	{
-		from: '/app-links//terminal',
-		to: '/docs/file-management',
+		from: '/app-links/terminal',
+		to: '/docs/Features/terminal',
 	}
 ];

blog/2026-03-04-phoenix-code-vs-brackets/index.md

@@ -70,19 +70,19 @@ These are the features the Brackets community asked for — and we finally built
 
 Brackets' live preview was view-only. You could see changes reflected in real time, but you always had to make edits in the code. With [Phoenix Pro](/docs/Pro%20Features/live-preview-edit), you can click on any element in the live preview and edit it right there — change text, swap images by dragging, rearrange elements visually. The source code updates automatically.
 
-![Phoenix Code live preview modes for editing HTML and CSS visually](../../docs/08-Features/images/livePreview/lp-mode.png)
+![Phoenix Code live preview modes for editing HTML and CSS visually](../../docs/13-Features/images/livePreview/lp-mode.png)
 
 ### Visual CSS Editing
 
 Brackets had inline color pickers — Phoenix Code keeps those and adds number dials you can scrub to adjust CSS values like margins, padding, font sizes, and more. Hover over a number, drag to adjust, and see the result update in live preview instantly.
 
-![Phoenix Code CSS number dial for adjusting margins and padding](../../docs/08-Features/images/number-dial.gif)
+![Phoenix Code CSS number dial for adjusting margins and padding](../../docs/13-Features/images/number-dial.gif)
 
 ### Built-in Git
 
 Phoenix Code ships with native Git support based on the familiar Brackets Git extension, addressing many of its earlier limitations with a simpler UX and improved reliability. Commit, push, pull, diff, and branch management, all built in.
 
-![Built-in Git integration in Phoenix Code — commit and push](../../docs/08-Features/images/git-images/git-commit.png)
+![Built-in Git integration in Phoenix Code — commit and push](../../docs/13-Features/images/git-images/git-commit.png)
 
 ### Runs in Your Browser
 
@@ -92,7 +92,7 @@ Open [phcode.dev](https://phcode.dev) and start editing — no install or admin
 
 Inspect spacing between elements, measure distances, and check alignment directly in the live preview. If you work from design mockups, this replaces the constant back-and-forth between your editor and a separate design tool.
 
-![Phoenix Code measurement and inspection tools in live preview](../../docs/07-Pro%20Features/images/measurements.png)
+![Phoenix Code measurement and inspection tools in live preview](../../docs/12-Pro%20Features/images/measurements.png)
 
 ---
 
@@ -139,6 +139,6 @@ If you've been waiting for the update Brackets deserved, this is it.
 
 - **[Open Phoenix Code in your browser](https://phcode.dev)** — no install, start immediately
 - [Download the desktop app](https://phcode.dev/download)
-- [Live Preview documentation](/docs/Features/Live%20Preview/live-preview)
+- [Live Preview documentation](/docs/Features/Live%20Preview/)
 - [Edit Mode (Pro)](/docs/Pro%20Features/live-preview-edit)
 - [Read more about the Brackets legacy](/blog/Blog-Legacy)