dylanblokhuis/svelte-feather-icons

svelte3 dont work size

Closed this issue · 3 comments

<script>
    import { AirplayIcon } from 'svelte-feather-icons'
</script>

<!-- Working with width/height = 100% -->
<AirplayIcon />

<!-- NOT working -->
<airplay-icon />

<!-- NOT working -->
<airplay-icon size="25" class="custom-class"/>

Size will not work for you, the source code isn't taking it in considerations. I doubt if I open a PR that it will be accepted

cimm commented

Same for me, I expected size="1.5x" to work as it does in vue-feather-icons. @dylanblokhuis is this something you are considering/would be open to accept a pull request for?

My current workaround adds a bit of unnecessary HTML. You can't size the SVG element directly in CSS as (I think) it's loaded after the CSS.

<style>
  span { width: 1em; display: inline-block; }
</style>

<p>Lorem ipsum <span><AirplayIcon/></span> dolor sit amet.</p>

I recognize it's annoying to keep adding parent elements to size the icon. I might PR this later today.