JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="textshadow">
    <li>Item 1</li>  
    <li>Item 2</li>  
    <li>Item 3</li>  
    <li>Item 4</li>  
    <li>Item 5</li>  
</ul>

<ul class="bold">
    <li>Item 1</li>  
    <li>Item 2</li>  
    <li>Item 3</li>  
    <li>Item 4</li>  
    <li>Item 5</li>  
</ul>

CSS

body{font-family:segoe ui;}
ul {margin:10px;}
ul li {display:inline-block;border-left:1px solid silver;padding:5px}
ul li:last-child {border-right:1px solid silver;}

ul.textshadow li:hover {text-shadow:0px 0px 1px black;}
ul.bold li:hover{font-weight:bold;}