Options
Basic usage
Each step is an li
directly inside the container. This component supports a maximum of 10 progress steps.
<ul class="ds-progress-steps">
<li>Start</li>
<li>One Step</li>
<li>Another Step</li>
<li>End</li>
</ul>
Indicating progress
Adding the css modifier --X
(where X is a number between 1 and 10) will style the progress up to the selected step.
<ul class="ds-progress-steps --3">
<li> Choose account type/region </li>
<li> Create account </li>
<li> Verify your email </li>
<li> Enter contact details </li>
<li> Account submission complete </li>
</ul>