Font awesome update changed my main navigation sub nav arrow - how to update

Support
#1

Hi there-

With the latest update, my top navigation icon (font awesome) changed from a single carat to a double arrow. Can you post the correct css to add to my site to change it back? I can’t seem to figure it out without changing the search icon as well. I’m obviously missing something. Thank you!
navscreenshot

Would like to change the double down arrow to a single carat - font awesome: “f078”

I added this to the css but it also changes the search icon:

[data-x-icon-s]:before, [class*=“cs-fa-”]:before {
color: #1B75BB;
content: “\f078”
}

website: https://www.sigmadzn.com/

Thank you for the assist!

1 Like
#2

Hello @cindywho,

Thanks for writing to us.

In order to replace the font awesome icon I would suggest you please add this custom CSS code to the global CSS

.x-navbar .desktop .x-nav>li.menu-item-has-children i.x-framework-icon.x-framework-icon-menu:before {
content: ‘\f078’;
color: #1B75BB;
}

The purpose of providing custom CSS is to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.In case you have no idea about coding you can subscribe to One where customization questions are answered.

Hope it helps.
Thanks

1 Like
#3

Thank you for the code fix. Works great and much appreciated.

I would normally not ask for a CSS code fix but this was an error caused by the update, not something I had planned to custom code. I am guessing there are a lot of people experiencing the same issue as this error happened across multiple sites of mine. It might save you all some time if you posted a fix for everyone or a “how to” FAQ on updating the icons.

Again, thank you for all your help!

1 Like
#4

Hi @cindywho,

Glad that we are able to help you.

Thanks

#5

This did not work for me. I am still having the same problem as the OP.

#6

Hey @cleesmith2,

The issue on your end has something to do with the proper quote. Currently on your website, you are using this one: content: ‘\f078’; but you should use this one content: '\f078';.

Hope that helps.

#7

Thank you. That works.

#8

You are most welcome @cleesmith2

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.