From 2a995f1ba5ca27b1d766507e1e0a7b52990e927d Mon Sep 17 00:00:00 2001
From: 7ee <67595284+SivonLi@users.noreply.github.com>
Date: Thu, 18 Apr 2024 01:36:04 +0800
Subject: [PATCH] feat: replace svg with iconify (#606)

---
 apps/client/assets/comments.json              |  9 ---
 apps/client/components/DropMenu.vue           | 62 +++----------------
 apps/client/components/Navbar.vue             | 31 ++--------
 apps/client/components/common/backTop.vue     | 11 +---
 apps/client/components/home/Banner.vue        | 34 ++--------
 apps/client/components/home/Comments.vue      | 17 ++---
 apps/client/components/home/Contact.vue       | 42 +------------
 apps/client/components/home/PayCard.vue       | 30 +++------
 apps/client/components/home/Questions.vue     | 21 +------
 apps/client/components/main/Answer.vue        | 13 +---
 apps/client/components/main/AnswerTip.vue     | 18 +-----
 .../components/main/Message/message.vue       | 50 +++------------
 .../client/components/main/PrevAndNextBtn.vue | 32 +---------
 .../client/components/main/StudyVideoLink.vue | 13 +---
 apps/client/components/main/Summary.vue       | 18 +-----
 apps/client/components/main/Tool.vue          | 17 +----
 apps/client/package.json                      |  1 +
 apps/client/public/twitter.svg                |  1 -
 apps/client/tailwind.config.js                |  2 +-
 pnpm-lock.yaml                                |  9 +++
 20 files changed, 75 insertions(+), 356 deletions(-)
 delete mode 100644 apps/client/public/twitter.svg

diff --git a/apps/client/assets/comments.json b/apps/client/assets/comments.json
index c2b5224f6..f5d62247b 100644
--- a/apps/client/assets/comments.json
+++ b/apps/client/assets/comments.json
@@ -6,7 +6,6 @@
     "link": "",
     "comment": "Earthworm is more than just a tool; It's a journey into the heart of language learning, making every sentence and conjunction an adventure. With its addictive gameplay, it's not just an exercise, it's a daily habit that invites you to take a deeper look at the richness of the English language!",
     "chinese": " Earthworm 不仅仅是一个工具;这是一次进入语言学习核心的旅程，让每个句子和连词都成为一次冒险。凭借其令人上瘾的游戏玩法，它不仅是一种练习，而且是一种日常习惯，邀请您更深入地了解英语的丰富性！",
-    "icon": "/twitter.svg",
     "time": 1708423574717,
     "likeCount": 1342
   },
@@ -17,7 +16,6 @@
     "link": "",
     "comment": "I am simply fascinated by this app! This progressive way of learning makes each stage full of challenges, but also gives me a strong sense of achievement. I have been unable to stop the pace of learning, I am eager to make a little progress, I hope you can climb another tall building!",
     "chinese": "我简直被这款应用迷住了！这种渐进式的学习方式，让每个阶段都充满挑战，同时也让我有了一种强烈的成就感。我已经不能停下学习的脚步，我渴望一点点的进步，希望能更上一层楼！",
-    "icon": "/twitter.svg",
     "time": 1708409873687,
     "likeCount": 197
   },
@@ -28,7 +26,6 @@
     "link": "",
     "comment": "This application overcomes the boredom of English learning. I can't stop brushing courses now.",
     "chinese": "这个应用克服了英语学习的枯燥，我现在刷课程刷得停不下来。",
-    "icon": "/twitter.svg",
     "time": 1706005913747,
     "likeCount": 79
   },
@@ -39,7 +36,6 @@
     "link": "",
     "comment": "Now I go through the app every day and I feel that my English has improved by leaps and bounds, which is fun and fulfilling. I hope to be able to join and share after studying like me, it will be addictive!",
     "chinese": "现在我每天都要浏览这个应用程序，我觉得我的英语突飞猛进，有趣又充满成就感。我希望能够加入和我一样学习后进行打卡分享，会上瘾的！",
-    "icon": "/twitter.svg",
     "time": 1706931528936,
     "likeCount": 520
   },
@@ -50,7 +46,6 @@
     "link": "",
     "comment": "Such interesting and fulfilling English learning application, it is really overwhelming. I practice it every day now, it has become a habit. Awesome!",
     "chinese": "如此有趣又充实的英语学习应用，真是让人不知所措。我现在每天都在练习，这已经成为一种习惯。棒！",
-    "icon": "/twitter.svg",
     "time": 1706863861905,
     "likeCount": 98
   },
@@ -61,7 +56,6 @@
     "link": "",
     "comment": "Through sentence splitting, I feel that I have a deeper understanding of sentences after brushing the lessons. The feeling is subtle, and when I open it the next day, it gets smoother every time!",
     "chinese": "通过句子拆分进行学习，我感觉我刷课之后，对句子的理解更加深刻。这种感觉是潜移默化的，当我第二天打开，每次都会变得更加流畅！",
-    "icon": "/twitter.svg",
     "time": 1704763341161,
     "likeCount": 86
   },
@@ -72,7 +66,6 @@
     "link": "",
     "comment": "I have never been so enthusiastic about learning as I am now. This app really makes learning so interesting that every learning is like a challenge that I can't resist. It's such a great feeling that I can keep brushing the course without getting bored.",
     "chinese": "再也没有像现在这样，我对学习如此充满热情。这个应用真是把学习变得如此有趣，每一次学习都像是一种挑战，让我无法抗拒。这种感觉太棒了，我能够一直刷课程而不觉得无聊",
-    "icon": "/twitter.svg",
     "time": 1709913419937,
     "likeCount": 486
   },
