Accordion toggles selected & visited state?

Hi, I’ve been using the accordion for a side panel on my new sites portfolio pages. I’ve managed to customise quite a bit with a bit of css content and some shortcodes.which I’m pretty happy with.

One thing I was wondering was the toggle icons themselves, is it possible to have a selected state too rather than just the hover state? So say they would be blue when selected?

I have tried with ::selected on a few elements but haven’t managed to get it to work.

Current code I have for the toggles is as..

.custom-accordion .toggle_icon:before {
	font-family: 'dig_icons';   
	content:'\e815';    
	position: absolute;
	font-size: 12px;
	top:50%;
	transform: translateY(-50%);
	left: 0px;
	line-height: 0;
	color:rgba(255, 255, 255, 0.2);
}

/* Active tab icon */
.custom-accordion .activeTitle .toggle_icon:before {
	font-family: 'dig_icons';        
	content:'\e814';
}

/* Tab icon on hover */
.custom-accordion .toggler:hover .toggle_icon:before {
	color:rgba(255, 255, 255, 1);
}

Any help greatly appreciated!

• This topic was modified 5 years, 7 months ago by Digilocker.