Étapes

Pour mettre en forme une liste numérotée de tâches et créer des guides étape par étape, utilisez le composant <Steps>.

Aperçu

1. Créez un nouveau projet Starlight :

   npm

   npm create astro@latest -- --template starlight

   pnpm

   pnpm create astro --template starlight

   Yarn

   yarn create astro --template starlight

2. Écrivez votre première page de documentation.

Import

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

Utilisation

Utilisez le composant <Steps> pour mettre en forme des listes numérotées de tâches. Celui-ci est utile pour des guides étape par étape plus complexes où chaque étape doit être clairement mise en évidence.

Entourez une liste ordonnée standard Markdown avec le composant <Steps>. Toute la syntaxe Markdown habituelle est utilisable à l’intérieur de <Steps>.

MDX

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

<Steps>

1. Importez le composant dans votre fichier MDX :

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

2. Entourez les éléments de votre liste ordonnée avec `<Steps>`.

</Steps>

Markdoc

{% steps %}

1. Importez le composant dans votre fichier MDX :

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

2. Entourez les éléments de votre liste ordonnée avec `<Steps>`.

{% /steps %}

Aperçu

1. Importez le composant dans votre fichier MDX :

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

2. Entourez les éléments de votre liste ordonnée avec <Steps>.

Props de <Steps>

Implémentation : Steps.astro

Le composant <Steps> n’accepte pas de props.