Content popup close button color

[alex5252]

When go to the backend > Pro > Content Dock > Close Button and I select the color for the close button it does not work. This is causing a problem is Safari as safari gets hung up on the incorrect CSS and will not apply new styles to change the color.

[Prasant]

Hello @alex5252,

Thanks for asking.

I checked the content dock settings and changes the close button color. After that I cleared cache as you are using WP Rocket plugin. I then loaded the front page and indeed changes are not getting reflected.

Next, I checked the updates section and over there I can see that you are using old version of Pro theme 1.2.7. I suggest you to update Pro Theme to the most recent version 2.2.5 as running old version can cause compatibility issues.

To update Pro Theme please take a look at following resources. I suggest you to first copy your website to a staging server and test the update process over there. In case any issue pops up the same can be looked at without effecting the live website:

1. Version compatibility guide: To learn about the latest and compatible versions of bundled and supported plugins, please take a look at following doc:

Version Compatibility | Themeco Docs

2. Theme Update guide: Please take a look at following article to update Pro Theme.

How to Update | Themeco Docs

3. Please take a look at following doc about changelog:

https://theme.co/changelog/

If you would like to use a workaround, then you have the option of adding following CSS under Pro > Theme Options > CSS. That being said, my recommendation would be to update Pro Theme:

#x-root ~ .tco-content-dock .tco-close-content-dock, #x-root ~ .tco-content-dock .tco-close-content-dock span, #x-root ~ .tco-content-dock .tco-close-content-dock span::before {
    color: #000 !important;
}

Feel free to change #000 to whatever color code you like.

1- I have found the proper CSS code selector using the Chrome browser Developer Toolbar:

https://www.youtube.com/watch?v=wcFnnxfA70g

2- For the CSS code itself, I suggest that you get started with this tutorial:

https://www.youtube.com/watch?v=yfoY53QXEnI

Thank you.

[alex5252]

That is literally the exact same selectors I used when trying to overwrite it with CSS. Thankss. I’ll see what I can do.

[mldarshana]

Hi There @alex5252

We always recommend to use latest versions, as there could be bugs and known issues which we have already fixed in the latest versions.

If this is your live site and hesitant to update, you can always setup a staging site and clone your live site there. Then you can test updates on your staging environment before implementing it to your live site. You can follow our migration guide, if you’re interested in that path (https://theme.co/apex/forum/t/cornerstone-content-builder-migration/126/1).

Thanks!