feat: add personna (#110)

Author: Le-Caignec

.vitepress/config.ts

@@ -18,7 +18,7 @@ export default withMermaid(
     title: 'iExec Documentation',
     titleTemplate: ':title | PoCo Documentation',
     description:
-      'Build decentralized applications that combine ownership, privacy, and monetization.',
+      'Build on a programmable privacy stack: TEE-secured off-chain computation and confidential on-chain smart contracts.',
     cleanUrls: true,
     lastUpdated: true,
     vite: {
@@ -59,7 +59,7 @@ export default withMermaid(
         'link',
         {
           rel: 'stylesheet',
-          href: 'https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap',
+          href: 'https://fonts.googleapis.com/css2?family=Mulish:wght@400;600;700;800&family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap',
         },
       ],
       [

src/components/HomePage.vue

@@ -28,6 +28,8 @@ const protocolCards = [
     icon: noxIcon,
     title: 'Nox Protocol',
     subtitle: 'Confidential DeFi',
+    persona:
+      "I'm a Solidity developer and I want to build a confidential smart contract.",
     description:
       'Nox is a privacy layer that empowers smart contracts with confidential computation. Encrypted types are executed inside Trusted Execution Environments (TEE), composable with DeFi, without ever exposing plaintext on-chain.',
     link: '/nox-protocol/getting-started/welcome',
@@ -37,6 +39,8 @@ const protocolCards = [
     icon: pocoIcon,
     title: 'iExec PoCo',
     subtitle: 'Off-chain Privacy',
+    persona:
+      "I'm a full-stack developer and I want to build a TEE-powered dApp.",
     description:
       'PoCo is a trust and coordination layer that secures off-chain execution in Trusted Execution Environments (TEE), enforcing correctness, privacy, and clear economic governance.',
     link: '/get-started/welcome',
@@ -101,8 +105,8 @@ const dappFeatures = [
             Privacy
           </h1>
           <p class="hero-tagline">
-            Build, deploy, and govern confidential execution across Web3, with
-            programmable access control and hardware-enforced computation.
+            Build on a programmable privacy stack: TEE-secured off-chain
+            computation and confidential on-chain smart contracts.
           </p>
         </div>
         <div class="hero-image-container">
@@ -136,6 +140,7 @@ const dappFeatures = [
               <span class="protocol-card-subtitle">{{ card.subtitle }}</span>
             </div>
           </div>
+          <p class="protocol-card-persona">{{ card.persona }}</p>
           <p class="protocol-card-desc">{{ card.description }}</p>
         </a>
       </div>
@@ -245,7 +250,7 @@ const dappFeatures = [
   font-family: 'Mulish', sans-serif;
   font-size: 24px;
   font-weight: 400;
-  line-height: 26px;
+  line-height: 36px;
   letter-spacing: 0.2px;
   color: #303038;
   margin: 0;
@@ -456,6 +461,15 @@ const dappFeatures = [
   color: var(--vp-c-text-1);
 }
 
+.protocol-card-persona {
+  font-size: 18px;
+  font-weight: 600;
+  font-style: italic;
+  line-height: 1.6;
+  color: var(--vp-c-brand-1);
+  margin: 0;
+}
+
 .protocol-card-desc {
   font-size: 18px;
   line-height: 1.6;
@@ -476,6 +490,10 @@ const dappFeatures = [
     font-size: 16px;
   }
 
+  .protocol-card-persona {
+    font-size: 15px;
+  }
+
   .protocol-card-desc {
     font-size: 15px;
   }