Pages revamp

docs/core-concepts/pages/editor-blocks.mdx

@@ -7,9 +7,12 @@ List of all the content blocks available in the page, description and comment ed
 | Block         | Description                                                                                                                      |
 |---------------|----------------------------------------------------------------------------------------------------------------------------------|
 | Text          | Used for body content in your editor, such as paragraph text.                                                                   |
-| Heading 1 (H1)| Defines the main title of the page, representing the most important heading. Used only once per page.                           |
-| Heading 2 (H2)| Defines main sections within the content, acting as subheadings under the H1 and further outlining the content structure.      |
-| Heading 3 (H3)| Defines subsections within the H2 sections, providing further organization within the content structure.                         |
+| Heading 1     | Defines the main title of the page, representing the most important heading. Used only once per page.                           |
+| Heading 2     | Defines main sections within the content, acting as subheadings under the H1 and further outlining the content structure.      |
+| Heading 3     | Defines subsections within the H2 sections, providing further organization within the content structure.  
+| Heading 4     | Defines subsections within the H3 sections, providing further organization within the content structure.                       |
+| Heading 5     | Defines subsections within the H4 sections, providing further organization within the content structure.
+| Heading 6     | This is the smallest heading, typically used for minor details or footnotes. It has the smallest font size among all headings and used when granular structuring is required. |
 | To do         | Describes items with a pending or completed state, primarily used for tasks that need to be completed.                           |
 | Bullet list   | Describes a list of unordered items.                                                                                            |
 | Numbered list | Describes a list of ordered items.                                                                                               |

docs/core-concepts/pages/overview.mdx

@@ -1,42 +1,117 @@
 ---
 title: Overview
 ---
+import Tags from '@site/src/components/Tags';
 
-Pages in Plane help you record and organise information which is useful for your project just like docs. They can be used to record meeting notes or explain the technical or product requirements. Rather than having to create docs in other tools, with pages you can collaborate quickly in the context of a project.
+Pages in Plane let you easily capture and organize project-related information. Whether you’re documenting meeting notes or detailing technical or product requirements, Pages allow you to collaborate directly within the context of your project—no need for external tools.
 
-## Toggle pages
+## Enable Pages
+Pages are enabled by default when you create a new project. If needed, you can disable or re-enable them later in your project settings.
 
-Pages are automatically enabled in a new project by default. You have the option to disable or enable them later by accessing project settings.
+## Create Pages
+- To create a new page, simply press `D` within your project, or head to the **Pages** section in the sidebar and click the **Add page** button at the top right of your screen.
 
