Social Icon in Header no Hover

Nick,

You have some custome CSS linked.
And social icon styles are broken in it.

Please verify this code

a:hover {
    color:#023867 !important;
    text-decoration:none !important;    
}

Thank you!

...................................................
Sincerely,
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

That coding is for genric links it should not affect the social icons they should be a separate class so they can be styled independently. What I am looking for is an explanation of the behaviour on the page. Two sets of identical code one in the header and one in the footer. The icons in the footer exhibit two states normal and hover the ones in the header show no change on hover.

OK so the social icons in the footer are styled by the simple a:hover styling but the ones in the header are not. Where is the consistency? Where is the fine control? Come on guys these are basic controls that are not within the application (where they should be and should have been since a long time) and are not properly manageable with external CSS!

Hi Nick,

This selector matches ALL links on the webpage: a:hover {}
Social Icons are links too. They have own classes but there is no hover styles for class assigned to the Social icons in the Footer. Therefore the general styles for link hover state are applied.
The difference between Heder and Footer is in layout and Social icon settings. For example, in the Header you added Shape, then Group and Social icons inside. Also, it looks like these two Social Icons controls have different color settings. I see a different class applied to the Social icons in the Header. This class overrides hover color you added.

Please note that we cannot guarantee that Nicepage controls will look and work as they should if you add custom css which will affect Nicepage controls like the code provided above.

Please let us know if you have any further questions.

...................................................
Sincerely,
Olivia
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Olivia, I have now only the CSS that affect 'a:hover' set and yes it still only affects the social icons in the footer. I copied the icons from the footer and pasted them in the header so I was certain the settings were the same and the ones in the header still do not show any hover condition. So back to my original quest "What are the classes for social icons in the header and footer that I can create custom CSS for that will enable both the header and footer social icons have a hover colour change?" This is just a pretty fundamental page operation that links change colour on hover and should be a part of the base application. As it's not it should be something that can be amended with additional CSS. I feel that I'm fighting the application every step of the way to create simple HTML pages and sort of regretting buying the product - but as I have I will just have to continue to try and get it into a product fit for purpose. I would be interested to hear from someone senior why these base-level functions are not supported and are just "on the wish list".

Hi Nick,

Please attach the theme exported as the Project so we could review the settings.

...................................................
Sincerely,
Hella
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Files as requested - you need additional files as well. The custom.txt file will need to be renamed custom.css and put in the root folder.

Hi Nick,

I'm terribly sorry for the delay in replying. I have tested the theme and have found out that the hover color is not applied to the icons if the initial icon's color was changed. I mean that the default social icons control is added to your header in black color. Once the black is changed to any other color, the hover color is not applied. In the footer the default color for the social icons is white, so in the footer the hover state works ok.
I have contacted our developers about the problem and I will let you know as soon as I get any reply from them.

...................................................
Sincerely,
Hella
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

This would be best fixed by allowing the configuration of normal and hover colors for social icons so they can be made to match the colour scheme of the site. Choosing the default colours is counterproductive. If I had set the footer to be white then I'd have a problem there as well. Just implement user selection of the colors.

Hi Nick,

Thanks for the suggestion. It was added to our wishlist.

...................................................
Sincerely,
Hella
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Any news on fixing this fundamental issue?

Hi Nick,

Unfortunately the fix is not ready yet. But our developers suggested that you try adding the following code to the Site Settings >> CSS tab:

.u-text-body-color svg, .u-text-white svg, .u-text-body-alt-color svg {
    fill: currentColor!important;
}

Please let us know if you have any further questions.

...................................................
Sincerely,
Olivia
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

I also added this to my wishlist a while ago.