JSFiddle - React, Tailwind, and code Playground

by f0t0n

HTML

<ul id='myList'>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li class='item-selected'>Item 4</li>
    <li>Item 5</li>
    <li>Item 6</li>
    <li>Item 7</li>
</ul>

SCSS

#myList li {
    &:hover:not(.item-selected) {
        color: blue;
    }
        
    &.item-selected {
        color: red;
    }
}