svelte-yafal
Minimal yet meaningful abstractions for fontawesome icons in Svelte.
npm i svelte-yafal -D
REPLBasics
<script lang="ts">
import { FaSvg, Icon } from 'svelte-yafal';
import { faFlag } from '@fortawesome/free-solid-svg-icons';
</script>
<FaSvg size={3}><Icon icon={faFlag} color="var(--blue-3)" /></FaSvg>
Animations
<FaSvg size={3} beat><Icon icon={faHeart} /></FaSvg>
<FaSvg size={3} spin><Icon icon={faCog} /></FaSvg>
<FaSvg size={3} pulse><Icon icon={faSpinner} /></FaSvg>
Transformations
<FaSvg size={3}>
<Icon icon={faFlag} flipX scale={0.8} />
</FaSvg>
<FaSvg size={3}>
<Icon icon={faRedo} flipY rotate={30} scale={0.6} />
</FaSvg>
Layering
<FaSvg size={3}>
<Icon icon={faCalendar} />
<Icon icon={faSun} color="white" scale={0.25} translateX={-150} translateY={10} />
<text x="150" y="450">27</text>
</FaSvg>