search

vuetifyjs / vuetify

🐉 Vue Component Framework
https://vuetifyjs.com
MIT License
39.64k stars 6.95k forks source link

[Bug Report][3.6.14] v-icon custom svg icon does not render on safari browser #20332

Open mschoeffmann opened 4 weeks ago

mschoeffmann commented 4 weeks ago

Environment

Vuetify Version: 3.6.14 Vue Version: 3.4.37 Browsers: Safari 17.6 OS: Mac OS 10.15.7

Steps to reproduce

Check the playground reproduction link. Just add a custom SVG as alias for v-icon and check on Chrome and Safari.

Expected Behavior

Icon shown on Safari as on other browsers (Chrome, Firefox). chrome (chrome screenshot)

Actual Behavior

The SVG icon works on Chrome and Firefox, but is not showing on Safari. safari (safari screenshot)

Reproduction Link

https://play.vuetifyjs.com/#...

MajesticPotatoe commented 4 weeks ago

seems like https://github.com/vuetifyjs/vuetify/blob/master/packages/vuetify/src/components/VIcon/VIcon.sass#L9 is the culprit, though not sure what other areas this effects. temp workaround would be to unset/inherit it in your project

playground