Disable zoom on hover client area Font awesome icons

[exlhost]

Hi Team

Anyone knows how we can disbale mouse hover zoom on the font awesome icon only in the client area ?
We tried to disbale the transition in css but this is only the delay.
The hover it self is fine but the icon should not be zoomed in.

pointer-events: none; 

this is not an option as it will complete turn of hover effect

 

[brian!]

2 hours ago, DeeeExclusive said:

Anyone knows how we can disbale mouse hover zoom on the font awesome icon only in the client area ?

I wasn't sure what you were talking about at first... i've never seen a FA zoom before on clientareahome.... and then I realised, you must be talking of 21! 😲

I think that "zoom" is in effect an increase in the font size (from 55 to 70px), so you could set the hover to be 55px in custom.css and the size would never change...

.tiles .tile:hover i {
  font-size: 55px !important;
}

[exlhost]

Hi Brian

Yes we use the 21 theme,  sorry forgot to mention that.

The strange part is,  we could not locate the hover part in dev console.
After youre comment it makes sense, we now looked in theme.min.css for the . title:hover and can see the 70PX font size.
We applied the css to custom css and now the icons wont zoom in.

Thanks again Brian, youre the best.

Edited February 18, 2021 by DeeeExclusive