JSFiddle - React, Tailwind, and code Playground
by Spencer Smith
HTML
<div class="FullscreenContent FullscreenContent--noScroll Box-root Box-background--offset" style="flex: 1 1 100%;">
<div style="width: 100%; height: 100%; overflow-y: auto;">
<div class="Box-root Flex-flex" style="min-height: 100%;">
<div class="Box-root Padding-all--48" style="pointer-events: none; background: white;">
<div class="Box-root Flex-flex Flex-direction--row Flex-justifyContent--flexStart Flex-wrap--nowrap" style="margin-left: -20px; margin-top: -20px;">
<div class="Box-root Box-hideIfEmpty Margin-top--20 Margin-left--20" style="pointer-events: auto;">
<div class="Box-root" style="width: 250px;">
<div class="Box-root" style="position: fixed; width: 250px;">
<nav>
<ol style="display: flex; justify-content: space-between; flex-direction: column;">
<li aria-current="false" class="db-ProgressIndicator-StepContainer" style="display: flex; flex-direction: row; flex: 1 1 0%;">
<div aria-hidden="true" class="db-ProgressIndicator-BulletContainer Box-root Flex-flex Flex-alignItems--center Flex-direction--column Flex-justifyContent--center" style="background-color: var(--sail-color-gray-100); width: 26px; height: auto; border-radius: 16px 16px 0px 0px;">
<div class="db-ProgressIndicator-BulletContainer-Circle Box-root Flex-flex Flex-alignItems--center Flex-justifyContent--center" style="width: 26px; height: 26px;">
<div class="Box-root Flex-flex Flex-alignItems--center Flex-justifyContent--center" style="background-color: var(--sail-color-blue-500); border-radius: 100%; color: var(--sail-color-white); cursor: default; height: 20px; line-height: 20px; width: 20px;">1</div>
</div>
<div class="db-ProgressIndicator-BulletContainer-ProgressLine Box-root" style="background-color: var(--sail-color-gray-100); width: 100%; height: auto;...