JSFiddle - React, Tailwind, and code Playground

HTML

<ol>
    <li class="parent">
      <ol>
        <li>Lorem ipsum.</li>
        <li>Excepteur sint occaecat cupidatat non proident:
            <ol>
                <li>sunt in culpa qui officia,</li>
                <li>deserunt mollit anim id est laborum.</li>
            </ol>
        </li>
        <li>Ut enim ad minim veniam.
            <ol>
                <li>Quis nostrud exercitation.</li>
                <li>Ullamco laboris nisi ut.
                    <ol>
                        <li>
                            Duis aute irure dolor
                        </li>
                    </ol>
                </li>
            </ol>
        </li>
      </ol>
    </li>
</ol>

CSS

ol {
  list-style-type: none;
  counter-reset: item;
  margin: 0;
  padding: 0;
}

li {
  display: table;
  counter-increment: item;
  margin-bottom: 0.6em;
}

li:before {
    content: counters(item, ".") ;
    display: table-cell;
    padding-right: 0.6em;    
}

li li {
    margin: 0;
}

li li:before {
    content: counters(item, ".") " ";
}

li.parent:before {
  content: "";
}