创建uniapp基础形态

2026-07-15 17:39:10 +08:00
parent 743c5cb4eb
commit 11e0763766
22 changed files with 5311 additions and 43 deletions
@@ -0,0 +1,61 @@
+<template>
+	<text class="fa-icon" :class="fontClass" :style="iconStyle">{{ iconChar }}</text>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import { FA_ICONS } from '@/utils/fa-icons.js'
+
+const props = defineProps({
+	name: {
+		type: String,
+		required: true
+	},
+	type: {
+		type: String,
+		default: 'solid'
+	},
+	color: {
+		type: String,
+		default: 'inherit'
+	},
+	size: {
+		type: [Number, String],
+		default: 16
+	}
+})
+
+const iconChar = computed(() => FA_ICONS[props.name] || '')
+
+const fontClass = computed(() =>
+	props.type === 'brands' ? 'fa-font-brands' : 'fa-font-solid'
+)
+
+const iconStyle = computed(() => ({
+	color: props.color,
+	fontSize: typeof props.size === 'number' ? `${props.size}px` : props.size,
+	lineHeight: 1
+}))
+</script>
+
+<style scoped>
+.fa-icon {
+	display: inline-block;
+	font-style: normal;
+	vertical-align: middle;
+}
+</style>
+
+<style>
+.fa-font-solid {
+	font-family: 'Font Awesome 7 Free';
+	font-weight: 900;
+	font-style: normal;
+}
+
+.fa-font-brands {
+	font-family: 'Font Awesome 7 Brands';
+	font-weight: 400;
+	font-style: normal;
+}
+</style>