search

shinokada / svelte-heros-v2

Hero Icons v2 for Svelte. You can select outline and solid icons using the variation props. Svlete-Heros support major CSS framework. You can add additional CSS using the `class` props.
https://svelte-heros-v2.codewithshin.com
Apache License 2.0
41 stars 3 forks source link

[FEAT]: Global default for variation #22

Closed randomiser closed 10 months ago

randomiser commented 10 months ago

Description

I've been looking at this upcoming PR:

https://github.com/shinokada/svelte-heros-v2/pull/21

Thinking it would be useful to be able to control the solid | outline | mini defaults at a global level rather than having to apply "solid" to every image.

Something like this could work:

SvelteHeroes.defaultVariation = SvelteHeroes.solid;

Likewise setting the size globally could also be useful.

Cheers, Matt

Additional Information

No response

shinokada commented 10 months ago

You can extend a component.

// in your src/lib/MyAcademicCap.svelte
<script>
  import { AcademicCap } from 'svelte-heros-v2';
</script>

<AcademicCap variation="solid" size="50"/>

And you can use it:

<script>
  import MyAcademicCap from '$lib/MyAcademicCap.svelte';
</script>

<MyAcademicCap />
shinokada commented 10 months ago

I can see the benefits of using a config file. I will see if it works.

shinokada commented 10 months ago

Please read 'Creating global default icon' section in the docs