feat(components): create fontawesome icon component
This commit is contained in:
parent
f0a006b3d5
commit
0bfd5fbdba
23
components/icon.vue
Normal file
23
components/icon.vue
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
<script lang="ts" setup>
|
||||||
|
import { string } from 'yup';
|
||||||
|
const propo = defineProps<{name: string; istyle: "regular" | "light" | "solid" | "thin"; size?: number;}>()
|
||||||
|
const styleMap = {
|
||||||
|
"regular": "r",
|
||||||
|
"light": "l",
|
||||||
|
"solid": "s",
|
||||||
|
"thin": "t"
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<span :style="{display: 'inline-block', width: `${size || 20}px`, height: `${size || 20}px`}">
|
||||||
|
<i :style="{
|
||||||
|
fontSize: `${size || 20}px`,
|
||||||
|
display: 'inline-block',
|
||||||
|
width: 'inherit',
|
||||||
|
height: 'inherit'
|
||||||
|
}" :class="`fa${styleMap[istyle]} fa-${name}`"/>
|
||||||
|
</span>
|
||||||
|
</template>
|
Loading…
Reference in New Issue
Block a user