-## Create page
+  ![Create page](https://media.docs.plane.so/pages/create-page.webp#center)
 
-To create a new page in your project, simply press `D` within your project or navigate to the pages section of the app and select "Create a new page."
+- You can set pages to be either public or private. Public pages are visible to everyone in your workspace, while private pages are only accessible to you. To change a page’s visibility, just go to the **•••** menu on that page anytime.
+  ![Public or private pages](https://media.docs.plane.so/pages/public-private-page.webp#center)
 
-Pages can be either public or private. A public page is visible to everyone in the workspace, while a private page is only visible to you.
-![Create page](https://media.docs.plane.so/pages/page-create.png)
+## Add content
+- Once you've created a page, you can add content using the `/` command, which supports 16 different content blocks from lists to images to tables to issue embeds, giving you the flexibility to structure your content exactly how you need it. For a full list of content blocks and to explore each one in detail, see [Editor blocks](/core-concepts/pages/editor-blocks). 
 
-## Adding content to a page
+  ![Slash commands](https://media.docs.plane.so/pages/slash-commands.webp#center)
 
-After creating a page you can add content inside it, currently our editor support 13 different types of content blocks. Some basic ones that you should be familiar with
+- You can easily drag and drop content blocks in Plane to rearrange them on the page. Just hover over any block, grab the **⋮⋮** icon that shows up, and drag it to where you want. Let go of it to drop the block in its new spot.
 
-1. Text - This is default content block in pages and represents any body/paragraph text you want to add on the page.
-2. Headings - There are currently 3 types of heading blocks available which can be used to structure content inside your pages
-3. Issue embed - Embed issues from your project directly in pages with this block to help you immediately reference an issue or track it's progress.
+<div className="tag-wrapper">
+### AI helper
+<Tags 
+  tags={[ 
+    { name: "Pro", additionalClass: "pro" }
+  ]} 
+ />
+</div>
 
-You can read more about all the blocks available in our [editors here](/core-concepts/pages/editor-blocks).
+![AI helper](https://media.docs.plane.so/pages/ai-helper.webp#center)
 
-Within the editor, you can also leverage the power AI to help you generate content or improve the existing content in a page.
-![Create page](https://media.docs.plane.so/pages/page-add-content.png)
+Plane’s AI tools enhance content creation by helping you refine, reframe, and enrich your writing. Whether you need to paraphrase a sentence, simplify complex information, or elaborate on a topic, Pages offers quick solutions right within the editor.
+    - Make your content more clearer or concise by rephrasing text or breaking down complex ideas.
+    - Quickly generate summaries to highlight key points, ideal for meetings or lengthy documents.
+    - Expand on ideas to add context, detail, or depth to your writing.
+    - Get suggestions for clear, catchy titles.
 
-## Actions
+### Format your content
+![Static toolbar](https://media.docs.plane.so/pages/static-toolbar.webp#center)
 
-After you create a page, you can choose to
+The static toolbar at the top of the page offers a range of styling options for your content, basic blocks like headings and lists and advanced blocks like images, tables, and more.
+    - Quickly adjust headings (H1-H6) to create a clear, structured hierarchy in your document.
+    - Add emphasis with text or background colors, and style important information with bold, italic, underline, and strikethrough options for better readability.
 
-1. Copy markdown - This copies the entire text of the page as markdown so that you can share it in other places like your wiki portal.
-2. Make a copy - Rather than starting from scratch you can create a page from an existing page to get you up to speed
-3. Lock page - If you don't want anyone else other than you editing the content of a page, you can lock it to prevent others from editing it
-4. Copy page link - Copies the link of the page to share it with your team mates or link the page to an issue.
+### Markdown support
+Plane allows you to use Markdown in Pages, making it easy to format content quickly with familiar Markdown syntax. You can create headings, lists, links, and other common formats right in your page without switching to a separate editor.
 
-## Remove pages
+To use Markdown in Plane, simply type the relevant symbols (like # for headings or - for lists) directly within the page. Plane will automatically convert your Markdown into the appropriate format, helping you keep your workflow smooth and efficient.
 
-You can currently archive pages which are not useful anymore, once archived the page can be found in the archives section for you to restore or delete it.
+### Table of contents
+![TOC and Info panel](https://media.docs.plane.so/pages/toc-info-panel.webp#center)
+
+Pages come with a built-in TOC, which helps you navigate through sections easily. You can toggle this feature on or off depending on your preference, ensuring you have quick access to the relevant content.
+
+### Info panel
+The Info panel provides metadata, showing the word count, character count, paragraph count, and reading time helping you manage and understand your document at a glance.
+
+
+### Duplicate or delete block
+![Duplicate or delete block](https://media.docs.plane.so/pages/delete-duplicate-block.webp#center)
+
+You can quickly delete or duplicate blocks within a page. Just hover over any block and click the **⋮⋮** icon that shows up. Deleting a block removes it entirely, while duplicating allows you to reuse content without starting from scratch.
+
+
+## Page actions
+![Page actions](https://media.docs.plane.so/pages/page-actions.webp#center)
+
+Once your page is created, you can click the **•••** menu in the top-right corner to perform the following actions:
+
+### Full width
+Make your content area wider and shrink the margins on any page.
+
+### Copy markdown 
+Copy the page's content in markdown format for use in places like your wiki portal.
+
+### Copy page link
+Share the page by copying its link to send to your teammates or link it in an issue.
+
+### Make a copy 
+Duplicate an existing page to jumpstart new content.
+
+### Lock page
+Prevent others from editing a page by locking it.
+
+### Archive page
+If a page is no longer needed, you can archive it. Archived pages are stored in the archives section, where you can either restore or permanently delete them.
+
+### Version history
+![Version history](https://media.docs.plane.so/pages/version-history.webp#center)
+
+Pages includes a version history feature that lets you track all updates and edits made to a document. This is especially helpful when multiple users are collaborating, as you can easily see who made changes and when. Plus, you can restore the page to a previous version if needed.
+
+### Export Pages
+![Export Page](https://media.docs.plane.so/pages/export-page.webp#center)
+
+Pages lets you export your content in various formats, including PDF and Markdown. This feature is a game-changer for project managers and team members who need to share information with stakeholders, clients, or team members who might not be using Plane.
+
+When you export to PDF, your documents keep their formatting, making them easy to share and print without any hassle. If you choose to export to Markdown, you can seamlessly integrate your content into other tools or platforms, streamlining your workflow.
+
+<div className="tag-wrapper">
+## Publish page
+<Tags 
+  tags={[ 
+    { name: "Pro", additionalClass: "pro" }
+  ]} 
+ />
+</div>
+![Publish Page](https://media.docs.plane.so/pages/publish-page.webp#center)
+
+With Plane, you can publish Pages to the web, making them accessible to anyone with the link—no login required. This feature is perfect for sharing project updates, documentation, or any other information with external stakeholders. Published pages allow viewers to engage directly by leaving comments, providing an open channel for feedback without needing access to your workspace.
+
+To publish a page, click the **Publish** button at the top right of your screen. You’ll receive a unique link to share the page.

src/css/custom.css

@@ -137,6 +137,11 @@ h1{
 }
 h2{
   font-size: 1.5rem;
+  line-height: 1.25;
+}
+h3{
+  font-size: 1.25rem;
+  line-height: 1;
 }
 
 
@@ -451,4 +456,5 @@ img[src*='#center'] {
   border-width: 0px;
   padding: .5rem;
   background-color: rgb(32 43 61);
-}
+}
+