@@ -83,7 +76,6 @@
     "link": "",
     "comment": "I really can't resist the magic of this English learning application of conjunctions and sentences. When I am free every day, I will habitually open this app and can't help but challenge myself. This is a new way of entertainment for me!",
     "chinese": "我真的无法抵抗这款连词造句的英语学习应用的魔力，每天闲下来的时候，我都会习惯性地打开这款应用，忍不住去挑战一下自己，这对我来说是一种全新的娱乐方式！",
-    "icon": "/twitter.svg",
     "time": 1708567188968,
     "likeCount": 232
   },
@@ -94,7 +86,6 @@
     "link": "",
     "comment": "I didn't expect that learning English could be so interesting. I can't stop the way this conjunction makes sentences.",
     "chinese": "真没想到学习英语可以这么有趣，这个连词造句的方式简直让我停不下来。",
-    "icon": "/twitter.svg",
     "time": 1703189419913,
     "likeCount": 78
   }
diff --git a/apps/client/components/DropMenu.vue b/apps/client/components/DropMenu.vue
index e76fadc00..204602aaf 100644
--- a/apps/client/components/DropMenu.vue
+++ b/apps/client/components/DropMenu.vue
@@ -7,22 +7,7 @@
       tabindex="0"
       class="btn btn-ghost btn-sm mx-0 h-8 rounded-md px-1"
     >
-      <svg
-        t="1711437189034"
-        class="icon"
-        viewBox="0 0 1024 1024"
-        version="1.1"
-        xmlns="http://www.w3.org/2000/svg"
-        p-id="9876"
-        width="1.5em"
-        height="1.5em"
-      >
-        <path
-          d="M716.714667 912.384a30.378667 30.378667 0 0 0-4.48-3.925333 24.576 24.576 0 0 0-4.266667 3.669333 51.541333 51.541333 0 0 1-35.754667 14.336 50.730667 50.730667 0 0 1-24.917333-6.4l-22.997333-12.8a50.730667 50.730667 0 0 1-23.424-60.672l0.256-0.981333a3.968 3.968 0 0 0-2.901334-3.157334 51.2 51.2 0 0 1-44.16-42.922666 211.456 211.456 0 0 1-2.261333-25.173334 169.216 169.216 0 0 1 2.517333-25.6 51.2 51.2 0 0 1 43.904-42.922666c1.408-0.256 2.901333-1.493333 2.901334-2.517334a4.266667 4.266667 0 0 0-0.256-1.493333 50.901333 50.901333 0 0 1 23.936-60.928l24.661333-13.568a53.077333 53.077333 0 0 1 24.661333-6.4 50.261333 50.261333 0 0 1 35.072 14.08l4.266667 3.669333h0.256a37.248 37.248 0 0 0 4.266667-3.669333 51.498667 51.498667 0 0 1 34.816-13.568 49.578667 49.578667 0 0 1 24.661333 6.4l23.936 13.098667a51.456 51.456 0 0 1 23.68 60.928l-0.256 0.768a3.285333 3.285333 0 0 0 2.986667 3.242666 51.2 51.2 0 0 1 43.904 42.922667 182.016 182.016 0 0 1 2.176 25.6 186.154667 186.154667 0 0 1-2.176 25.6 50.901333 50.901333 0 0 1-43.904 42.666667c-1.493333 0.256-2.986667 1.664-2.986667 2.688a4.266667 4.266667 0 0 0 0.256 1.493333 51.2 51.2 0 0 1-23.936 60.672l-23.936 13.354667a49.578667 49.578667 0 0 1-24.661333 6.4 51.2 51.2 0 0 1-35.84-14.890667z m26.069333-45.098667a102.4 102.4 0 0 1 9.898667 8.533334l23.936-13.312a51.2 51.2 0 0 1-2.986667-16.512 54.442667 54.442667 0 0 1 47.658667-54.229334 173.653333 173.653333 0 0 0 1.664-17.493333 170.666667 170.666667 0 0 0-1.664-17.578667 54.570667 54.570667 0 0 1-47.658667-54.229333 48.64 48.64 0 0 1 2.986667-16.512l-23.68-13.312a80.085333 80.085333 0 0 1-9.898667 7.936 45.013333 45.013333 0 0 1-59.178667 0c-4.266667-3.242667-7.68-6.186667-9.898666-8.149333l-24.661334 13.568a58.026667 58.026667 0 0 1 2.730667 16.512 54.570667 54.570667 0 0 1-47.317333 54.229333 88.789333 88.789333 0 0 0 0 35.072 54.442667 54.442667 0 0 1 47.317333 54.229333 59.733333 59.733333 0 0 1-2.730667 16.512l22.741334 12.8c2.432-2.176 5.674667-5.162667 9.813333-8.533333a52.565333 52.565333 0 0 1 30.336-11.562667 51.797333 51.797333 0 0 1 30.592 12.074667z m-592.768 8.533334a362.965333 362.965333 0 0 1 286.421333-354.517334 219.861333 219.861333 0 1 1 152.917334 0 368.981333 368.981333 0 0 1 82.688 28.416 32.085333 32.085333 0 1 1-28.16 57.685334 294.016 294.016 0 0 0-130.986667-30.336 299.050667 299.050667 0 0 0-298.666667 298.666666 32.042667 32.042667 0 1 1-64 0zM357.674667 316.330667a155.349333 155.349333 0 0 0 155.178666 154.922666 155.221333 155.221333 0 0 0 155.178667-154.922666 155.178667 155.178667 0 0 0-310.314667 0z m292.352 457.685333a62.165333 62.165333 0 1 1 62.165333 62.165333 62.208 62.208 0 0 1-62.122667-62.122666z m42.666666 0a19.498667 19.498667 0 1 0 19.498667-19.498667 19.413333 19.413333 0 0 0-19.456 19.541334z"
-          p-id="9877"
-          fill="currentColor"
-        ></path>
-      </svg>
+      <i class="i-ph-user-gear h-6 w-6"></i>
     </button>
     <ul
       v-if="showDropdown"
