fix: docs

Author: antfu

README.md

@@ -37,16 +37,15 @@ For a full example, you can check the [demo](./demo) folder, which is a draft fo
 
 ## TODO
 
-- [ ] Foot notes
-- [ ] Configuration in header
-- [ ] Preload next slide
 - [ ] Shiki + TwoSlash?
 - [ ] VS Code extension
-- [ ] Presentor View
 - [ ] Timer
 - [ ] A few more themes
 - [ ] Dialog before recording
 - [ ] Docs
+- [x] Presentor Mode
+- [x] Foot notes
+- [x] Configuration in header
 - [x] Hide dev buttons on build
 - [x] Embedded editor
 - [x] Custom Monaco setup
@@ -62,6 +61,8 @@ For a full example, you can check the [demo](./demo) folder, which is a draft fo
   - [x] Dev Mode
   - [x] Build Mode
   - [x] Export PDF
+  - [x] Export PNG
+  - [x] Better CLI
   - [x] Configurable themes
 
 ## Sponsors

docs/.vitepress/config.js

@@ -26,7 +26,7 @@ const slidebars = [
       },
       {
         text: 'Record Presentation',
-        link: '/guide/record',
+        link: '/guide/recording',
       },
       {
         text: 'Presenter Mode',

docs/custom/components.md

@@ -32,4 +32,4 @@ This also works:
 
 > TODO:
 
-Check more in the [directory structure](/guide/dir-structure) section.
+Check more in the [directory structure](/custom/dir-structure) section.

docs/guide/export.md

@@ -8,10 +8,20 @@ Exporting your slides into PDF by the following command
 $ slidev export
 ```
 
-After a few seconds, your slides will be ready at `./slides.pdf`.
+After a few seconds, your slides will be ready at `./slides-exports.pdf`.
+
+## PNGs
+
+Passing the `--format png` option, it will export PNG images for each slide.
+
+```bash
+$ slidev export --format png
+```
 
 ## Single-Page Application (SPA)
 
+> ⚗️ Experimental
+
 Since Slidev is a web app, there is no reason you can't host it.
 
 You can build the slides into a self hostable SPA by:

docs/guide/record.md renamed to docs/guide/recording.md

@@ -66,15 +66,15 @@ Refer to [supported frontmatter fields](/guide/frontmatter-fields) for more deta
 
 ### Code Snippet
 
-A big reason I am making this is that I need to make code looks right in the slides. So just as you expected, you can use markdown favored code block to highlight your code.
+A big reason I am making this is that I need to make my code looks just right in the slides. So just as you expected, you can use Markdown favored code block to highlight your code.
 
 ~~~md
 ```ts
 console.log('HelloWorld')
 `​``
 ~~~
 
-Whenever you want to do some modification in the presentation, simply add `{monaco}` after the language id, it will turn the block into a full-featured Monaco editor!
+Whenever you want to do some modification in the presentation, simply add `{monaco}` after the language id, it turns the block into a full-featured Monaco editor!
 
 ~~~md
 ```ts{monaco}
@@ -118,7 +118,7 @@ All the configurations needed can also be defined in the Markdown file. For exam
 
 ```md
 ---
-theme: '@slidev/theme-seriph'
+theme: seriph
 layout: cover
 background: 'https://source.unsplash.com/1600x900/?nature,water'
 ---
@@ -128,4 +128,4 @@ background: 'https://source.unsplash.com/1600x900/?nature,water'
 This is the cover page.
 ```
 
-For more details about using a theme, refer to [this section](/guide/use-theme).
+For more details about using a theme, refer to [this section](/themes/).

docs/guide/syntax.md

@@ -4,19 +4,21 @@
 
 There are a lot of feature-rich, general-purpose, WYSIWYG slides makers like [Microsoft PowerPoint](https://www.microsoft.com/en-us/microsoft-365/powerpoint) and [Apple Keynote](https://www.apple.com/keynote/). They work pretty well on making nice slides with animations, charts, and many other things, while being very intuitive and easy to learn. So why bother making Slidev?
 
-Slidev is trying to provide the flexibility and interactivity for developers to make their presentation even more interesting, expressive, and attractive by using the tools and technologies they are already familiar with. Slidev separates the content and visual to make you focus on one thing at a time, while being able to share and use the themes with the community.
+Slidev is trying to provide the flexibility and interactivity for developers to make their presentation even more interesting, expressive, and attractive by using the tools and technologies they are already familiar with. Slidev separates the content and visuals. This allows you to focus on one thing at a time, while being able to reuse the themes from the community.
 
-While Slidev will never tend to replace those slides apps and being beginner friendly, here is a few notions and highlights of Slidev: 
+While Slidev will never tend to replace those slides apps and being beginner-friendly, here is a few notions and highlights of Slidev: 
 
 ## Slidev
 
 ### Text-based
 
 Slidev uses an extended Markdown format to store and organize your slides in a single plain text file. This lets you focus on making the content. And since the content and styles are separated, this also made it possible to switch between different themes effortlessly.
 
+Learn mode about the slides [Markdown Syntax](/guide/syntax).
+
 ### Themable
 
-Themes for Slidev can be shared and installed using npm packages. And apply them with only one line of config. Check out the [theme gallery](/guide/theme-gallery) or [how to write a theme](/guide/write-a-theme).
+Themes for Slidev can be shared and installed using npm packages. And apply them with only one line of config. Check out the [theme gallery](/themes/gallery) or [how to write a theme](/themes/write-a-theme).
 
 ### Developer Friendly
 
@@ -28,12 +30,14 @@ You can write custom components and use them directly inside your markdown file.
 
 ### Recording Support
 
-Slidev provides built-in recording and camera view. You can share your presentation with your camera view inside, or record and save seperately for your screen and camera. All with one go, no addition tools needed.
+Slidev provides built-in recording and camera view. You can share your presentation with your camera view inside, or record and save seperately for your screen and camera. All with one go, no additional tools are needed.
+
+Learn more about the [recording here](/guide/recording).
 
 ### Portable
 
 Export your slides into PDF, PNGs, or even a hostable Single-page Application (SPA) with a single command, and share them anywhere.
 
 ### Hackable
 
-Since Slidev is powered by web technologies, anything that can be done with web apps are also possible with Slidev. For example, WebGL, API requesting, Iframes or even live sharing, it's up to your imaginations!
+Since Slidev is powered by web technologies, anything that can be done with web apps are also possible with Slidev. For example, WebGL, API requesting, iframes, or even live sharing, it's up to your imaginations!