VvFa Component

The VvFa component generates a FontAwesome build-process supplied <svg> markup and sub-element application elements, and comes with aesthetically flexible Vue props to globally control your instances and defaults via your application's app.vv.ts file.

VvFa Defaults

Contributor:@oberocks

                    
                        <!-- ./src/components/SomeComponent.vue -->

                        <script setup lang="ts">

                            import VvEl from './vv/elements/VvEl.vue'
                            import VvFa from './vv/elements/VvFa.vue'

                        </script>

                        <template>
                        
                            <div class="flex flex-col gap-6">

                                <VvFa family="fas" icon="house"/>

                                <VvFa family="fas" icon="house" size="2x"/>

                                <div class="flex gap-6 mx-auto">

                                    <VvEl text-color="default">
                                        <VvFa family="fas" icon="house"/>
                                    </VvEl>

                                    <VvEl text-color="primary">
                                        <VvFa family="fas" icon="house"/>
                                    </VvEl>

                                    <VvEl text-color="secondary">
                                        <VvFa family="fas" icon="house"/>
                                    </VvEl>

                                    <VvEl text-color="error">
                                        <VvFa family="fas" icon="house"/>
                                    </VvEl>

                                    <VvEl text-color="success">
                                        <VvFa family="fas" icon="house"/>
                                    </VvEl>

                                </div>

                            </div>
                        
                        </template>

The Result: