docs: rework scaffolding your first vite project (vitejs#20477)

Author: patak-dev

docs/guide/index.md

@@ -43,10 +43,6 @@ The supported template presets are:
 
 ## Scaffolding Your First Vite Project
 
-::: tip Compatibility Note
-Vite requires [Node.js](https://nodejs.org/en/) version 20.19+, 22.12+. However, some templates require a higher Node.js version to work, please upgrade if your package manager warns about it.
-:::
-
 ::: code-group
 
 ```bash [npm]
@@ -73,6 +69,12 @@ $ deno init --npm vite
 
 Then follow the prompts!
 
+::: tip Compatibility Note
+Vite requires [Node.js](https://nodejs.org/en/) version 20.19+, 22.12+. However, some templates require a higher Node.js version to work, please upgrade if your package manager warns about it.
+:::
+
+:::: details Using create vite with command line options
+
 You can also directly specify the project name and the template you want to use via additional command line options. For example, to scaffold a Vite + Vue project, run:
 
 ::: code-group
@@ -104,6 +106,8 @@ See [create-vite](https://github.com/vitejs/vite/tree/main/packages/create-vite)
 
 You can use `.` for the project name to scaffold in the current directory.
 
+::::
+
 ## Community Templates
 
 create-vite is a tool to quickly start a project from a basic template for popular frameworks. Check out Awesome Vite for [community maintained templates](https://github.com/vitejs/awesome-vite#templates) that include other tools or target different frameworks.