149 lines
2.9 KiB
Markdown
149 lines
2.9 KiB
Markdown
---
|
|
title: Steps
|
|
icon: lucide:arrow-down-0-1
|
|
badges:
|
|
- value: Source
|
|
icon: lucide:code
|
|
to: https://github.com/ZTL-UwU/shadcn-docs-nuxt/blob/main/components/content/Steps.vue
|
|
target: _blank
|
|
---
|
|
|
|
## Usage
|
|
|
|
::stack
|
|
::div{class="p-4 md:p-6"}
|
|
::steps
|
|
### Get Starter Template
|
|
|
|
::code-group
|
|
```bash [npm]
|
|
npx nuxi@latest init <project-name> -t github:ZTL-UwU/shadcn-docs-nuxt-starter
|
|
```
|
|
```bash [pnpm]
|
|
pnpm dlx nuxi@latest init <project-name> -t github:ZTL-UwU/shadcn-docs-nuxt-starter
|
|
```
|
|
```bash [bun]
|
|
bunx nuxi@latest init <project-name> -t github:ZTL-UwU/shadcn-docs-nuxt-starter
|
|
```
|
|
::
|
|
|
|
::alert
|
|
Alternatively, you can clone or download the template from the [GitHub repo](https://github.com/ZTL-UwU/shadcn-docs-nuxt-starter).
|
|
::
|
|
|
|
### Install Dependencies
|
|
|
|
::code-group
|
|
```bash [npm]
|
|
npm install
|
|
```
|
|
```bash [pnpm]
|
|
pnpm install
|
|
```
|
|
```bash [bun]
|
|
bun install
|
|
```
|
|
::
|
|
|
|
### Development Server
|
|
|
|
::code-group
|
|
```bash [npm]
|
|
npm run dev -- -o
|
|
```
|
|
```bash [pnpm]
|
|
pnpm dev -o
|
|
```
|
|
```bash [bun]
|
|
bun run dev -o
|
|
```
|
|
::
|
|
::
|
|
::
|
|
```mdc height=400
|
|
::steps
|
|
### Get Starter Template
|
|
|
|
::code-group
|
|
```bash [npm]
|
|
npx nuxi@latest init <project-name> -t github:ZTL-UwU/shadcn-docs-nuxt-starter
|
|
```
|
|
```bash [pnpm]
|
|
pnpm dlx nuxi@latest init <project-name> -t github:ZTL-UwU/shadcn-docs-nuxt-starter
|
|
```
|
|
```bash [bun]
|
|
bunx nuxi@latest init <project-name> -t github:ZTL-UwU/shadcn-docs-nuxt-starter
|
|
```
|
|
::
|
|
|
|
::alert
|
|
Alternatively, you can clone or download the template from the [GitHub repo](https://github.com/ZTL-UwU/shadcn-docs-nuxt-starter).
|
|
::
|
|
|
|
### Install Dependencies
|
|
|
|
::code-group
|
|
```bash [npm]
|
|
npm install
|
|
```
|
|
```bash [pnpm]
|
|
pnpm install
|
|
```
|
|
```bash [bun]
|
|
bun install
|
|
```
|
|
::
|
|
|
|
### Development Server
|
|
|
|
::code-group
|
|
```bash [npm]
|
|
npm run dev -- -o
|
|
```
|
|
```bash [pnpm]
|
|
pnpm dev -o
|
|
```
|
|
```bash [bun]
|
|
bun run dev -o
|
|
```
|
|
::
|
|
::
|
|
```
|
|
::
|
|
|
|
### Multi-level headings
|
|
:badge[0.4.6]{variant="outline"}
|
|
|
|
::stack
|
|
::div{class="p-4 md:p-6"}
|
|
::steps{:level="5"}
|
|
##### Specify the level of headings to use
|
|
|
|
```mdc
|
|
::steps{:level="5"}
|
|
```
|
|
|
|
##### Available Headings
|
|
|
|
`h1` through `h6`. Defaults to `h3`.
|
|
::
|
|
::
|
|
```mdc
|
|
::steps{:level="5"}
|
|
##### Multi-level headings
|
|
|
|
```mdc
|
|
::steps{:level="5"}
|
|
```
|
|
|
|
##### Available Headings
|
|
|
|
`h1` through `h6`. Defaults to `h3`.
|
|
::
|
|
```
|
|
::
|
|
|
|
## Props
|
|
|
|
:field{name="level" type="number"}[Specify the level of headings to use]
|