Set ion-tab-button hover color different then selected color

Ionic Framework
1

I want to set my tabs to one color, have the rollover color be a second color, and have the selected color be a third color.

The way it works by default is using the --color-selected value also as the rollover color.

So the button has a color(–color), when rolled over switches to(–color-selected) and then when clicked the value(–color-selected) remains.

Can I change this. I’ve tried :hover on the button and all kinds of other stuff and can’t figure it out.

2

If anyone runs across this the way I solved this was to specify the --color-selected value in the :hover

.tabbuttonclass{

--color: #164f6c;

--color-selected: #164f6c;

}

.tabbuttonclass:hover {

--color: #164f6c;

--color-selected: grey;

}