feat: add iExec logo and update ProjectCard component to support icon images

Author: Le-Caignec

src/assets/icons/iexec-logo.png

@@ -5,9 +5,15 @@
     <!-- Icon -->
     <div class="flex items-start gap-2">
       <div
-        class="border-border bg-bg flex h-14 w-14 items-center justify-center rounded-xl border"
+        class="border-border bg-bg flex h-14 w-14 items-center justify-center rounded-xl border overflow-hidden p-2"
       >
-        <Icon :icon="icon" height="24" />
+        <img
+          v-if="iconImage"
+          :src="iconImage"
+          :alt="title"
+          class="h-full w-full object-contain"
+        />
+        <Icon v-else :icon="icon" height="24" />
       </div>
       <div>
         <h3 class="mt-0! mb-1! text-lg font-semibold">{{ title }}</h3>
@@ -78,7 +84,8 @@ import Button from './ui/Button.vue';
 interface Props {
   title: string;
   description: string;
-  icon: string;
+  icon?: string;
+  iconImage?: string;
   status: 'available' | 'coming-soon' | 'interactive';
   statusLabel: string;
   buttonLabel: string;
@@ -91,7 +98,10 @@ interface Props {
   githubLabel?: string;
 }
 
-const props = defineProps<Props>();
+const props = withDefaults(defineProps<Props>(), {
+  icon: '',
+  iconImage: '',
+});
 
 const statusIcon = computed(() => {
   switch (props.status) {

src/components/ProjectCard.vue

@@ -33,7 +33,6 @@ data without having to run your own indexing infrastructure.
   and protected data
 - **GraphQL Interface**: Powerful query language for flexible data retrieval
 - **Multi-network Support**: Access data across different blockchain networks
-- **Cost-effective**: No need to run your own indexing infrastructure
 
 ## 🗂️ Available Subgraphs
 
@@ -45,7 +44,7 @@ protocol.
   <ProjectCard
     title="iExec PoCo - Arbitrum Mainnet"
     description="Indexes Proof of Contribution (PoCo) data on Arbitrum mainnet, including apps, deals, tasks, and workerpools"
-    icon="mdi:database-network"
+    icon-image="/assets/icons/arbitrum-logo.png"
     status="available"
     status-label="Live"
     button-label="Explore Subgraph"
@@ -58,7 +57,7 @@ protocol.
   <ProjectCard
     title="iExec DataProtector - Arbitrum Mainnet"
     description="Indexes DataProtector protocol data on Arbitrum mainnet, including protected data, access grants, and sharing mechanisms"
-    icon="mdi:shield-lock"
+    icon-image="/assets/icons/arbitrum-logo.png"
     status="available"
     status-label="Live"
     button-label="Explore Subgraph"
@@ -71,7 +70,7 @@ protocol.
 <ProjectCard
     title="iExec PoCo - Bellecour Mainnet"
     description="Indexes Proof of Contribution (PoCo) data on Bellecour mainnet, including apps, deals, tasks, and workerpools"
-    icon="mdi:database-network"
+    icon-image="/assets/icons/iexec-logo.png"
     status="available"
     status-label="Live"
     button-label="Explore Subgraph"
@@ -81,18 +80,20 @@ protocol.
     button-rel="noreferrer"
   />
 
-<ProjectCard
+  <ProjectCard
     title="iExec DataProtector - Bellecour Mainnet"
     description="Indexes DataProtector protocol data on Bellecour mainnet, including protected data, access grants, and sharing mechanisms"
-    icon="mdi:shield-lock"
+    icon-image="/assets/icons/iexec-logo.png"
     status="available"
     status-label="Live"
     button-label="Explore Subgraph"
     button-icon="mdi:open-in-new"
     button-href="https://thegraph.iex.ec/subgraphs/name/bellecour/dataProtector-v2/graphql?query=query+MyQuery+%7B%0A++protectedDatas+%7B%0A++++id%0A++++name%0A++++owner+%7B%0A++++++id%0A++++%7D%0A++%7D%0A%7D"
     button-target="_blank"
     button-rel="noreferrer"
-  /> </CardGrid>
+  />
+  
+  </CardGrid>
 
 ## 🔍 GraphQL Explorer Interface
 
@@ -108,7 +109,7 @@ explore the available data and construct complex queries.
 
 ### How to Use the GraphQL Explorer
 
-1. **Navigate to a Subgraph**: Click on any of the subgraph links above tos
+1. **Navigate to a Subgraph**: Click on any of the subgraph links above to
    access the GraphQL explorer
 2. **Explore the Schema**: Use the "Schema" tab to browse available entities and
    their fields