JSFiddle - React, Tailwind, and code Playground

HTML

<ol>
 	<li>een</li>
 	<li>twee
<ol>
 	<li>twee.een</li>
 	<li>twee.twee</li>
 	<li>twee.drie</li>
</ol>
</li>
 	<li>drie
<ol>
 	<li>drie.een</li>
 	<li>drie.twee
<ol>
 	<li>drie.twee.een</li>
 	<li>drie.twee.twee</li>
</ol>
</li>
</ol>
</li>
 	<li>vier</li>
</ol>

CSS

OL {
  counter-reset: item
}

LI {
  display: block
}

LI:before {
  content: counters(item, ".") " ";
  counter-increment: item
}