Шаги

Для стилизации нумерованного списка задач, при создании пошаговых руководств, используйте компонент <Steps>.

Превью

1. Создайте новый проект Starlight:

   npm

   npm create astro@latest -- --template starlight

   pnpm

   pnpm create astro --template starlight

   Yarn

   yarn create astro --template starlight

2. Напишите первую страницу документации.

Импорт

import { Steps } from '@astrojs/starlight/components';

Использование

Используйте компонент <Steps> для стилизации нумерованных списков задач. Это удобно для сложных пошаговых руководств, где каждый шаг должен быть чётко выделен.

Оберните <Steps> вокруг стандартного упорядоченного списка Markdown. Внутри <Steps> применим весь обычный синтаксис Markdown.

MDX

import { Steps } from '@astrojs/starlight/components';

<Steps>

1. Импортируйте компонент в свой MDX-файл:

   ```js
   import { Steps } from '@astrojs/starlight/components';
   ```

2. Оберните `<Steps>` вокруг элементов упорядоченного списка.

</Steps>

Markdoc

{% steps %}

1. Импортируйте компонент в свой MDX-файл:

   ```js
   import { Steps } from '@astrojs/starlight/components';
   ```

2. Оберните `<Steps>` вокруг элементов упорядоченного списка.

{% /steps %}

Превью

1. Импортируйте компонент в свой MDX-файл:

   import { Steps } from '@astrojs/starlight/components';

2. Оберните <Steps> вокруг элементов упорядоченного списка.

Параметры <Steps>

Реализация: Steps.astro

Компонент <Steps> не принимает никаких параметров.