From 40e8dd54dea1f40199aefa93e4a4d8586c7f548d Mon Sep 17 00:00:00 2001
From: olgakup <16910687+olgakup@users.noreply.github.com>
Date: Tue, 4 Feb 2025 11:29:17 -0800
Subject: [PATCH 1/4] fix: focus state and safari button spacing

---
 .../components/network-activity-action.vue    | 27 ++++++++++++++++---
 1 file changed, 23 insertions(+), 4 deletions(-)

diff --git a/packages/extension/src/ui/action/views/network-activity/components/network-activity-action.vue b/packages/extension/src/ui/action/views/network-activity/components/network-activity-action.vue
index 20b93cc0a..000e950bd 100644
--- a/packages/extension/src/ui/action/views/network-activity/components/network-activity-action.vue
+++ b/packages/extension/src/ui/action/views/network-activity/components/network-activity-action.vue
@@ -1,12 +1,18 @@
 <template>
   <div class="network-activity__action">
     <div class="network-activity__action-wrap">
-      <a class="network-activity__action-item" @click="$emit('toggle:deposit')">
+      <button
+        class="network-activity__action-item"
+        @click="$emit('toggle:deposit')"
+      >
         <Deposit />Deposit
-      </a>
-      <a class="network-activity__action-item" @click="$emit('open:buyAction')">
+      </button>
+      <button
+        class="network-activity__action-item"
+        @click="$emit('open:buyAction')"
+      >
         <Buy />Buy/Sell
-      </a>
+      </button>
       <router-link
         :to="{
           name: 'send-transaction',
@@ -62,6 +68,13 @@ defineEmits<{
       align-items: center;
       flex-direction: row;
       gap: 8px;
+      button {
+        color: inherit;
+        font: inherit;
+        cursor: pointer;
+        outline: inherit;
+        border: inherit;
+      }
     }
     &-item {
       background: @primary007;
@@ -81,7 +94,9 @@ defineEmits<{
       justify-content: center;
       align-items: center;
       flex-direction: column;
+      flex: 1;
       min-width: 100px;
+      max-width: 100%;
       transition: background 300ms ease-in-out;
       border-radius: 12px;
 
@@ -93,6 +108,10 @@ defineEmits<{
         margin-bottom: 0;
         margin-bottom: 2px;
       }
+      &:focus {
+        outline: -webkit-focus-ring-color auto 1px !important;
+        outline-offset: 2px !important;
+      }
     }
     &-divider {
       height: 48px;

From 928a7ed01373c9e708e6b9476f236960bbcb3a4c Mon Sep 17 00:00:00 2001
From: olgakup <16910687+olgakup@users.noreply.github.com>
Date: Tue, 4 Feb 2025 12:19:14 -0800
Subject: [PATCH 2/4] devop: implement corrent icons in the tab menu

---
 .../action/components/network-menu/index.vue  | 23 +++++--
 .../src/ui/action/icons/tabs/activity.vue     | 58 ++++++++++++-----
 .../src/ui/action/icons/tabs/assets.vue       | 60 ++++++++++++-----
 .../src/ui/action/icons/tabs/dapps.vue        | 59 ++++++++++++-----
 .../src/ui/action/icons/tabs/nfts.vue         | 65 ++++++++++++++-----
 5 files changed, 197 insertions(+), 68 deletions(-)

diff --git a/packages/extension/src/ui/action/components/network-menu/index.vue b/packages/extension/src/ui/action/components/network-menu/index.vue
index 3002a6d13..60612be8f 100644
--- a/packages/extension/src/ui/action/components/network-menu/index.vue
+++ b/packages/extension/src/ui/action/components/network-menu/index.vue
@@ -3,22 +3,25 @@
     <router-link
       v-if="network"
       :to="{ name: 'assets', params: { id: !!selected ? selected : null } }"
+      exact-active-class="router-link-active"
     >
-      <Assets /><br />Assets
+      <Assets :is-active="route.name === 'assets'" /><br />Assets
     </router-link>
     <router-link
       :to="{
         name: 'activity',
         params: { id: !!selected ? selected : null },
       }"
+      exact-active-class="router-link-active"
     >
-      <Activity /><br />Activity
+      <Activity :is-active="route.name === 'activity'" /><br />Activity
     </router-link>
     <router-link
       v-if="(network as EvmNetwork).NFTHandler"
       :to="{ name: 'nfts', params: { id: !!selected ? selected : null } }"
+      exact-active-class="router-link-active"
     >
-      <NFTs /><br />NFTs
+      <NFTs :is-active="route.name === 'nfts'" /><br />NFTs
     </router-link>
     <router-link
       v-if="DappList[network.name]"
@@ -26,8 +29,9 @@
         name: 'dapps',
         params: { id: !!selected ? selected : null },
       }"
+      exact-active-class="router-link-active"
     >
-      <DApps /><br />DApps
+      <DApps :is-active="route.name === 'dapps'" /><br />DApps
     </router-link>
   </div>
 </template>
@@ -41,6 +45,7 @@ import { PropType } from 'vue';
 import DappList from '@/libs/dapp-list';
 import { BaseNetwork } from '@/types/base-network';
 import { EvmNetwork } from '@/providers/ethereum/types/evm-network';
