Double svg tag when using custom collection

nuxt / icon

The <Icon> component, supporting Iconify, Emojis and custom components.

https://stackblitz.com/edit/nuxt-icon-playground?file=app.vue

MIT License

864 stars 37 forks source link

Double svg tag when using custom collection #165

Closed mfazail closed 1 month ago

mfazail commented 1 month ago

Project deps

"nuxt": "^3.11.2",
"nuxt-icon": "^1.0.0-beta.4"

Problem

When i use custom collection the generated svg code contains double tags something like 👇

<svg ...>
    <svg ...>
          <path  ... />
    </svg>
</svg>

Stackblitz

Reproduction link

Screenshot

Svg Mode

Css mode

alvarosabu commented 1 month ago

Same here, they also get cropped constantly, even if the viewbox size is the same as in the config

joseanzacarias commented 1 month ago

If this works for someone I was having the same error about the icon getting cropped so I removed width and height from my own svg and now its fine. @alvarosabu this could help you.

mfazail commented 1 month ago

@joseanzacarias hi, I have tried what you said but for some reason it doesn’t work on all svg.