CSS selectors

Since the recent updates, the layout selectors for the product list action button tooltips have changed, and our custom red styling is stuck on the default black. Could you provide the updated CSS selectors or CSS variables required to change the background and arrow color of the product loop hover tooltips?

/* What we are trying to fix: updating our old tooltip styling to the latest version */
.wd-tltp .wd-tooltip-label {
background-color: #d62128 !important;
color: #FFF;
}
.wd-buttons[class*=”wd-pos-r”] .wd-tooltip-label::before, .wd-tltp-left .wd-tooltip-label::before {
border-left-color: #d62128 !important;
}

Hello,

Can you please share some screenshots for better understanding, along with the page URL where the css is not working, so I can check and give you a possible solution?

Best Regards

I want the tooltip red

Attachments:

You must be logged in to view attached files.

Hello,

Please add the following code to Theme Settings > Custom CSS > Global:

.tooltip {
    --wd-tooltip-bg: #d62128 !important;
    --wd-tooltip-color: #fff !important;
}

Best Regards

Thank you! This worked!

Hello,

You’re Most Welcome!

Feel free to write back anytime. If you need further assistance, we are always here to help you.

If you have a minute, we’d truly appreciate your feedback — it helps us improve the product and shape future updates more effectively. We’d love your feedback on our theme: https://tally.so/r/w4l54k

Thanks for contacting us.
Have a great day.

Topic Closed.
Best Regards.

[Author]

Posts