+import { useRoute } from 'vue-router';
 
 defineProps({
   selected: {
@@ -52,6 +57,8 @@ defineProps({
     default: () => ({}),
   },
 });
+
+const route = useRoute();
 </script>
 
 <style lang="less">
@@ -85,7 +92,7 @@ defineProps({
     text-align: center;
     letter-spacing: 0.5px;
     color: @primaryLabel;
-    opacity: 0.6;
+    opacity: 1;
     transition: opacity 300ms ease-in-out;
 
     svg {
@@ -93,12 +100,14 @@ defineProps({
     }
 
     &:hover {
-      opacity: 0.9;
+      opacity: 0.6 !important;
     }
   }
 
   .router-link-active {
-    opacity: 1 !important;
+    &:hover {
+      opacity: 1 !important;
+    }
   }
 }
 </style>
diff --git a/packages/extension/src/ui/action/icons/tabs/activity.vue b/packages/extension/src/ui/action/icons/tabs/activity.vue
index 5e1cdaf23..54e4cd628 100644
--- a/packages/extension/src/ui/action/icons/tabs/activity.vue
+++ b/packages/extension/src/ui/action/icons/tabs/activity.vue
@@ -1,22 +1,50 @@
 <template>
-  <svg
-    width="28"
-    height="28"
-    viewBox="0 0 28 28"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <path
-      fill-rule="evenodd"
-      clip-rule="evenodd"
-      d="M9.28 5H18.72C19.6771 5 20.2746 5.00156 20.7246 5.03832C21.1512 5.07317 21.2662 5.12945 21.2902 5.14169C21.5348 5.26633 21.7337 5.4652 21.8583 5.70981C21.8705 5.73383 21.9268 5.84883 21.9617 6.27543C21.9984 6.72538 22 7.32291 22 8.28V19.72C22 20.6771 21.9984 21.2746 21.9617 21.7246C21.9268 22.1512 21.8705 22.2662 21.8583 22.2902C21.7337 22.5348 21.5348 22.7337 21.2902 22.8583C21.2662 22.8705 21.1512 22.9268 20.7246 22.9617C20.2746 22.9984 19.6771 23 18.72 23H9.28C8.32291 23 7.72538 22.9984 7.27543 22.9617C6.84883 22.9268 6.73383 22.8705 6.70981 22.8583C6.4652 22.7337 6.26633 22.5348 6.14169 22.2902C6.12945 22.2662 6.07317 22.1512 6.03832 21.7246C6.00156 21.2746 6 20.6771 6 19.72V8.28C6 7.32291 6.00156 6.72538 6.03832 6.27543C6.07317 5.84883 6.12945 5.73383 6.14169 5.70981C6.26633 5.4652 6.4652 5.26633 6.70981 5.14169C6.73383 5.12945 6.84883 5.07317 7.27543 5.03832C7.72538 5.00156 8.32291 5 9.28 5ZM4 8.28C4 6.43183 4 5.50774 4.35968 4.80183C4.67606 4.1809 5.1809 3.67606 5.80183 3.35968C6.50774 3 7.43183 3 9.28 3H18.72C20.5682 3 21.4923 3 22.1982 3.35968C22.8191 3.67606 23.3239 4.1809 23.6403 4.80183C24 5.50774 24 6.43183 24 8.28V19.72C24 21.5682 24 22.4923 23.6403 23.1982C23.3239 23.8191 22.8191 24.3239 22.1982 24.6403C21.4923 25 20.5682 25 18.72 25H9.28C7.43183 25 6.50774 25 5.80183 24.6403C5.1809 24.3239 4.67606 23.8191 4.35968 23.1982C4 22.4923 4 21.5682 4 19.72V8.28ZM9 7C8.44772 7 8 7.44772 8 8C8 8.55228 8.44772 9 9 9C9.55228 9 10 8.55228 10 8C10 7.44772 9.55228 7 9 7ZM12 8C12 7.44772 12.4477 7 13 7H19C19.5523 7 20 7.44772 20 8C20 8.55228 19.5523 9 19 9H13C12.4477 9 12 8.55228 12 8ZM12 12C12 11.4477 12.4477 11 13 11H19C19.5523 11 20 11.4477 20 12C20 12.5523 19.5523 13 19 13H13C12.4477 13 12 12.5523 12 12ZM13 15C12.4477 15 12 15.4477 12 16C12 16.5523 12.4477 17 13 17H19C19.5523 17 20 16.5523 20 16C20 15.4477 19.5523 15 19 15H13ZM12 20C12 19.4477 12.4477 19 13 19H19C19.5523 19 20 19.4477 20 20C20 20.5523 19.5523 21 19 21H13C12.4477 21 12 20.5523 12 20ZM8 12C8 11.4477 8.44772 11 9 11C9.55228 11 10 11.4477 10 12C10 12.5523 9.55228 13 9 13C8.44772 13 8 12.5523 8 12ZM9 15C8.44772 15 8 15.4477 8 16C8 16.5523 8.44772 17 9 17C9.55228 17 10 16.5523 10 16C10 15.4477 9.55228 15 9 15ZM8 20C8 19.4477 8.44772 19 9 19C9.55228 19 10 19.4477 10 20C10 20.5523 9.55228 21 9 21C8.44772 21 8 20.5523 8 20Z"
-      fill="#202124"
-    />
-  </svg>
+  <div>
+    <svg
+      v-if="isActive"
+      width="28"
+      height="28"
+      viewBox="0 0 28 28"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M5.46447 4.46447C4 5.92893 4 8.28635 4 13.0012V14.9988C4 19.7136 4 22.0711 5.46447 23.5355C6.92893 25 9.28595 25 14 25C18.714 25 21.0711 25 22.5355 23.5355C24 22.0711 24 19.7136 24 14.9988V13.0012C24 8.28635 24 5.92893 22.5355 4.46447C21.0711 3 18.714 3 14 3C9.28595 3 6.92893 3 5.46447 4.46447ZM8.5 9C8.5 8.44772 8.94772 8 9.5 8C10.0523 8 10.5 8.44772 10.5 9C10.5 9.55228 10.0523 10 9.5 10C8.94772 10 8.5 9.55228 8.5 9ZM11.5 9C11.5 8.44772 11.9477 8 12.5 8H18.5C19.0523 8 19.5 8.44772 19.5 9C19.5 9.55228 19.0523 10 18.5 10H12.5C11.9477 10 11.5 9.55228 11.5 9ZM12.5 13C11.9477 13 11.5 13.4477 11.5 14C11.5 14.5523 11.9477 15 12.5 15H18.5C19.0523 15 19.5 14.5523 19.5 14C19.5 13.4477 19.0523 13 18.5 13H12.5ZM12.5 18C11.9477 18 11.5 18.4477 11.5 19C11.5 19.5523 11.9477 20 12.5 20H18.5C19.0523 20 19.5 19.5523 19.5 19C19.5 18.4477 19.0523 18 18.5 18H12.5ZM8.5 14C8.5 13.4477 8.94772 13 9.5 13C10.0523 13 10.5 13.4477 10.5 14C10.5 14.5523 10.0523 15 9.5 15C8.94772 15 8.5 14.5523 8.5 14ZM8.5 19C8.5 18.4477 8.94772 18 9.5 18C10.0523 18 10.5 18.4477 10.5 19C10.5 19.5523 10.0523 20 9.5 20C8.94772 20 8.5 19.5523 8.5 19Z"
+        fill="black"
+        fill-opacity="0.9"
+      />
+    </svg>
+    <svg
+      v-else
+      width="28"
+      height="28"
+      viewBox="0 0 28 28"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M6.79763 22.1213C6.49898 21.8227 6.23743 21.3597 6.08417 20.2196C5.92319 19.0221 5.91895 17.4128 5.91895 14.9988V14.9948V14.9908V14.9867V14.9827V14.9787V14.9747V14.9706V14.9666V14.9626V14.9586V14.9546V14.9506V14.9466V14.9425V14.9385V14.9345V14.9305V14.9265V14.9225V14.9185V14.9145V14.9105V14.9065V14.9025V14.8985V14.8945V14.8905V14.8866V14.8826V14.8786V14.8746V14.8706V14.8666V14.8626V14.8587V14.8547V14.8507V14.8467V14.8427V14.8388V14.8348V14.8308V14.8269V14.8229V14.8189V14.8149V14.811V14.807V14.8031V14.7991V14.7951V14.7912V14.7872V14.7833V14.7793V14.7753V14.7714V14.7674V14.7635V14.7595V14.7556V14.7516V14.7477V14.7437V14.7398V14.7359V14.7319V14.728V14.724V14.7201V14.7162V14.7122V14.7083V14.7043V14.7004V14.6965V14.6925V14.6886V14.6847V14.6808V14.6768V14.6729V14.669V14.665V14.6611V14.6572V14.6533V14.6494V14.6454V14.6415V14.6376V14.6337V14.6298V14.6259V14.6219V14.618V14.6141V14.6102V14.6063V14.6024V14.5985V14.5946V14.5907V14.5868V14.5829V14.5789V14.575V14.5711V14.5672V14.5633V14.5594V14.5555V14.5516V14.5477V14.5439V14.54V14.5361V14.5322V14.5283V14.5244V14.5205V14.5166V14.5127V14.5088V14.5049V14.501V14.4972V14.4933V14.4894V14.4855V14.4816V14.4777V14.4739V14.47V14.4661V14.4622V14.4583V14.4545V14.4506V14.4467V14.4428V14.4389V14.4351V14.4312V14.4273V14.4234V14.4196V14.4157V14.4118V14.408V14.4041V14.4002V14.3964V14.3925V14.3886V14.3847V14.3809V14.377V14.3731V14.3693V14.3654V14.3616V14.3577V14.3538V14.35V14.3461V14.3422V14.3384V14.3345V14.3307V14.3268V14.3229V14.3191V14.3152V14.3114V14.3075V14.3037V14.2998V14.2959V14.2921V14.2882V14.2844V14.2805V14.2767V14.2728V14.269V14.2651V14.2613V14.2574V14.2536V14.2497V14.2459V14.242V14.2382V14.2343V14.2305V14.2266V14.2228V14.2189V14.2151V14.2112V14.2074V14.2035V14.1997V14.1959V14.192V14.1882V14.1843V14.1805V14.1766V14.1728V14.1689V14.1651V14.1613V14.1574V14.1536V14.1497V14.1459V14.142V14.1382V14.1344V14.1305V14.1267V14.1228V14.119V14.1152V14.1113V14.1075V14.1036V14.0998V14.096V14.0921V14.0883V14.0844V14.0806V14.0768V14.0729V14.0691V14.0652V14.0614V14.0576V14.0537V14.0499V14.0461V14.0422V14.0384V14.0345V14.0307V14.0269V14.023V14.0192V14.0154V14.0115V14.0077V14.0038V14V13.9962V13.9923V13.9885V13.9846V13.9808V13.977V13.9731V13.9693V13.9655V13.9616V13.9578V13.9539V13.9501V13.9463V13.9424V13.9386V13.9348V13.9309V13.9271V13.9232V13.9194V13.9156V13.9117V13.9079V13.904V13.9002V13.8964V13.8925V13.8887V13.8848V13.881V13.8772V13.8733V13.8695V13.8656V13.8618V13.858V13.8541V13.8503V13.8464V13.8426V13.8387V13.8349V13.8311V13.8272V13.8234V13.8195V13.8157V13.8118V13.808V13.8041V13.8003V13.7965V13.7926V13.7888V13.7849V13.7811V13.7772V13.7734V13.7695V13.7657V13.7618V13.758V13.7541V13.7503V13.7464V13.7426V13.7387V13.7349V13.731V13.7272V13.7233V13.7195V13.7156V13.7118V13.7079V13.704V13.7002V13.6963V13.6925V13.6886V13.6848V13.6809V13.6771V13.6732V13.6693V13.6655V13.6616V13.6578V13.6539V13.65V13.6462V13.6423V13.6384V13.6346V13.6307V13.6268V13.623V13.6191V13.6153V13.6114V13.6075V13.6036V13.5998V13.5959V13.592V13.5882V13.5843V13.5804V13.5766V13.5727V13.5688V13.5649V13.5611V13.5572V13.5533V13.5494V13.5455V13.5417V13.5378V13.5339V13.53V13.5261V13.5223V13.5184V13.5145V13.5106V13.5067V13.5028V13.499V13.4951V13.4912V13.4873V13.4834V13.4795V13.4756V13.4717V13.4678V13.4639V13.46V13.4561V13.4522V13.4484V13.4445V13.4406V13.4367V13.4328V13.4289V13.425V13.421V13.4171V13.4132V13.4093V13.4054V13.4015V13.3976V13.3937V13.3898V13.3859V13.382V13.3781V13.3741V13.3702V13.3663V13.3624V13.3585V13.3546V13.3506V13.3467V13.3428V13.3389V13.3349V13.331V13.3271V13.3232V13.3192V13.3153V13.3114V13.3075V13.3035V13.2996V13.2957V13.2917V13.2878V13.2838V13.2799V13.276V13.272V13.2681V13.2641V13.2602V13.2563V13.2523V13.2484V13.2444V13.2405V13.2365V13.2326V13.2286V13.2247V13.2207V13.2167V13.2128V13.2088V13.2049V13.2009V13.1969V13.193V13.189V13.185V13.1811V13.1771V13.1731V13.1692V13.1652V13.1612V13.1573V13.1533V13.1493V13.1453V13.1413V13.1374V13.1334V13.1294V13.1254V13.1214V13.1174V13.1134V13.1095V13.1055V13.1015V13.0975V13.0935V13.0895V13.0855V13.0815V13.0775V13.0735V13.0695V13.0655V13.0615V13.0575V13.0534V13.0494V13.0454V13.0414V13.0374V13.0334V13.0294V13.0253V13.0213V13.0173V13.0133V13.0092V13.0052V13.0012C5.91895 10.5872 5.92319 8.97794 6.08417 7.7804C6.23743 6.64033 6.49898 6.17732 6.79763 5.87868C7.09632 5.57998 7.55929 5.31846 8.69908 5.16522C9.89641 5.00425 11.5054 5 13.9189 5C16.3325 5 17.9415 5.00425 19.1388 5.16522C20.2786 5.31846 20.7416 5.57998 21.0403 5.87868C21.3389 6.17732 21.6005 6.64033 21.7537 7.7804C21.9147 8.97794 21.9189 10.5872 21.9189 13.0012V13.0052V13.0092V13.0133V13.0173V13.0213V13.0253V13.0294V13.0334V13.0374V13.0414V13.0454V13.0494V13.0534V13.0575V13.0615V13.0655V13.0695V13.0735V13.0775V13.0815V13.0855V13.0895V13.0935V13.0975V13.1015V13.1055V13.1095V13.1134V13.1174V13.1214V13.1254V13.1294V13.1334V13.1374V13.1413V13.1453V13.1493V13.1533V13.1573V13.1612V13.1652V13.1692V13.1731V13.1771V13.1811V13.1851V13.189V13.193V13.1969V13.2009V13.2049V13.2088V13.2128V13.2167V13.2207V13.2247V13.2286V13.2326V13.2365V13.2405V13.2444V13.2484V13.2523V13.2563V13.2602V13.2641V13.2681V13.272V13.276V13.2799V13.2838V13.2878V13.2917V13.2957V13.2996V13.3035V13.3075V13.3114V13.3153V13.3192V13.3232V13.3271V13.331V13.335V13.3389V13.3428V13.3467V13.3506V13.3546V13.3585V13.3624V13.3663V13.3702V13.3741V13.3781V13.382V13.3859V13.3898V13.3937V13.3976V13.4015V13.4054V13.4093V13.4132V13.4171V13.4211V13.425V13.4289V13.4328V13.4367V13.4406V13.4445V13.4484V13.4523V13.4561V13.46V13.4639V13.4678V13.4717V13.4756V13.4795V13.4834V13.4873V13.4912V13.4951V13.499V13.5028V13.5067V13.5106V13.5145V13.5184V13.5223V13.5261V13.53V13.5339V13.5378V13.5417V13.5455V13.5494V13.5533V13.5572V13.5611V13.5649V13.5688V13.5727V13.5766V13.5804V13.5843V13.5882V13.592V13.5959V13.5998V13.6036V13.6075V13.6114V13.6153V13.6191V13.623V13.6269V13.6307V13.6346V13.6384V13.6423V13.6462V13.65V13.6539V13.6578V13.6616V13.6655V13.6693V13.6732V13.6771V13.6809V13.6848V13.6886V13.6925V13.6963V13.7002V13.7041V13.7079V13.7118V13.7156V13.7195V13.7233V13.7272V13.731V13.7349V13.7387V13.7426V13.7464V13.7503V13.7541V13.758V13.7618V13.7657V13.7695V13.7734V13.7772V13.7811V13.7849V13.7888V13.7926V13.7965V13.8003V13.8041V13.808V13.8118V13.8157V13.8195V13.8234V13.8272V13.8311V13.8349V13.8387V13.8426V13.8464V13.8503V13.8541V13.858V13.8618V13.8656V13.8695V13.8733V13.8772V13.881V13.8848V13.8887V13.8925V13.8964V13.9002V13.904V13.9079V13.9117V13.9156V13.9194V13.9232V13.9271V13.9309V13.9348V13.9386V13.9424V13.9463V13.9501V13.9539V13.9578V13.9616V13.9655V13.9693V13.9731V13.977V13.9808V13.9846V13.9885V13.9923V13.9962V14V14.0038V14.0077V14.0115V14.0154V14.0192V14.023V14.0269V14.0307V14.0345V14.0384V14.0422V14.0461V14.0499V14.0537V14.0576V14.0614V14.0652V14.0691V14.0729V14.0768V14.0806V14.0844V14.0883V14.0921V14.096V14.0998V14.1036V14.1075V14.1113V14.1152V14.119V14.1228V14.1267V14.1305V14.1344V14.1382V14.142V14.1459V14.1497V14.1536V14.1574V14.1613V14.1651V14.1689V14.1728V14.1766V14.1805V14.1843V14.1882V14.192V14.1959V14.1997V14.2035V14.2074V14.2112V14.2151V14.2189V14.2228V14.2266V14.2305V14.2343V14.2382V14.242V14.2459V14.2497V14.2536V14.2574V14.2613V14.2651V14.269V14.2728V14.2767V14.2805V14.2844V14.2882V14.2921V14.296V14.2998V14.3037V14.3075V14.3114V14.3152V14.3191V14.3229V14.3268V14.3307V14.3345V14.3384V14.3422V14.3461V14.35V14.3538V14.3577V14.3616V14.3654V14.3693V14.3732V14.377V14.3809V14.3847V14.3886V14.3925V14.3964V14.4002V14.4041V14.408V14.4118V14.4157V14.4196V14.4234V14.4273V14.4312V14.4351V14.4389V14.4428V14.4467V14.4506V14.4545V14.4583V14.4622V14.4661V14.47V14.4739V14.4777V14.4816V14.4855V14.4894V14.4933V14.4972V14.501V14.5049V14.5088V14.5127V14.5166V14.5205V14.5244V14.5283V14.5322V14.5361V14.54V14.5439V14.5478V14.5516V14.5555V14.5594V14.5633V14.5672V14.5711V14.575V14.579V14.5829V14.5868V14.5907V14.5946V14.5985V14.6024V14.6063V14.6102V14.6141V14.618V14.6219V14.6259V14.6298V14.6337V14.6376V14.6415V14.6454V14.6494V14.6533V14.6572V14.6611V14.6651V14.669V14.6729V14.6768V14.6808V14.6847V14.6886V14.6925V14.6965V14.7004V14.7043V14.7083V14.7122V14.7162V14.7201V14.724V14.728V14.7319V14.7359V14.7398V14.7437V14.7477V14.7516V14.7556V14.7595V14.7635V14.7674V14.7714V14.7753V14.7793V14.7833V14.7872V14.7912V14.7951V14.7991V14.8031V14.807V14.811V14.815V14.8189V14.8229V14.8269V14.8308V14.8348V14.8388V14.8427V14.8467V14.8507V14.8547V14.8587V14.8626V14.8666V14.8706V14.8746V14.8786V14.8826V14.8866V14.8905V14.8945V14.8985V14.9025V14.9065V14.9105V14.9145V14.9185V14.9225V14.9265V14.9305V14.9345V14.9385V14.9425V14.9466V14.9506V14.9546V14.9586V14.9626V14.9666V14.9706V14.9747V14.9787V14.9827V14.9867V14.9908V14.9948V14.9988C21.9189 17.4128 21.9147 19.0221 21.7537 20.2196C21.6005 21.3597 21.3389 21.8227 21.0403 22.1213C20.7416 22.42 20.2786 22.6815 19.1388 22.8348C17.9415 22.9958 16.3325 23 13.9189 23C11.5054 23 9.89641 22.9958 8.69908 22.8348C7.55929 22.6815 7.09632 22.42 6.79763 22.1213ZM3.91895 13.0012C3.91895 8.28635 3.91895 5.92893 5.38341 4.46447C6.84788 3 9.2049 3 13.9189 3C18.633 3 20.99 3 22.4545 4.46447C23.9189 5.92893 23.9189 8.28635 23.9189 13.0012V14.9988C23.9189 19.7136 23.9189 22.0711 22.4545 23.5355C20.99 25 18.633 25 13.9189 25C9.2049 25 6.84788 25 5.38341 23.5355C3.91895 22.0711 3.91895 19.7136 3.91895 14.9988V13.0012ZM8.41895 9C8.41895 8.44772 8.86666 8 9.41895 8C9.97123 8 10.4189 8.44772 10.4189 9C10.4189 9.55228 9.97123 10 9.41895 10C8.86666 10 8.41895 9.55228 8.41895 9ZM11.4189 9C11.4189 8.44772 11.8667 8 12.4189 8H18.4189C18.9712 8 19.4189 8.44772 19.4189 9C19.4189 9.55228 18.9712 10 18.4189 10H12.4189C11.8667 10 11.4189 9.55228 11.4189 9ZM12.4189 13C11.8667 13 11.4189 13.4477 11.4189 14C11.4189 14.5523 11.8667 15 12.4189 15H18.4189C18.9712 15 19.4189 14.5523 19.4189 14C19.4189 13.4477 18.9712 13 18.4189 13H12.4189ZM12.4189 18C11.8667 18 11.4189 18.4477 11.4189 19C11.4189 19.5523 11.8667 20 12.4189 20H18.4189C18.9712 20 19.4189 19.5523 19.4189 19C19.4189 18.4477 18.9712 18 18.4189 18H12.4189ZM8.41895 14C8.41895 13.4477 8.86666 13 9.41895 13C9.97123 13 10.4189 13.4477 10.4189 14C10.4189 14.5523 9.97123 15 9.41895 15C8.86666 15 8.41895 14.5523 8.41895 14ZM8.41895 19C8.41895 18.4477 8.86666 18 9.41895 18C9.97123 18 10.4189 18.4477 10.4189 19C10.4189 19.5523 9.97123 20 9.41895 20C8.86666 20 8.41895 19.5523 8.41895 19Z"
+        fill="black"
+        fill-opacity="0.6"
+      />
+    </svg>
+  </div>
 </template>
 
+<script setup lang="ts">
+defineProps({
+  isActive: {
+    type: Boolean,
+    default: false,
+  },
+});
+</script>
 <style scoped>
-svg {
+div {
   display: inline-block;
   vertical-align: baseline;
 }
diff --git a/packages/extension/src/ui/action/icons/tabs/assets.vue b/packages/extension/src/ui/action/icons/tabs/assets.vue
index 7a922ba8e..4fd369aec 100644
--- a/packages/extension/src/ui/action/icons/tabs/assets.vue
+++ b/packages/extension/src/ui/action/icons/tabs/assets.vue
@@ -1,23 +1,51 @@
 <template>
-  <svg
-    width="28"
-    height="28"
-    viewBox="0 0 28 28"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <path
-      fill-rule="evenodd"
-      clip-rule="evenodd"
-      d="M18.5715 21.9796C20.6832 19.9752 22 17.1414 22 14C22 10.8586 20.6832 8.02483 18.5715 6.02044C19.4264 6.08167 20.2672 6.28 21.0614 6.60896C22.032 7.011 22.9139 7.60028 23.6568 8.34315C24.3997 9.08602 24.9889 9.96793 25.391 10.9385C25.793 11.9091 25.9999 12.9494 25.9999 14C25.9999 15.0506 25.793 16.0909 25.391 17.0615C24.9889 18.0321 24.3997 18.914 23.6568 19.6569C22.9139 20.3997 22.032 20.989 21.0614 21.391C20.2672 21.72 19.4264 21.9183 18.5715 21.9796ZM16.0036 23.7987C14.5026 24.5667 12.8019 25 11 25C4.92487 25 0 20.0751 0 14C0 7.92487 4.92487 3 11 3C12.8019 3 14.5026 3.43326 16.0036 4.20129C16.6591 4.06776 17.3278 4 17.9999 4C19.3132 4 20.6135 4.25866 21.8268 4.76121C23.04 5.26375 24.1424 6.00035 25.071 6.92893C25.9996 7.85752 26.7362 8.95991 27.2387 10.1732C27.7413 11.3864 27.9999 12.6868 27.9999 14C27.9999 15.3132 27.7413 16.6136 27.2387 17.8268C26.7362 19.0401 25.9996 20.1425 25.071 21.0711C24.1424 21.9997 23.04 22.7362 21.8268 23.2388C20.6135 23.7413 19.3132 24 17.9999 24C17.3278 24 16.6591 23.9322 16.0036 23.7987Z"
-      fill="black"
-      fill-opacity="0.9"
-    />
-  </svg>
+  <div>
+    <svg
+      v-if="isActive"
+      width="28"
+      height="28"
+      viewBox="0 0 28 28"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M18.5715 21.9796C20.6832 19.9752 22 17.1414 22 14C22 10.8586 20.6832 8.02483 18.5715 6.02044C19.4264 6.08167 20.2672 6.28 21.0614 6.60896C22.032 7.011 22.9139 7.60028 23.6568 8.34315C24.3997 9.08602 24.9889 9.96793 25.391 10.9385C25.793 11.9091 25.9999 12.9494 25.9999 14C25.9999 15.0506 25.793 16.0909 25.391 17.0615C24.9889 18.0321 24.3997 18.914 23.6568 19.6569C22.9139 20.3997 22.032 20.989 21.0614 21.391C20.2672 21.72 19.4264 21.9183 18.5715 21.9796ZM16.0036 23.7987C14.5026 24.5667 12.8019 25 11 25C4.92487 25 0 20.0751 0 14C0 7.92487 4.92487 3 11 3C12.8019 3 14.5026 3.43326 16.0036 4.20129C16.6591 4.06776 17.3278 4 17.9999 4C19.3132 4 20.6135 4.25866 21.8268 4.76121C23.04 5.26375 24.1424 6.00035 25.071 6.92893C25.9996 7.85752 26.7362 8.95991 27.2387 10.1732C27.7413 11.3864 27.9999 12.6868 27.9999 14C27.9999 15.3132 27.7413 16.6136 27.2387 17.8268C26.7362 19.0401 25.9996 20.1425 25.071 21.0711C24.1424 21.9997 23.04 22.7362 21.8268 23.2388C20.6135 23.7413 19.3132 24 17.9999 24C17.3278 24 16.6591 23.9322 16.0036 23.7987Z"
+        fill="black"
+        fill-opacity="0.9"
+      />
+    </svg>
+
+    <svg
+      v-else
+      width="28"
+      height="28"
+      viewBox="0 0 28 28"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M20 14C20 18.9706 15.9706 23 11 23C6.02944 23 2 18.9706 2 14C2 9.02944 6.02944 5 11 5C15.9706 5 20 9.02944 20 14ZM16.0037 23.7987C14.5026 24.5667 12.8019 25 11 25C4.92487 25 0 20.0751 0 14C0 7.92487 4.92487 3 11 3C12.8019 3 14.5026 3.43326 16.0037 4.20129C16.6591 4.06775 17.3278 4 17.9999 4C19.3132 4 20.6135 4.25866 21.8268 4.76121C23.04 5.26375 24.1424 6.00035 25.071 6.92893C25.9996 7.85752 26.7362 8.95991 27.2387 10.1732C27.7413 11.3864 27.9999 12.6868 27.9999 14C27.9999 15.3132 27.7413 16.6136 27.2387 17.8268C26.7362 19.0401 25.9996 20.1425 25.071 21.0711C24.1424 21.9997 23.04 22.7362 21.8268 23.2388C20.6135 23.7413 19.3132 24 17.9999 24C17.3278 24 16.6591 23.9322 16.0037 23.7987ZM18.5715 21.9796C19.4264 21.9183 20.2672 21.72 21.0614 21.391C22.032 20.989 22.9139 20.3997 23.6568 19.6569C24.3997 18.914 24.9889 18.0321 25.391 17.0615C25.793 16.0909 25.9999 15.0506 25.9999 14C25.9999 12.9494 25.793 11.9091 25.391 10.9385C24.9889 9.96793 24.3997 9.08602 23.6568 8.34315C22.9139 7.60028 22.032 7.011 21.0614 6.60896C20.2672 6.28001 19.4264 6.08168 18.5715 6.02044C20.6832 8.02483 22 10.8586 22 14C22 17.1414 20.6832 19.9752 18.5715 21.9796Z"
+        fill="black"
+        fill-opacity="0.6"
+      />
+    </svg>
+  </div>
 </template>
 
+<script setup lang="ts">
+defineProps({
+  isActive: {
+    type: Boolean,
+    default: false,
+  },
+});
+</script>
 <style scoped>
-svg {
+div {
   display: inline-block;
   vertical-align: baseline;
 }
diff --git a/packages/extension/src/ui/action/icons/tabs/dapps.vue b/packages/extension/src/ui/action/icons/tabs/dapps.vue
index e007e8b89..519341b8f 100644
--- a/packages/extension/src/ui/action/icons/tabs/dapps.vue
+++ b/packages/extension/src/ui/action/icons/tabs/dapps.vue
@@ -1,22 +1,51 @@
 <template>
-  <svg
-    width="28"
-    height="28"
-    viewBox="0 0 28 28"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <path
-      fill-rule="evenodd"
-      clip-rule="evenodd"
-      d="M8.5 11C7.24277 11 7.04354 10.9796 6.93375 10.9473C6.50926 10.8227 6.1773 10.4907 6.05266 10.0663C6.02042 9.95646 6 9.75723 6 8.5C6 7.24277 6.02042 7.04354 6.05266 6.93375C6.1773 6.50926 6.50926 6.1773 6.93375 6.05266C7.04354 6.02042 7.24277 6 8.5 6C9.75723 6 9.95646 6.02042 10.0663 6.05266C10.4907 6.1773 10.8227 6.50926 10.9473 6.93375C10.9796 7.04354 11 7.24277 11 8.5C11 9.75723 10.9796 9.95646 10.9473 10.0663C10.8227 10.4907 10.4907 10.8227 10.0663 10.9473C9.95646 10.9796 9.75723 11 8.5 11ZM4 8.5C4 7.38369 4 6.82553 4.13367 6.37028C4.45007 5.29274 5.29274 4.45007 6.37028 4.13367C6.82553 4 7.38369 4 8.5 4C9.61631 4 10.1745 4 10.6297 4.13367C11.7073 4.45007 12.5499 5.29274 12.8663 6.37028C13 6.82553 13 7.38369 13 8.5C13 9.61631 13 10.1745 12.8663 10.6297C12.5499 11.7073 11.7073 12.5499 10.6297 12.8663C10.1745 13 9.61631 13 8.5 13C7.38369 13 6.82553 13 6.37028 12.8663C5.29274 12.5499 4.45007 11.7073 4.13367 10.6297C4 10.1745 4 9.61631 4 8.5ZM19.5 11C18.2428 11 18.0435 10.9796 17.9337 10.9473C17.5093 10.8227 17.1773 10.4907 17.0527 10.0663C17.0204 9.95646 17 9.75723 17 8.5C17 7.24277 17.0204 7.04354 17.0527 6.93375C17.1773 6.50926 17.5093 6.1773 17.9337 6.05266C18.0435 6.02042 18.2428 6 19.5 6C20.7572 6 20.9565 6.02042 21.0663 6.05266C21.4907 6.1773 21.8227 6.50926 21.9473 6.93375C21.9796 7.04354 22 7.24277 22 8.5C22 9.75723 21.9796 9.95646 21.9473 10.0663C21.8227 10.4907 21.4907 10.8227 21.0663 10.9473C20.9565 10.9796 20.7572 11 19.5 11ZM15 8.5C15 7.38369 15 6.82553 15.1337 6.37028C15.4501 5.29274 16.2927 4.45007 17.3703 4.13367C17.8255 4 18.3837 4 19.5 4C20.6163 4 21.1745 4 21.6297 4.13367C22.7073 4.45007 23.5499 5.29274 23.8663 6.37028C24 6.82553 24 7.38369 24 8.5C24 9.61631 24 10.1745 23.8663 10.6297C23.5499 11.7073 22.7073 12.5499 21.6297 12.8663C21.1745 13 20.6163 13 19.5 13C18.3837 13 17.8255 13 17.3703 12.8663C16.2927 12.5499 15.4501 11.7073 15.1337 10.6297C15 10.1745 15 9.61631 15 8.5ZM6.93375 21.9473C7.04354 21.9796 7.24277 22 8.5 22C9.75723 22 9.95646 21.9796 10.0663 21.9473C10.4907 21.8227 10.8227 21.4907 10.9473 21.0663C10.9796 20.9565 11 20.7572 11 19.5C11 18.2428 10.9796 18.0435 10.9473 17.9337C10.8227 17.5093 10.4907 17.1773 10.0663 17.0527C9.95646 17.0204 9.75723 17 8.5 17C7.24277 17 7.04354 17.0204 6.93375 17.0527C6.50926 17.1773 6.1773 17.5093 6.05266 17.9337C6.02042 18.0435 6 18.2428 6 19.5C6 20.7572 6.02042 20.9565 6.05266 21.0663C6.1773 21.4907 6.50926 21.8227 6.93375 21.9473ZM4.13367 17.3703C4 17.8255 4 18.3837 4 19.5C4 20.6163 4 21.1745 4.13367 21.6297C4.45007 22.7073 5.29274 23.5499 6.37028 23.8663C6.82553 24 7.38369 24 8.5 24C9.61631 24 10.1745 24 10.6297 23.8663C11.7073 23.5499 12.5499 22.7073 12.8663 21.6297C13 21.1745 13 20.6163 13 19.5C13 18.3837 13 17.8255 12.8663 17.3703C12.5499 16.2927 11.7073 15.4501 10.6297 15.1337C10.1745 15 9.61631 15 8.5 15C7.38369 15 6.82553 15 6.37028 15.1337C5.29274 15.4501 4.45007 16.2927 4.13367 17.3703ZM19.5 22C18.2428 22 18.0435 21.9796 17.9337 21.9473C17.5093 21.8227 17.1773 21.4907 17.0527 21.0663C17.0204 20.9565 17 20.7572 17 19.5C17 18.2428 17.0204 18.0435 17.0527 17.9337C17.1773 17.5093 17.5093 17.1773 17.9337 17.0527C18.0435 17.0204 18.2428 17 19.5 17C20.7572 17 20.9565 17.0204 21.0663 17.0527C21.4907 17.1773 21.8227 17.5093 21.9473 17.9337C21.9796 18.0435 22 18.2428 22 19.5C22 20.7572 21.9796 20.9565 21.9473 21.0663C21.8227 21.4907 21.4907 21.8227 21.0663 21.9473C20.9565 21.9796 20.7572 22 19.5 22ZM15 19.5C15 18.3837 15 17.8255 15.1337 17.3703C15.4501 16.2927 16.2927 15.4501 17.3703 15.1337C17.8255 15 18.3837 15 19.5 15C20.6163 15 21.1745 15 21.6297 15.1337C22.7073 15.4501 23.5499 16.2927 23.8663 17.3703C24 17.8255 24 18.3837 24 19.5C24 20.6163 24 21.1745 23.8663 21.6297C23.5499 22.7073 22.7073 23.5499 21.6297 23.8663C21.1745 24 20.6163 24 19.5 24C18.3837 24 17.8255 24 17.3703 23.8663C16.2927 23.5499 15.4501 22.7073 15.1337 21.6297C15 21.1745 15 20.6163 15 19.5Z"
-      fill="#202124"
-    />
-  </svg>
+  <div>
+    <svg
+      v-if="isActive"
+      width="28"
+      height="28"
+      viewBox="0 0 28 28"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M4 8.5C4 7.38369 4 6.82553 4.13367 6.37028C4.45007 5.29274 5.29274 4.45007 6.37028 4.13367C6.82553 4 7.38369 4 8.5 4C9.61631 4 10.1745 4 10.6297 4.13367C11.7073 4.45007 12.5499 5.29274 12.8663 6.37028C13 6.82553 13 7.38369 13 8.5C13 9.61631 13 10.1745 12.8663 10.6297C12.5499 11.7073 11.7073 12.5499 10.6297 12.8663C10.1745 13 9.61631 13 8.5 13C7.38369 13 6.82553 13 6.37028 12.8663C5.29274 12.5499 4.45007 11.7073 4.13367 10.6297C4 10.1745 4 9.61631 4 8.5ZM15 8.5C15 7.38369 15 6.82553 15.1337 6.37028C15.4501 5.29274 16.2927 4.45007 17.3703 4.13367C17.8255 4 18.3837 4 19.5 4C20.6163 4 21.1745 4 21.6297 4.13367C22.7073 4.45007 23.5499 5.29274 23.8663 6.37028C24 6.82553 24 7.38369 24 8.5C24 9.61631 24 10.1745 23.8663 10.6297C23.5499 11.7073 22.7073 12.5499 21.6297 12.8663C21.1745 13 20.6163 13 19.5 13C18.3837 13 17.8255 13 17.3703 12.8663C16.2927 12.5499 15.4501 11.7073 15.1337 10.6297C15 10.1745 15 9.61631 15 8.5ZM4.13367 17.3703C4 17.8255 4 18.3837 4 19.5C4 20.6163 4 21.1745 4.13367 21.6297C4.45007 22.7073 5.29274 23.5499 6.37028 23.8663C6.82553 24 7.38369 24 8.5 24C9.61631 24 10.1745 24 10.6297 23.8663C11.7073 23.5499 12.5499 22.7073 12.8663 21.6297C13 21.1745 13 20.6163 13 19.5C13 18.3837 13 17.8255 12.8663 17.3703C12.5499 16.2927 11.7073 15.4501 10.6297 15.1337C10.1745 15 9.61631 15 8.5 15C7.38369 15 6.82553 15 6.37028 15.1337C5.29274 15.4501 4.45007 16.2927 4.13367 17.3703ZM15 19.5C15 18.3837 15 17.8255 15.1337 17.3703C15.4501 16.2927 16.2927 15.4501 17.3703 15.1337C17.8255 15 18.3837 15 19.5 15C20.6163 15 21.1745 15 21.6297 15.1337C22.7073 15.4501 23.5499 16.2927 23.8663 17.3703C24 17.8255 24 18.3837 24 19.5C24 20.6163 24 21.1745 23.8663 21.6297C23.5499 22.7073 22.7073 23.5499 21.6297 23.8663C21.1745 24 20.6163 24 19.5 24C18.3837 24 17.8255 24 17.3703 23.8663C16.2927 23.5499 15.4501 22.7073 15.1337 21.6297C15 21.1745 15 20.6163 15 19.5Z"
+        fill="black"
+        fill-opacity="0.9"
+      />
+    </svg>
+
+    <svg
+      v-else
+      width="28"
+      height="28"
+      viewBox="0 0 28 28"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M8.5 11C7.24277 11 7.04354 10.9796 6.93375 10.9473C6.50926 10.8227 6.1773 10.4907 6.05266 10.0663C6.02042 9.95646 6 9.75723 6 8.5C6 7.24277 6.02042 7.04354 6.05266 6.93375C6.1773 6.50926 6.50926 6.1773 6.93375 6.05266C7.04354 6.02042 7.24277 6 8.5 6C9.75723 6 9.95646 6.02042 10.0663 6.05266C10.4907 6.1773 10.8227 6.50926 10.9473 6.93375C10.9796 7.04354 11 7.24277 11 8.5C11 9.75723 10.9796 9.95646 10.9473 10.0663C10.8227 10.4907 10.4907 10.8227 10.0663 10.9473C9.95646 10.9796 9.75723 11 8.5 11ZM4 8.5C4 7.38369 4 6.82553 4.13367 6.37028C4.45007 5.29274 5.29274 4.45007 6.37028 4.13367C6.82553 4 7.38369 4 8.5 4C9.61631 4 10.1745 4 10.6297 4.13367C11.7073 4.45007 12.5499 5.29274 12.8663 6.37028C13 6.82553 13 7.38369 13 8.5C13 9.61631 13 10.1745 12.8663 10.6297C12.5499 11.7073 11.7073 12.5499 10.6297 12.8663C10.1745 13 9.61631 13 8.5 13C7.38369 13 6.82553 13 6.37028 12.8663C5.29274 12.5499 4.45007 11.7073 4.13367 10.6297C4 10.1745 4 9.61631 4 8.5ZM19.5 11C18.2428 11 18.0435 10.9796 17.9337 10.9473C17.5093 10.8227 17.1773 10.4907 17.0527 10.0663C17.0204 9.95646 17 9.75723 17 8.5C17 7.24277 17.0204 7.04354 17.0527 6.93375C17.1773 6.50926 17.5093 6.1773 17.9337 6.05266C18.0435 6.02042 18.2428 6 19.5 6C20.7572 6 20.9565 6.02042 21.0663 6.05266C21.4907 6.1773 21.8227 6.50926 21.9473 6.93375C21.9796 7.04354 22 7.24277 22 8.5C22 9.75723 21.9796 9.95646 21.9473 10.0663C21.8227 10.4907 21.4907 10.8227 21.0663 10.9473C20.9565 10.9796 20.7572 11 19.5 11ZM15 8.5C15 7.38369 15 6.82553 15.1337 6.37028C15.4501 5.29274 16.2927 4.45007 17.3703 4.13367C17.8255 4 18.3837 4 19.5 4C20.6163 4 21.1745 4 21.6297 4.13367C22.7073 4.45007 23.5499 5.29274 23.8663 6.37028C24 6.82553 24 7.38369 24 8.5C24 9.61631 24 10.1745 23.8663 10.6297C23.5499 11.7073 22.7073 12.5499 21.6297 12.8663C21.1745 13 20.6163 13 19.5 13C18.3837 13 17.8255 13 17.3703 12.8663C16.2927 12.5499 15.4501 11.7073 15.1337 10.6297C15 10.1745 15 9.61631 15 8.5ZM6.93375 21.9473C7.04354 21.9796 7.24277 22 8.5 22C9.75723 22 9.95646 21.9796 10.0663 21.9473C10.4907 21.8227 10.8227 21.4907 10.9473 21.0663C10.9796 20.9565 11 20.7572 11 19.5C11 18.2428 10.9796 18.0435 10.9473 17.9337C10.8227 17.5093 10.4907 17.1773 10.0663 17.0527C9.95646 17.0204 9.75723 17 8.5 17C7.24277 17 7.04354 17.0204 6.93375 17.0527C6.50926 17.1773 6.1773 17.5093 6.05266 17.9337C6.02042 18.0435 6 18.2428 6 19.5C6 20.7572 6.02042 20.9565 6.05266 21.0663C6.1773 21.4907 6.50926 21.8227 6.93375 21.9473ZM4.13367 17.3703C4 17.8255 4 18.3837 4 19.5C4 20.6163 4 21.1745 4.13367 21.6297C4.45007 22.7073 5.29274 23.5499 6.37028 23.8663C6.82553 24 7.38369 24 8.5 24C9.61631 24 10.1745 24 10.6297 23.8663C11.7073 23.5499 12.5499 22.7073 12.8663 21.6297C13 21.1745 13 20.6163 13 19.5C13 18.3837 13 17.8255 12.8663 17.3703C12.5499 16.2927 11.7073 15.4501 10.6297 15.1337C10.1745 15 9.61631 15 8.5 15C7.38369 15 6.82553 15 6.37028 15.1337C5.29274 15.4501 4.45007 16.2927 4.13367 17.3703ZM19.5 22C18.2428 22 18.0435 21.9796 17.9337 21.9473C17.5093 21.8227 17.1773 21.4907 17.0527 21.0663C17.0204 20.9565 17 20.7572 17 19.5C17 18.2428 17.0204 18.0435 17.0527 17.9337C17.1773 17.5093 17.5093 17.1773 17.9337 17.0527C18.0435 17.0204 18.2428 17 19.5 17C20.7572 17 20.9565 17.0204 21.0663 17.0527C21.4907 17.1773 21.8227 17.5093 21.9473 17.9337C21.9796 18.0435 22 18.2428 22 19.5C22 20.7572 21.9796 20.9565 21.9473 21.0663C21.8227 21.4907 21.4907 21.8227 21.0663 21.9473C20.9565 21.9796 20.7572 22 19.5 22ZM15 19.5C15 18.3837 15 17.8255 15.1337 17.3703C15.4501 16.2927 16.2927 15.4501 17.3703 15.1337C17.8255 15 18.3837 15 19.5 15C20.6163 15 21.1745 15 21.6297 15.1337C22.7073 15.4501 23.5499 16.2927 23.8663 17.3703C24 17.8255 24 18.3837 24 19.5C24 20.6163 24 21.1745 23.8663 21.6297C23.5499 22.7073 22.7073 23.5499 21.6297 23.8663C21.1745 24 20.6163 24 19.5 24C18.3837 24 17.8255 24 17.3703 23.8663C16.2927 23.5499 15.4501 22.7073 15.1337 21.6297C15 21.1745 15 20.6163 15 19.5Z"
+        fill="black"
+        fill-opacity="0.6"
+      />
+    </svg>
+  </div>
 </template>
 
+<script setup lang="ts">
+defineProps({
+  isActive: {
+    type: Boolean,
+    default: false,
+  },
+});
+</script>
 <style scoped>
-svg {
+div {
   display: inline-block;
   vertical-align: baseline;
 }
diff --git a/packages/extension/src/ui/action/icons/tabs/nfts.vue b/packages/extension/src/ui/action/icons/tabs/nfts.vue
index af17dccda..2864842e9 100644
--- a/packages/extension/src/ui/action/icons/tabs/nfts.vue
+++ b/packages/extension/src/ui/action/icons/tabs/nfts.vue
@@ -1,22 +1,57 @@
 <template>
-  <svg
-    width="28"
-    height="28"
-    viewBox="0 0 28 28"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <path
-      fill-rule="evenodd"
-      clip-rule="evenodd"
-      d="M16.1351 5H19.6745C19.9365 5 20.0673 5.00048 20.1623 5.00482L20.1695 5.00516L20.1748 5.00999C20.245 5.07408 20.3378 5.16621 20.5231 5.35147L23.421 8.24938L19.4012 8.91935L16.1351 5ZM11.865 5H8.3255C8.0635 5 7.93274 5.00048 7.83776 5.00482L7.83059 5.00516L7.82527 5.00999C7.75504 5.07408 7.66224 5.16621 7.47698 5.35147L4.57907 8.24938L8.59885 8.91935L11.865 5ZM4.62005 10.2838L11.6295 18.9109L8.28977 10.8954L4.62005 10.2838ZM16.3705 18.9109L23.38 10.2838L19.7103 10.8954L16.3705 18.9109ZM6.06276 3.93726C6.40867 3.59135 6.58162 3.4184 6.78345 3.29472C6.9624 3.18506 7.15749 3.10425 7.36156 3.05526C7.59173 3 7.83632 3 8.3255 3H19.6745C20.1637 3 20.4083 3 20.6385 3.05526C20.8426 3.10425 21.0376 3.18506 21.2166 3.29472C21.4184 3.4184 21.5914 3.59135 21.9373 3.93725L24.9593 6.95926C25.6805 7.68043 26.041 8.04102 26.1924 8.4622C26.3258 8.83318 26.3465 9.23531 26.2521 9.61804C26.1448 10.0526 25.8232 10.4483 25.1801 11.2399L16.4836 21.9433C15.6331 22.99 15.2079 23.5134 14.6959 23.7034C14.247 23.87 13.7531 23.87 13.3041 23.7034C12.7921 23.5134 12.3669 22.99 11.5165 21.9433L2.81994 11.2399C2.1768 10.4483 1.85524 10.0526 1.74798 9.61804C1.6535 9.23531 1.67425 8.83318 1.8076 8.4622C1.959 8.04102 2.31959 7.68043 3.04076 6.95926L6.06276 3.93726ZM14 19.4L10.5 11L17.5 11L14 19.4ZM14 5.56205L11.1351 9H16.865L14 5.56205Z"
-      fill="#202124"
-    />
-  </svg>
+  <div>
+    <svg
+      v-if="isActive"
+      width="28"
+      height="28"
+      viewBox="0 0 28 28"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g clip-path="url(#clip0_7331_31914)">
+        <path
+          fill-rule="evenodd"
+          clip-rule="evenodd"
+          d="M6.14463 4.21951L6.14463 4.21952L3.19346 6.9618C2.42087 7.67971 2.03458 8.03866 1.86822 8.4666C1.72176 8.84336 1.69291 9.25565 1.78546 9.64914C1.89058 10.0961 2.2231 10.5053 2.88816 11.3239L11.5164 21.9433C12.3669 22.99 12.7921 23.5134 13.3041 23.7034C13.7531 23.87 14.2469 23.87 14.6959 23.7034C15.2079 23.5134 15.6331 22.99 16.4836 21.9433L16.4836 21.9433L25.0862 11.3554C25.7595 10.5268 26.0961 10.1125 26.2004 9.66099C26.2922 9.26356 26.2602 8.84756 26.1089 8.46879C25.9369 8.03848 25.541 7.6804 24.7492 6.96424L21.6852 4.19305L21.6852 4.19303C21.4007 3.93574 21.2585 3.80709 21.0981 3.7092C20.9557 3.62233 20.803 3.5536 20.6436 3.50463C20.4639 3.44944 20.2733 3.42826 19.8921 3.3859L16.419 3H11.419L7.96951 3.38327C7.57965 3.42659 7.38472 3.44825 7.2014 3.50537C7.03874 3.55606 6.88321 3.62733 6.73861 3.71745C6.57566 3.819 6.43198 3.9525 6.14463 4.21951ZM8.42761 8.8908L10.2514 5.14199L11.5294 4.99999H12.5446L10.5986 9H17.3624L15.3084 4.99999H16.3079L17.6322 5.14714L19.556 8.89354L23.2244 8.28214L23.4073 8.44753C23.827 8.82714 24.0538 9.03424 24.2058 9.19548L24.2223 9.21317L24.2087 9.23318C24.0831 9.41572 23.8906 9.65501 23.5337 10.0942L23.3796 10.2839L19.7103 10.8954L16.3709 18.91L14.931 20.6821C14.483 21.2335 14.2276 21.545 14.0263 21.7528L13.9997 21.7798L13.9731 21.7528C13.7718 21.545 13.5164 21.2335 13.0684 20.6821L11.6299 18.9117L8.28981 10.8954L4.61969 10.2837L4.44008 10.0627C4.08747 9.62869 3.89764 9.39274 3.7737 9.21276L3.76037 9.19321L3.77629 9.1757C3.9241 9.01475 4.14494 8.80754 4.55457 8.4269L4.72029 8.27291L8.42761 8.8908ZM10.5001 11L14.0001 19.4L17.5001 11H10.5001Z"
+          fill="black"
+          fill-opacity="0.9"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_7331_31914">
+          <rect width="28" height="28" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+    <svg
+      v-else
+      width="28"
+      height="28"
+      viewBox="0 0 28 28"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M4.72055 8.27297L7.50604 5.68463C7.66012 5.54146 7.73646 5.47096 7.79376 5.42159L7.79789 5.41804L7.80328 5.41723C7.87808 5.40606 7.98133 5.39427 8.19037 5.37104L10.2513 5.14205L8.42756 8.8908L4.72055 8.27297ZM4.62004 10.2838L11.6295 18.9109L8.28976 10.8954L4.62004 10.2838ZM16.3705 18.9109L23.38 10.2838L19.7102 10.8954L16.3705 18.9109ZM23.2247 8.2821L20.3436 5.67635C20.1911 5.53837 20.1156 5.47049 20.059 5.42296L20.0549 5.41955L20.0497 5.41876C19.9766 5.40791 19.8757 5.39639 19.6712 5.37367L17.6322 5.14711L19.556 8.89355L23.2247 8.2821ZM15.3083 5H12.5445L10.5986 9H17.3624L15.3083 5ZM7.96951 3.38327L11.419 3H16.419L19.8921 3.3859C20.2733 3.42826 20.4639 3.44944 20.6436 3.50463C20.803 3.5536 20.9557 3.62233 21.0981 3.7092C21.2585 3.80709 21.4007 3.93574 21.6852 4.19303L24.7492 6.96424C25.541 7.6804 25.9369 8.03848 26.1089 8.46879C26.2602 8.84756 26.2922 9.26356 26.2004 9.66099C26.0961 10.1125 25.7595 10.5268 25.0862 11.3554L16.4836 21.9433C15.6331 22.99 15.2079 23.5134 14.6959 23.7034C14.2469 23.87 13.7531 23.87 13.3041 23.7034C12.7921 23.5134 12.3669 22.99 11.5164 21.9433L2.88816 11.3239C2.2231 10.5053 1.89058 10.0961 1.78546 9.64914C1.69291 9.25565 1.72176 8.84336 1.86822 8.4666C2.03458 8.03866 2.42087 7.67971 3.19346 6.9618L6.14463 4.21952C6.43198 3.95251 6.57566 3.819 6.73861 3.71745C6.88321 3.62733 7.03874 3.55606 7.2014 3.50537C7.38472 3.44825 7.57965 3.42659 7.96951 3.38327ZM14 19.4L10.5 11L17.5 11L14 19.4Z"
+        fill="black"
+        fill-opacity="0.6"
+      />
+    </svg>
+  </div>
 </template>
 
+<script setup lang="ts">
+defineProps({
+  isActive: {
+    type: Boolean,
+    default: false,
+  },
+});
+</script>
 <style scoped>
-svg {
+div {
   display: inline-block;
   vertical-align: baseline;
 }

From 28a15ce2e3c6280f4238af21ef10d83cb5fb356c Mon Sep 17 00:00:00 2001
From: olgakup <16910687+olgakup@users.noreply.github.com>
Date: Tue, 4 Feb 2025 13:28:51 -0800
Subject: [PATCH 3/4] fix: title wrap in connect popup

---
 .../src/providers/ethereum/ui/styles/common-popup.less         | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/packages/extension/src/providers/ethereum/ui/styles/common-popup.less b/packages/extension/src/providers/ethereum/ui/styles/common-popup.less
index bbc677ea1..adacf22c4 100644
--- a/packages/extension/src/providers/ethereum/ui/styles/common-popup.less
+++ b/packages/extension/src/providers/ethereum/ui/styles/common-popup.less
@@ -4,6 +4,9 @@
   width: 100%;
   height: 100%;
   padding-left: 30px;
+  h2 {
+    word-break: normal !important;
+  }
 
   &__header {
     padding: 28px 0 8px 0;

From 931c6a717b694e85a745caa15df3f32e0c639a70 Mon Sep 17 00:00:00 2001
From: olgakup <16910687+olgakup@users.noreply.github.com>
Date: Tue, 4 Feb 2025 13:37:04 -0800
Subject: [PATCH 4/4] fix: token icon size in assets

---
 .../views/network-assets/components/network-assets-item.vue  | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/packages/extension/src/ui/action/views/network-assets/components/network-assets-item.vue b/packages/extension/src/ui/action/views/network-assets/components/network-assets-item.vue
index 3a9b45b2b..0158cb4d8 100644
--- a/packages/extension/src/ui/action/views/network-assets/components/network-assets-item.vue
+++ b/packages/extension/src/ui/action/views/network-assets/components/network-assets-item.vue
@@ -4,7 +4,7 @@
       class="network-assets__token-info"
       :class="{ max: token.priceChangePercentage == 0 }"
     >
-      <img :src="token.icon" />
+      <img :src="token.icon" width="32px" height="32px" />
       <div class="network-assets__token-info-name">
         <h4 v-if="token.name.length <= 16">{{ token.name }}</h4>
         <tooltip v-else :text="token.name"
@@ -223,7 +223,8 @@ const toggleDetail = () => {
       }
 
       img {
-        max-width: 32px;
+        width: 32px;
+        height: 32px;
         margin-right: 16px;
         border-radius: 100%;
         box-shadow: inset 0px 0px 1px rgba(0, 0, 0, 0.16);