Css content using TailwindCSS

Question

I'm struggling to transform the following code snippet to use Tailwind css but without success so far.

Original code:

<li>
   <Link to="/test">abc</Link>
</li>

css:

ol li:not(:last-child)::after {
  color: red;
  margin: 0 10px;
  content: '/';
}

Is there a way to get rid of the css file and put all those rules in tailwind? The part with that content, /, seems impossible.

Answer 1

You can use the class after:content-['/']

<li>
  <a 
    class="after:content-['/'] after:inline"
    href="/test">abc
  </a>
</li>

https://play.tailwindcss.com/ztw0UhpFpg

Source: https://dev.to/j471n/how-to-use-before-and-after-in-tailwind-css-1he