Nav icons

dctuk
Offline
Last seen: 1 year 9 months ago
Thu, 09/24/2015 - 15:50
#1
Nav icons

Hi

I'm looking to change the icons on the search nav from font icon. Pre selected icons from font awesome or font icon massively limits to flexibility of the theme.
Therefore I want to change the code to make those icons using awe-icon to svg icons. I want to keep the animation effect and the layout intact.

I have tried to create a new class and add it to the em class.

HTML

Entrance

CSS

.newicon {
background-image: url(../../img/icon_01.jpg) no-repeat;
width: 40px;
height: 40px;
}

This does not work as expected.

How can I add in a custom icon, keeping the effect?

Thanks

cindy
cindy's picture
Offline
Last seen: 1 day 4 hours ago
Fri, 09/25/2015 - 10:06

Hi,

The correct code should be:

.newicon {

display: inline-block

background: url('../../img/icon_01.jpg') no-repeat 50% 50%;

background-size: 40px 40px;

width: 40px;

height: 40px;

}

You can change the width and height

Please note that icon image size =  background-size

dctuk
Offline
Last seen: 1 year 9 months ago
Fri, 09/25/2015 - 15:22

Hi Cindy 

Thanks for your response. However this is still not working, The setup coding is frustrating to work around, heavy use of javascript. 

Please see the site here:  http://dct.staging.x2764te.ch/#

Thanks

Liam

cindy
cindy's picture
Offline
Last seen: 1 day 4 hours ago
Mon, 09/28/2015 - 16:30

Hi,

We are not very clear about what you are mentioning

Do you mean the icons in FAST FLOOR FINDER?

The icons only show if you add icon class

Log in or register to post comments