[aaron_softwarepromotionsParticipant]

I would like to re-open this topic that someone else started:

Section color changes after saving on some pages.

The same thing is happening to me, and I had to force the background-color through the style options instead of being able to use the Cornerstone background color picker on the page.

Take this page as an example:
https://www.softwarepromotions.com

The header is set to the following:

.x-navbar, .x-navbar .sub-menu {
    background-color: #51798d !important;
}

When I use the Cornerstone background color picker to set the section just below the top nav, it converted #51798d to rgb(82, 122, 142) which is not correct.

When it would render the page, it would set the actual code to this:
background-color: hsl(200, 27%, 44%);

When I noticed that the color was off and realized that Cornerstone was making the wrong conversion, I forced the background-color through the sections style options.

Yes, that works, but it’s not an ideal solution.

[Nabeel AModerator]

Hi there,

Thanks for writing around! Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password
– FTP credentials

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

[aaron_softwarepromotionsParticipant]

This reply has been marked as private.

[Rue NelModerator]

Hello There,

Thanks for updating in! Please take note that Cornerstone is using HSL. Any color you have inserted in the color picker will be converted in HSL format.

You can check it out here: http://hslpicker.com/#527a8e

[aaron_softwarepromotionsParticipant]

I know that but it’s not making a correct conversion.

background-color: #51798d is slightly different than background-color: hsl(200, 27%, 44%)

My workaround does solve the problem but the color picker is a bit misleading. If I enter in #51798d, that’s not what’s output to the page.

Does that make sense?

[Rue NelModerator]

Hello Again,

All the out of the color picker is in HSL format. That is why even if you enter #51798d, the output in the page is still hsl(200, 27%, 44%). If you want to preserved and override it, the an inline css could help. Or to avoid less confusion, you can edit your page in Cornerstone and insert the following custom css in the settings tab, Settings > Custom CSS like

body #x-section-1 {
  background-color: #51798d !important;
}

!important is needed to override the inline css which was generated by the color picker. I would highly recommend that you just simply leave the color picker blank or set it to transparent or choose not to have a background color (set it to none: http://prntscr.com/enr3d8). Just use the inline css or the css above for the custom css in the settings.

Hope this explains it briefly.

[aaron_softwarepromotionsParticipant]

Thank you.

[RahulModerator]

You’re most welcome.

Let us know if we can help with anything else.

Thanks.

[Author]

Posts