Stepper

This section previews the stepper component.

In this guide, we utilize a custom Stepper component, specifically designed for DocuBook, which enables users to display step-by-step instructions directly within the markdown render.

Preview

1

Step 1: Clone the DocuBook Repository

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec interdum, felis sed efficitur tincidunt, justo nulla viverra enim, et maximus nunc dolor in lorem.

2

Step 2: Access the Project Directory

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin non neque ut eros auctor accumsan. Mauris a nisl vitae magna ultricies aliquam.

3

Step 3: Install Required Dependencies

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque ut ipsum nec nulla ultricies porttitor et non justo.

Code

<Stepper>
  <StepperItem title="Step 1: Clone the DocuBook Repository">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec interdum,
    felis sed efficitur tincidunt, justo nulla viverra enim, et maximus nunc
    dolor in lorem.
  </StepperItem>
  <StepperItem title="Step 2: Access the Project Directory">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin non neque ut
    eros auctor accumsan. Mauris a nisl vitae magna ultricies aliquam.
  </StepperItem>
  <StepperItem title="Step 3: Install Required Dependencies">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque ut
    ipsum nec nulla ultricies porttitor et non justo.
  </StepperItem>
</Stepper>

Published on Dec 14, 2024