I want to add navigational hints (e.g. arrows) to my mobile dropdown. I followed the guide on https://www.cssscript.com/pure-css-mobile-compatible-responsive-dropdown-menu/ to create a css only mobile menu with submenus. I want to create navigational hints (e.g. + and -) using the :after css. However, once a parent menu item has been selected (input type = checkbox) it seems to stay in the "hover" state. Is there a way to remove the :hover state when the checkbox is "unchecked"?
If you go to that guide, and add the below code to the CSS, the selected dropdown parent items will remain red.
.toggle:hover {
background-color: crimson;
}
