vuematerial / vue-material

Vue.js Framework - ready-to-use Vue components with Material Design, free forever.
https://www.creative-tim.com/vuematerial
MIT License
9.88k stars 1.16k forks source link

Google translate destroying material-icons <i> tags #2322

Closed us31t closed 1 year ago

us31t commented 3 years ago

Hello I have searched and hope this is no duplicate.

I have a issue with Chrome, that's why I do not use it, but folks who visit my site won't stop. :smile: :wink:

When you use Chrome-Tranlate it destroys the material font icons. I have found this issue, which describes it very good. https://github.com/google/material-design-lite/issues/1721

I would assume from the other issue, adding the "notranslate" class resolves this issue. This is nuts! I think Chromes "feature" sucks... Kill Alphabet or give me shares! :smile: :hatching_chick:

albertoaa commented 2 years ago

I'm facing the same problem and don't know how to solve it. I was thinking of extending the component and adding this class dinamically but still doesn't to work as expected

huffypiet commented 1 year ago

@albertoaa , typically, <i> tag italicizes content, in a textual case, any text processor would destroy this tag if used for other purpose.

It's safe to use <span> tag for icons in this case. I hope this helps