fix: 修复connect图标不显示问题

ZiqiangStudio · Apr 19, 2023 · cbd4ed2 · cbd4ed2
1 parent 18e446f
commit cbd4ed2
Showing 1 changed file with 7 additions and 2 deletions.
diff --git a/components/app-header.vue b/components/app-header.vue
@@ -4,14 +4,16 @@
       <img src="/icon/zq-logo.svg" alt="自强Studio Logo" />
     </div>
     <div class="connect">
-      <img src="/icon/connect.svg" alt="子应用Logo" />
+      <Connect class="connect-icon" />
     </div>
     <div class="logo">
       <img :src="appLogo" />
     </div>
   </div>
 </template>
 <script setup lang="ts">
+import Connect from 'assets/icon/connect.svg?component';
+
 defineProps({
   appLogo: {
     type: String,
@@ -27,6 +29,10 @@ defineProps({
   gap: 2rem;
 }
 
+.connect-icon {
+  fill: var(--color-primary);
+}
+
 .logo {
   width: 80px;
   height: 80px;
@@ -36,7 +42,6 @@ defineProps({
   align-items: center;
   justify-content: center;
 
-
   img {
     max-width: 80px;
     max-height: 80px;