Style Tooltip

Hi @kongb

Please use below CSS code (you can change #ff6600 in this code):

.wpcvs-terms [class*="hint--"]:after {
    background-color: #ff6600;
    text-shadow: none;
}

.wpcvs-terms .hint--top:before {
    border-top-color: #ff6600;
}

And the result https://www.screencast.com/t/k5qKDexHfZQl

Hi! How about making the tooltip the same color as the swatches? I mean, when you hover over a variation the tooltip should get the same color as the swatch. Thanks!

• This reply was modified 3 years, 3 months ago by zoomzet.

Hi @zoomzet

You can do that by adding specific CSS code for each color, e.g:

.wpcvs-terms .wpcvs-term[data-term="blue"]:after {
    background-color: blue;
    text-shadow: none;
}

.wpcvs-terms .wpcvs-term[data-term="blue"]:before {
    border-top-color: blue;
}

Do the same with other colors.

Great thanks @wpclever !
Works like a charm!