@@ -38,7 +23,11 @@
           @click="item.eventName"
           class="flex items-center gap-2 rounded-lg hover:bg-gray-100 hover:text-gray-700 dark:hover:bg-fuchsia-500 dark:hover:text-white"
         >
-          <span v-html="item.icon"></span>
+          <!-- <span v-html="item.icon"></span> -->
+          <i
+            class="h-6 w-6"
+            :class="item.icon"
+          ></i>
 
           <span class="text-sm font-medium">
             {{ item.title }}
@@ -69,56 +58,25 @@ const MENU_OPTIONS = [
     title: "用户信息",
     name: "accountInfo",
     eventName: handleViewUserInfo,
-    icon: `<svg
-        xmlns="http://www.w3.org/2000/svg"
-        class="size-5 opacity-75"
-        fill="none"
-        viewBox="0 0 24 24"
-        stroke="currentColor"
-        stroke-width="2"
-      >
-        <path
-          stroke-linecap="round"
-          stroke-linejoin="round"
-          d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"
-        />
-      </svg>`,
+    icon: "i-ph-user",
   },
   {
     title: "返回游戏",
     name: GO_BACK_GAME_NAME,
     eventName: handleGoBackGamePage,
-    icon: `<svg xmlns="http://www.w3.org/2000/svg" class="size-5 opacity-75" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 11h4M8 9v4m7-1h.01M18 10h.01m-.69-5H6.68a4 4 0 0 0-3.978 3.59l-.017.152C2.604 9.416 2 14.456 2 16a3 3 0 0 0 3 3c1 0 1.5-.5 2-1l1.414-1.414A2 2 0 0 1 9.828 16h4.344a2 2 0 0 1 1.414.586L17 18c.5.5 1 1 2 1a3 3 0 0 0 3-3c0-1.545-.604-6.584-.685-7.258q-.01-.075-.017-.151A4 4 0 0 0 17.32 5"/></svg>`,
+    icon: "i-ph-game-controller",
   },
   {
     title: "设置",
     name: "setting",
     eventName: handleSetting,
-    icon: `<svg
-      xmlns="http://www.w3.org/2000/svg"
-      class="size-5 opacity-75"
-      fill="none"
-      viewBox="0 0 24 24"
-      stroke="currentColor"
-      stroke-width="2"
-    >
-      <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"
-      />
-      <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"
-      />
-    </svg>`,
+    icon: "i-ph-gear",
   },
   {
     title: "登出",
     name: "logout",
     eventName: handleLogout,
-    icon: `<svg xmlns="http://www.w3.org/2000/svg" class="size-5 opacity-75" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4m7 14l5-5l-5-5m5 5H9"/></svg>`,
+    icon: "i-ph-sign-out",
   },
 ];
 const showMenuOptions = computed(() => {
diff --git a/apps/client/components/Navbar.vue b/apps/client/components/Navbar.vue
index bde6d8b90..f5ea2ef2a 100644
--- a/apps/client/components/Navbar.vue
+++ b/apps/client/components/Navbar.vue
@@ -71,33 +71,14 @@
             class="btn btn-ghost btn-sm mx-1 h-8 w-8 rounded-md p-0"
             @click="toggleDarkMode"
           >
-            <svg
+            <i
               v-if="isDarkMode"
-              xmlns="http://www.w3.org/2000/svg"
-              width="1.5em"
-              height="1.5em"
-              viewBox="0 0 256 256"
-            >
-              <path
-                fill="currentColor"
-                d="M233.54 142.23a8 8 0 0 0-8-2a88.08 88.08 0 0 1-109.8-109.8a8 8 0 0 0-10-10a104.84 104.84 0 0 0-52.91 37A104 104 0 0 0 136 224a103.09 103.09 0 0 0 62.52-20.88a104.84 104.84 0 0 0 37-52.91a8 8 0 0 0-1.98-7.98m-44.64 48.11A88 88 0 0 1 65.66 67.11a89 89 0 0 1 31.4-26A106 106 0 0 0 96 56a104.11 104.11 0 0 0 104 104a106 106 0 0 0 14.92-1.06a89 89 0 0 1-26.02 31.4"
-              />
-            </svg>
-            <svg
+              class="i-ph-moon h-6 w-6"
+            ></i>
+            <i
               v-else
-              xmlns="http://www.w3.org/2000/svg"
-              fill="none"
-              viewBox="0 0 24 24"
-              stroke-width="1.5"
-              stroke="currentColor"
-              class="h-6 w-6"
-            >
-              <path
-                stroke-linecap="round"
-                stroke-linejoin="round"
-                d="M12 3v2.25m6.364.386-1.591 1.591M21 12h-2.25m-.386 6.364-1.591-1.591M12 18.75V21m-4.773-4.227-1.591 1.591M5.25 12H3m4.227-4.773L5.636 5.636M15.75 12a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0Z"
-              />
-            </svg>
+              class="i-ph-sun h-6 w-6"
+            ></i>
           </button>
         </div>
       </div>
diff --git a/apps/client/components/common/backTop.vue b/apps/client/components/common/backTop.vue
index 8a2cec2e9..8c97335ae 100644
--- a/apps/client/components/common/backTop.vue
+++ b/apps/client/components/common/backTop.vue
@@ -4,14 +4,9 @@
     @click="scrollToTop"
     :data-content="route.path === '/' ? 'Back to Top' : 'Go to Home'"
   >
-    <svg
-      class="svgIcon w-3 fill-black transition-all duration-300 dark:fill-white"
-      viewBox="0 0 384 512"
-    >
-      <path
-        d="M214.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 141.2V448c0 17.7 14.3 32 32 32s32-14.3 32-32V141.2L329.4 246.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z"
-      ></path>
-    </svg>
+    <i
+      class="svgIcon i-ph-arrow-up-bold h-5 w-5 fill-black transition-all duration-300 dark:fill-white"
+    ></i>
   </button>
 </template>
 
diff --git a/apps/client/components/home/Banner.vue b/apps/client/components/home/Banner.vue
index 3fa6de9ae..c49a57318 100644
--- a/apps/client/components/home/Banner.vue
+++ b/apps/client/components/home/Banner.vue
@@ -54,44 +54,18 @@
           class="relative inline-flex -translate-x-0 items-center transition group-hover:-translate-x-6"
         >
           <div
-            class="absolute translate-x-0 text-purple-600 opacity-100 transition group-hover:-translate-x-6 group-hover:opacity-0"
+            class="absolute flex translate-x-0 items-center justify-center text-purple-600 opacity-100 transition group-hover:-translate-x-6 group-hover:opacity-0"
           >
-            <svg
-              width="15"
-              height="15"
-              viewBox="0 0 15 15"
-              fill="none"
-              xmlns="http://www.w3.org/2000/svg"
-              class="h-5 w-5"
-            >
-              <path
-                d="M7.22303 0.665992C7.32551 0.419604 7.67454 0.419604 7.77702 0.665992L9.41343 4.60039C9.45663 4.70426 9.55432 4.77523 9.66645 4.78422L13.914 5.12475C14.18 5.14607 14.2878 5.47802 14.0852 5.65162L10.849 8.42374C10.7636 8.49692 10.7263 8.61176 10.7524 8.72118L11.7411 12.866C11.803 13.1256 11.5206 13.3308 11.2929 13.1917L7.6564 10.9705C7.5604 10.9119 7.43965 10.9119 7.34365 10.9705L3.70718 13.1917C3.47945 13.3308 3.19708 13.1256 3.25899 12.866L4.24769 8.72118C4.2738 8.61176 4.23648 8.49692 4.15105 8.42374L0.914889 5.65162C0.712228 5.47802 0.820086 5.14607 1.08608 5.12475L5.3336 4.78422C5.44573 4.77523 5.54342 4.70426 5.58662 4.60039L7.22303 0.665992Z"
-                fill="currentColor"
-              ></path>
-            </svg>
+            <i class="i-ph-star-fill h-5 w-5"></i>
           </div>
           <span
             class="bg-gradient-to-r from-purple-600 to-gray-300 bg-clip-text pl-6 font-medium text-transparent"
             >Star us on GitHub</span
           >
           <div
-            class="absolute right-0 translate-x-12 text-purple-400 opacity-0 transition group-hover:translate-x-6 group-hover:opacity-100"
+            class="absolute right-0 flex translate-x-12 items-center justify-center text-purple-400 opacity-0 transition group-hover:translate-x-6 group-hover:opacity-100"
           >
-            <svg
-              width="15"
-              height="15"
-              viewBox="0 0 15 15"
-              fill="none"
-              xmlns="http://www.w3.org/2000/svg"
-              class="h-5 w-5"
-            >
-              <path
-                d="M8.14645 3.14645C8.34171 2.95118 8.65829 2.95118 8.85355 3.14645L12.8536 7.14645C13.0488 7.34171 13.0488 7.65829 12.8536 7.85355L8.85355 11.8536C8.65829 12.0488 8.34171 12.0488 8.14645 11.8536C7.95118 11.6583 7.95118 11.3417 8.14645 11.1464L11.2929 8H2.5C2.22386 8 2 7.77614 2 7.5C2 7.22386 2.22386 7 2.5 7H11.2929L8.14645 3.85355C7.95118 3.65829 7.95118 3.34171 8.14645 3.14645Z"
-                fill="currentColor"
-                fill-rule="evenodd"
-                clip-rule="evenodd"
-              ></path>
-            </svg>
+            <i class="i-ph-arrow-right h-5 w-5"></i>
           </div>
         </div>
       </a>
diff --git a/apps/client/components/home/Comments.vue b/apps/client/components/home/Comments.vue
index 98dce3a1c..7232c9961 100644
--- a/apps/client/components/home/Comments.vue
+++ b/apps/client/components/home/Comments.vue
@@ -29,11 +29,7 @@
                     {{ "@" + item.account }}
                   </p>
                 </div>
-                <img
-                  width="30"
-                  :src="item.icon"
-                  class="self-start"
-                />
+                <i class="i-simple-icons-twitter h-6 w-6 self-start text-[#03a9f4]"></i>
               </div>
               <p class="mt-4 text-sm text-gray-700 dark:text-gray-300 lg:text-base">
                 {{ item.chinese }}
@@ -46,14 +42,9 @@
               <div class="mx-auto my-4"></div>
               <div class="mt-4 flex items-center justify-between text-xs">
                 <div class="flex items-center">
-                  <svg
-                    class="mr-2 h-5 w-5 fill-current text-pink-300 dark:text-blue-300"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"
-                    />
-                  </svg>
+                  <i
+                    class="i-ph-heart-straight-fill mr-2 h-5 w-5 fill-current text-pink-300 dark:text-blue-300"
+                  ></i>
                   <span class="text-gray-500 dark:text-gray-400">{{ item.likeCount }} likes</span>
                 </div>
                 <a
diff --git a/apps/client/components/home/Contact.vue b/apps/client/components/home/Contact.vue
index 5f7078540..1eb6302ae 100644
--- a/apps/client/components/home/Contact.vue
+++ b/apps/client/components/home/Contact.vue
@@ -31,17 +31,7 @@
                 class="transition hover:opacity-75"
               >
                 <span class="sr-only">Twitter</span>
-
-                <svg
-                  class="h-6 w-6 hover:text-[#03a9f4]"
-                  fill="currentColor"
-                  viewBox="0 0 24 24"
-                  aria-hidden="true"
-                >
-                  <path
-                    d="M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84"
-                  />
-                </svg>
+                <i class="i-simple-icons-twitter h-6 w-6 self-start hover:text-[#03a9f4]"></i>
               </a>
             </li>
             <li>
@@ -52,21 +42,7 @@
                 class="transition hover:opacity-75"
               >
                 <span class="sr-only">Telegram</span>
-
-                <svg
-                  t="1712998273682"
-                  class="h-6 w-6 hover:text-[#03a9f4]"
-                  viewBox="0 0 1024 1024"
-                  fill="currentColor"
-                  version="1.1"
-                  xmlns="http://www.w3.org/2000/svg"
-                  p-id="2350"
-                >
-                  <path
-                    d="M834.24 127.872a95.168 95.168 0 0 0-29.856 7.136h-0.128c-9.12 3.616-52.48 21.856-118.4 49.504l-236.224 99.488c-169.504 71.36-336.128 141.632-336.128 141.632l1.984-0.768s-11.488 3.776-23.488 12a64.96 64.96 0 0 0-18.752 18.144c-5.888 8.64-10.624 21.856-8.864 35.52 2.88 23.104 17.856 36.96 28.608 44.608 10.88 7.744 21.248 11.36 21.248 11.36h0.256l156.256 52.64c7.008 22.496 47.616 156 57.376 186.752 5.76 18.368 11.36 29.856 18.368 38.624 3.392 4.48 7.36 8.224 12.128 11.232a35.808 35.808 0 0 0 7.872 3.392l-1.6-0.384c0.48 0.128 0.864 0.512 1.216 0.64 1.28 0.352 2.144 0.48 3.776 0.736 24.736 7.488 44.608-7.872 44.608-7.872l1.12-0.896 92.256-84 154.624 118.624 3.52 1.504c32.224 14.144 64.864 6.272 82.112-7.616 17.376-13.984 24.128-31.872 24.128-31.872l1.12-2.88 119.488-612.128c3.392-15.104 4.256-29.248 0.512-42.976a57.824 57.824 0 0 0-24.992-33.504 59.904 59.904 0 0 0-34.144-8.64z m-3.232 65.6c-0.128 2.016 0.256 1.792-0.64 5.664v0.352l-118.368 605.76c-0.512 0.864-1.376 2.752-3.744 4.64-2.496 1.984-4.48 3.232-14.88-0.896l-189.12-144.992-114.24 104.128 24-153.28 308.992-288c12.736-11.84 8.48-14.336 8.48-14.336 0.896-14.528-19.232-4.256-19.232-4.256l-389.632 241.376-0.128-0.64-186.752-62.88v-0.128l-0.48-0.096a8.64 8.64 0 0 0 0.96-0.384l1.024-0.512 0.992-0.352s166.752-70.272 336.256-141.632c84.864-35.744 170.368-71.744 236.128-99.52 65.76-27.616 114.368-47.872 117.12-48.96 2.624-1.024 1.376-1.024 3.264-1.024z"
-                    p-id="2351"
-                  ></path>
-                </svg>
+                <i class="i-simple-icons-telegram h-6 w-6 self-start hover:text-[#0e8ed4]"></i>
               </a>
             </li>
             <li>
@@ -77,19 +53,7 @@
                 class="transition hover:opacity-75"
               >
                 <span class="sr-only">GitHub</span>
-
-                <svg
-                  class="h-6 w-6 hover:text-gray-600"
-                  fill="currentColor"
-                  viewBox="0 0 24 24"
-                  aria-hidden="true"
-                >
-                  <path
-                    fill-rule="evenodd"
-                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                    clip-rule="evenodd"
-                  />
-                </svg>
+                <i class="i-simple-icons-github h-6 w-6 hover:text-gray-600"></i>
               </a>
             </li>
           </ul>
diff --git a/apps/client/components/home/PayCard.vue b/apps/client/components/home/PayCard.vue
index 86832611a..9e13b76e9 100644
--- a/apps/client/components/home/PayCard.vue
+++ b/apps/client/components/home/PayCard.vue
@@ -34,12 +34,7 @@
           class="button-unlock"
           v-if="feature.type === '终身付费'"
         >
-          <svg
-            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 36 24"
-          >
-            <path d="m18 0 8 12 10-8-4 20H4L0 4l10 8 8-12z"></path>
-          </svg>
+          <i class="crown i-ph-crown-simple-fill h-6 w-6 text-[#f09f33]"></i>
           解锁 Pro
         </button>
 
@@ -77,19 +72,10 @@
               :key="`feature-${index}-item-${itemIndex}`"
               class="mb-6 mt-6 flex items-center"
             >
-              <svg
-                xmlns="http://www.w3.org/2000/svg"
-                class="mr-2 h-5 w-5"
+              <i
+                class="i-ph-check-bold mr-2 h-5 w-5"
                 :class="item.unique ? 'text-green-500' : 'text-gray-500'"
-                viewBox="0 0 20 20"
-                fill="currentColor"
-              >
-                <path
-                  fill-rule="evenodd"
-                  d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z"
-                  clip-rule="evenodd"
-                />
-              </svg>
+              ></i>
               {{ item.text }}
             </li>
           </ul>
@@ -296,13 +282,11 @@ button:hover::after {
   background-position: right center;
 }
 
-.button-unlock:hover svg {
-  fill: #fff;
+.button-unlock:hover .crown {
+  color: #fff;
 }
 
-.button-unlock svg {
-  width: 23px;
-  fill: #f09f33;
+.button-unlock .crown {
   transition: 0.3s ease;
 }
 </style>
diff --git a/apps/client/components/home/Questions.vue b/apps/client/components/home/Questions.vue
index 48c4f0f71..e1d378023 100644
--- a/apps/client/components/home/Questions.vue
+++ b/apps/client/components/home/Questions.vue
@@ -20,22 +20,7 @@
             <h2 class="text-base font-medium text-black dark:text-gray-300 lg:text-lg">
               {{ qsItem.title }}
             </h2>
-            <span class="icon">
-              <svg
-                xmlns="http://www.w3.org/2000/svg"
-                class="h-6 w-6"
-                fill="none"
-                viewBox="0 0 24 24"
-                stroke="currentColor"
-              >
-                <path
-                  stroke-linecap="round"
-                  stroke-linejoin="round"
-                  stroke-width="2"
-                  d="M9 5l7 7-7 7"
-                />
-              </svg>
-            </span>
+            <i class="icon i-ph-caret-right-bold h-6 w-6"></i>
           </summary>
           <div
             class="transition-max-height mb-4 overflow-hidden duration-500 ease-in-out dark:text-gray-500"
@@ -96,11 +81,11 @@ const QUESTIONS = [
 </script>
 
 <style scoped>
-.icon svg {
+.icon {
   transition: transform 0.5s ease;
 }
 
-details[open] .icon svg {
+details[open] .icon {
   transform: rotate(90deg);
 }
 
diff --git a/apps/client/components/main/Answer.vue b/apps/client/components/main/Answer.vue
index 726e352f9..cdac31ac8 100644
--- a/apps/client/components/main/Answer.vue
+++ b/apps/client/components/main/Answer.vue
@@ -2,17 +2,10 @@
   <div class="text-center">
     <div class="ml-8 text-5xl text-fuchsia-500 dark:text-gray-50">
       {{ courseStore.currentStatement?.english }}
-      <svg
-        class="ml-1 inline-block h-7 w-7 cursor-pointer fill-gray-500 hover:fill-fuchsia-500"
-        viewBox="0 0 1024 1024"
-        version="1.1"
-        xmlns="http://www.w3.org/2000/svg"
+      <i
+        class="i-ph-speaker-simple-high ml-1 inline-block h-7 w-7 cursor-pointer text-gray-500 hover:text-fuchsia-500"
         @click="handlePlaySound"
-      >
-        <path
-          d="M342.4 384H128v256h214.4L576 826.8V197.2L342.4 384zM64 320h256L640 64v896L320 704H64V320z m640 256h256v-64H704v64z m16.8 159.5l181 181 45.3-45.3-181-181-45.3 45.3z m33.9-343.9l181-181-45.3-45.3-181 181 45.3 45.3z"
-        ></path>
-      </svg>
+      ></i>
     </div>
     <div class="my-6 text-xl text-gray-500">
       {{ courseStore.currentStatement?.soundmark }}
diff --git a/apps/client/components/main/AnswerTip.vue b/apps/client/components/main/AnswerTip.vue
index 7cc5e15cf..00494b6a9 100644
--- a/apps/client/components/main/AnswerTip.vue
+++ b/apps/client/components/main/AnswerTip.vue
@@ -6,24 +6,10 @@
       <div class="card-body relative">
         <div class="absolute right-2 top-1 mt-0">
           <button
-            class="h-6 w-6 text-gray-400 outline-none dark:text-gray-300"
+            class="h-5 w-5 text-gray-400 outline-none dark:text-gray-300"
             @click="hiddenAnswerTip"
           >
-            <svg
-              xmlns="http://www.w3.org/2000/svg"
-              width="100%"
-              height="100%"
-              viewBox="0 0 24 24"
-            >
-              <path
-                fill="none"
-                stroke="currentColor"
-                stroke-linecap="round"
-                stroke-linejoin="round"
-                stroke-width="2"
-                d="M12 12L7 7m5 5l5 5m-5-5l5-5m-5 5l-5 5"
-              />
-            </svg>
+            <i class="i-ph-x-bold h-full w-full"></i>
           </button>
         </div>
 
diff --git a/apps/client/components/main/Message/message.vue b/apps/client/components/main/Message/message.vue
index b938469d1..e8657f006 100644
--- a/apps/client/components/main/Message/message.vue
+++ b/apps/client/components/main/Message/message.vue
@@ -40,53 +40,23 @@ onMounted(() => {
 <template>
   <Transition name="down">
     <div
-      class="fixed left-1/2 top-20 flex h-[40px] -translate-x-1/2 items-center rounded-md bg-opacity-90 px-6 py-0 text-center leading-[40px] shadow-md"
+      class="fixed left-1/2 top-20 flex h-[40px] -translate-x-1/2 items-center justify-center rounded-md bg-opacity-90 px-6 py-0 text-center leading-[40px] shadow-md"
       :class="type"
       :style="style[type]"
       v-if="isShow"
     >
-      <svg
+      <i
         v-if="type === Type.SUCCESS"
-        xmlns="http://www.w3.org/2000/svg"
-        class="mr-4 h-4 w-4 shrink-0 stroke-current"
-        fill="none"
-        viewBox="0 0 24 24"
-      >
-        <path
-          stroke-linecap="round"
-          stroke-linejoin="round"
-          stroke-width="2"
-          d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"
-        />
-      </svg>
-      <svg
+        class="i-ph-check-circle-bold mr-4 h-4 w-4 shrink-0 stroke-current"
+      ></i>
+      <i
         v-else-if="type === Type.ERROR"
-        xmlns="http://www.w3.org/2000/svg"
-        class="mr-4 h-4 w-4 shrink-0 stroke-current"
-        fill="none"
-        viewBox="0 0 24 24"
-      >
-        <path
-          stroke-linecap="round"
-          stroke-linejoin="round"
-          stroke-width="2"
-          d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z"
-        />
-      </svg>
-      <svg
+        class="i-ph-x-circle-bold mr-4 h-4 w-4 shrink-0 stroke-current"
+      ></i>
+      <i
         v-else
-        xmlns="http://www.w3.org/2000/svg"
-        class="ml-2 mr-2 h-4 w-4 shrink-0 stroke-current"
-        fill="none"
-        viewBox="0 0 24 24"
-      >
-        <path
-          stroke-linecap="round"
-          stroke-linejoin="round"
-          stroke-width="2"
-          d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
-        />
-      </svg>
+        class="i-ph-warning-circle-bold mr-4 h-4 w-4 shrink-0 stroke-current"
+      ></i>
       <span class="text-sm font-medium">{{ text }}</span>
     </div>
   </Transition>
diff --git a/apps/client/components/main/PrevAndNextBtn.vue b/apps/client/components/main/PrevAndNextBtn.vue
index afc3ee6b5..d9a7d1983 100644
--- a/apps/client/components/main/PrevAndNextBtn.vue
+++ b/apps/client/components/main/PrevAndNextBtn.vue
@@ -8,21 +8,7 @@
         @click="goToPreviousQuestion"
         v-show="courseStore.statementIndex !== 0"
       >
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="3em"
-          height="3em"
-          viewBox="0 0 24 24"
-        >
-          <path
-            fill="none"
-            stroke="currentColor"
-            stroke-linecap="round"
-            stroke-linejoin="round"
-            stroke-width="1"
-            d="m15 5l-6 7l6 7"
-          />
-        </svg>
+        <i class="i-ph-caret-left h-12 w-12"></i>
       </button>
     </div>
     <!-- right arrow button: go to next question -->
@@ -34,21 +20,7 @@
         totalQuestionsCount
         v-show="courseStore.statementIndex + 1 !== courseStore.totalQuestionsCount"
       >
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="3em"
-          height="3em"
-          viewBox="0 0 24 24"
-        >
-          <path
-            fill="none"
-            stroke="currentColor"
-            stroke-linecap="round"
-            stroke-linejoin="round"
-            stroke-width="1"
-            d="m9 5l6 7l-6 7"
-          />
-        </svg>
+        <i class="i-ph-caret-right h-12 w-12"></i>
       </button>
     </div>
   </div>
diff --git a/apps/client/components/main/StudyVideoLink.vue b/apps/client/components/main/StudyVideoLink.vue
index 1601eaef9..c99893f68 100644
--- a/apps/client/components/main/StudyVideoLink.vue
+++ b/apps/client/components/main/StudyVideoLink.vue
@@ -1,21 +1,12 @@
 <template>
   <NuxtLink
     v-if="noteLink"
-    class="tooltip z-50 cursor-pointer fill-current text-xl hover:text-[#d946ef]"
+    class="tooltip z-50 flex cursor-pointer items-center fill-current text-xl hover:text-[#d946ef]"
     :data-tip="NOTE_TIP"
     :href="noteLink"
     target="_blank"
   >
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      width="1em"
-      height="1em"
-      viewBox="0 0 24 24"
-    >
-      <path
-        d="M7.172 2.757L10.414 6h3.171l3.243-3.242a1 1 0 1 1 1.415 1.415L16.414 6H18.5A3.5 3.5 0 0 1 22 9.5v8a3.5 3.5 0 0 1-3.5 3.5h-13A3.5 3.5 0 0 1 2 17.5v-8A3.5 3.5 0 0 1 5.5 6h2.085L5.757 4.171a1 1 0 0 1 1.415-1.415M18.5 8h-13a1.5 1.5 0 0 0-1.493 1.356L4 9.5v8a1.5 1.5 0 0 0 1.356 1.493L5.5 19h13a1.5 1.5 0 0 0 1.493-1.355L20 17.5v-8A1.5 1.5 0 0 0 18.5 8M8 11a1 1 0 0 1 1 1v2a1 1 0 1 1-2 0v-2a1 1 0 0 1 1-1m8 0a1 1 0 0 1 1 1v2a1 1 0 1 1-2 0v-2a1 1 0 0 1 1-1"
-      />
-    </svg>
+    <i class="i-simple-icons-bilibili h-5 w-5"></i>
   </NuxtLink>
 </template>
 
diff --git a/apps/client/components/main/Summary.vue b/apps/client/components/main/Summary.vue
index 4ea1e951e..d60c2d5e6 100644
--- a/apps/client/components/main/Summary.vue
+++ b/apps/client/components/main/Summary.vue
@@ -9,24 +9,10 @@
           <h3 className="font-bold text-lg mb-4">🎉 Congratulations!</h3>
           <button
             tabindex="0"
-            class="btn btn-ghost btn-sm absolute right-0 top-0 mx-1 h-8 w-8 rounded-md p-0"
+            class="btn btn-ghost btn-sm absolute right-0 top-0 mx-1 h-7 w-7 rounded-md p-0"
             @click="soundSentence"
           >
-            <svg
-              t="1708743313057"
-              class="icon"
-              viewBox="0 0 1024 1024"
-              version="1.1"
-              xmlns="http://www.w3.org/2000/svg"
-              p-id="1534"
-              xmlns:xlink="http://www.w3.org/1999/xlink"
-            >
-              <path
-                d="M513.3 105.4L309.9 309H165.7c-37.5 0-67.9 30.4-67.9 67.9v271.4c0 37.5 30.4 67.9 67.9 67.9h144.2l203.5 203.6c37.5 0 67.8-30.4 67.8-67.9V173.3c0-37.5-30.4-67.9-67.9-67.9z m0 744.1l-178-196.4H165.7V381.7h169.6l178-196.5v664.3z m402.2-307.2c6.7 0 12.1-13.3 12.1-29.8 0-16.4-5.4-29.8-12.1-29.8h-84.8c-6.7 0-12.1 13.3-12.1 29.8 0 16.4 5.4 29.8 12.1 29.8h84.8z m9.2-384.6c5.8-3.3 3.8-17.6-4.4-31.8s-19.6-23.1-25.4-19.7l-73.5 42.4c-5.8 3.3-3.8 17.6 4.4 31.8s19.6 23.1 25.4 19.7l73.5-42.4z m0 709.7c5.8 3.4 3.8 17.6-4.4 31.8s-19.6 23.1-25.4 19.7l-73.5-42.4c-5.8-3.4-3.8-17.6 4.4-31.8s19.6-23.1 25.4-19.7l73.5 42.4zM628.9 665c-6.1-16.3-4.4-31.7 11.9-37.8 41.1-19 60.8-55.9 65.8-102.3 5.9-54.1-20-103.8-64.7-124.2-14.6-9.4-20.7-25.7-11.3-40.3 9.4-14.6 25.7-20.7 40.3-11.3 66.2 38.4 105.8 105.2 97.4 182.5-6.7 61.8-44.3 120.2-101.7 145.3-13.3 7.6-31.3 2.6-37.7-11.9z m0 0"
-                p-id="1535"
-                fill="currentColor"
-              />
-            </svg>
+            <i class="i-ph-speaker-simple-high h-full w-full"></i>
           </button>
         </div>
 
diff --git a/apps/client/components/main/Tool.vue b/apps/client/components/main/Tool.vue
index 5961065e7..3985a5eba 100644
--- a/apps/client/components/main/Tool.vue
+++ b/apps/client/components/main/Tool.vue
@@ -91,24 +91,13 @@
 
     <div
       @click="handleDoAgain"
-      class="link-item mr-4"
+      class="link-item mr-4 flex items-center"
     >
-      <svg
-        class="icon-item"
-        xmlns="http://www.w3.org/2000/svg"
-        width="1em"
-        height="1em"
-        viewBox="0 0 32 32"
-      >
-        <path
-          fill="currentColor"
-          d="M18 28A12 12 0 1 0 6 16v6.2l-3.6-3.6L1 20l6 6l6-6l-1.4-1.4L8 22.2V16a10 10 0 1 1 10 10Z"
-        />
-      </svg>
+      <i class="icon-item i-ph-arrow-counter-clockwise"></i>
     </div>
     <div
       @click="rankingStore.showRankModal"
-      class="link-item"
+      class="link-item mr-3"
     >
       排行榜
     </div>
diff --git a/apps/client/package.json b/apps/client/package.json
index fc1ef78a3..09b87b635 100644
--- a/apps/client/package.json
+++ b/apps/client/package.json
@@ -18,6 +18,7 @@
   "devDependencies": {
     "@egoist/tailwindcss-icons": "^1.7.4",
     "@iconify-json/ph": "^1.1.12",
+    "@iconify-json/simple-icons": "^1.1.99",
     "@nuxt/test-utils": "^3.10.0",
     "@nuxtjs/tailwindcss": "^6.10.4",
     "@pinia/testing": "^0.1.3",
diff --git a/apps/client/public/twitter.svg b/apps/client/public/twitter.svg
deleted file mode 100644
index 5b0949803..000000000
--- a/apps/client/public/twitter.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 48 48" width="144px" height="144px"><path fill="#03A9F4" d="M42,12.429c-1.323,0.586-2.746,0.977-4.247,1.162c1.526-0.906,2.7-2.351,3.251-4.058c-1.428,0.837-3.01,1.452-4.693,1.776C34.967,9.884,33.05,9,30.926,9c-4.08,0-7.387,3.278-7.387,7.32c0,0.572,0.067,1.129,0.193,1.67c-6.138-0.308-11.582-3.226-15.224-7.654c-0.64,1.082-1,2.349-1,3.686c0,2.541,1.301,4.778,3.285,6.096c-1.211-0.037-2.351-0.374-3.349-0.914c0,0.022,0,0.055,0,0.086c0,3.551,2.547,6.508,5.923,7.181c-0.617,0.169-1.269,0.263-1.941,0.263c-0.477,0-0.942-0.054-1.392-0.135c0.94,2.902,3.667,5.023,6.898,5.086c-2.528,1.96-5.712,3.134-9.174,3.134c-0.598,0-1.183-0.034-1.761-0.104C9.268,36.786,13.152,38,17.321,38c13.585,0,21.017-11.156,21.017-20.834c0-0.317-0.01-0.633-0.025-0.945C39.763,15.197,41.013,13.905,42,12.429"/></svg>
\ No newline at end of file
diff --git a/apps/client/tailwind.config.js b/apps/client/tailwind.config.js
index 146eb6f6c..9694546df 100644
--- a/apps/client/tailwind.config.js
+++ b/apps/client/tailwind.config.js
@@ -49,7 +49,7 @@ export default {
     iconsPlugin({
       // 配置需要的 icon 包就行（需要安装）
       // 来这里找 https://icones.js.org/
-      collections: getIconCollections(["ph"]),
+      collections: getIconCollections(["ph", "simple-icons"]),
     }),
   ],
 };
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e451f9ac0..5e9903632 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -218,6 +218,9 @@ importers:
       '@iconify-json/ph':
         specifier: ^1.1.12
         version: 1.1.12
+      '@iconify-json/simple-icons':
+        specifier: ^1.1.99
+        version: 1.1.99
       '@nuxt/test-utils':
         specifier: ^3.10.0
         version: 3.11.0(@vue/test-utils@2.4.4)(h3@1.10.1)(happy-dom@13.3.8)(vite@5.1.0)(vitest@1.2.2)(vue-router@4.2.5)(vue@3.4.15)
@@ -1914,6 +1917,12 @@ packages:
       '@iconify/types': 2.0.0
     dev: true
 
+  /@iconify-json/simple-icons@1.1.99:
+    resolution: {integrity: sha512-/csVihX/ztkl2j4Vk4JoEJv8DdQHrZafzC5QHe21Y+ztuVglvavjb4yWEn9KQHTitLH2fIMnP8+RSTxu5kdmtw==}
+    dependencies:
+      '@iconify/types': 2.0.0
+    dev: true
+
   /@iconify/types@2.0.0:
     resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==}
     dev: true