From a7c8d048506f724045deaf6412f06cd914d51cf3 Mon Sep 17 00:00:00 2001
From: Caesar Schinas <caesar@caesarschinas.com>
Date: Fri, 8 Apr 2022 17:22:54 +0100
Subject: [PATCH] Add h-card markup to profile pages

---
 static-src/kx-key.js |  2 +-
 views/index.pug      |  2 +-
 views/profile.pug    | 12 ++++++------
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/static-src/kx-key.js b/static-src/kx-key.js
index 9774b50..879fbe7 100644
--- a/static-src/kx-key.js
+++ b/static-src/kx-key.js
@@ -62,7 +62,7 @@ export class Key extends HTMLElement {
         const subsection_links_text = subsection_links.appendChild(document.createElement('div'));
 
         const profile_link = subsection_links_text.appendChild(document.createElement('p'));
-        profile_link.innerHTML = `Key link: <a href="${data.key.uri}" aria-label="Link to cryptographic key">${data.key.uri}</a>`;
+        profile_link.innerHTML = `Key link: <a class="u-key" rel="pgpkey" href="${data.key.uri}" aria-label="Link to cryptographic key">${data.key.uri}</a>`;
 
         elContent.appendChild(document.createElement('hr'));
 
diff --git a/views/index.pug b/views/index.pug
index 3d86c78..3b35df2 100644
--- a/views/index.pug
+++ b/views/index.pug
@@ -22,7 +22,7 @@ block content
                 p Profile link: not accessible from browser
               if (demoData.matches[0].proof.uri)
                 p Proof link: 
-                  a(rel='me' href=demoData.matches[0].proof.uri)= demoData.matches[0].proof.uri
+                  a(href=demoData.matches[0].proof.uri)= demoData.matches[0].proof.uri
               else
                 p Proof link: not accessible from browser
                 
diff --git a/views/profile.pug b/views/profile.pug
index eb16296..3fa2c0f 100644
--- a/views/profile.pug
+++ b/views/profile.pug
@@ -2,7 +2,7 @@ extends templates/base.pug
 
 mixin generateUser(user, isPrimary)
   h2
-    | #{user.userData.email}
+    span.p-email #{user.userData.email}
     if isPrimary
       small.primary primary
   each claim in user.claims
@@ -27,7 +27,7 @@ mixin generateUser(user, isPrimary)
                   p Profile link: not accessible from browser
                 if (claim.matches[0].proof.uri)
                   p Proof link: 
-                    a(rel='me' href=claim.matches[0].proof.uri aria-label="Link to proof")= claim.matches[0].proof.uri
+                    a(href=claim.matches[0].proof.uri aria-label="Link to proof")= claim.matches[0].proof.uri
                 else
                   p Proof link: not accessible from browser
 
@@ -40,7 +40,7 @@ block content
       }
     }
 
-  section.profile.narrow
+  section.profile.narrow.h-card
     noscript
       p Keyoxide requires JavaScript to function.
 
@@ -95,9 +95,9 @@ block content
     else
       unless (isSignature && !signature)
         #profileHeader.card.card--transparent.card--profileHeader
-          img#profileAvatar(src=data.extra.avatarURL alt="avatar")
+          img#profileAvatar.u-logo(src=data.extra.avatarURL alt="avatar")
 
-          p#profileName= data.keyData.users[data.keyData.primaryUserIndex].userData.name
+          p#profileName.p-name= data.keyData.users[data.keyData.primaryUserIndex].userData.name
           .button-wrapper
             button(onClick="document.querySelector('#dialog--encryptMessage').showModal();") Encrypt message
             button(onClick="document.querySelector('#dialog--verifySignature').showModal();") Verify signature
@@ -115,7 +115,7 @@ block content
                   img(src='/static/img/link.png')
                   div
                     p Key link: 
-                      a(href=data.keyData.key.uri aria-label="Link to cryptographic key")= data.keyData.key.uri
+                      a.u-key(href=data.keyData.key.uri rel="pgpkey" aria-label="Link to cryptographic key")= data.keyData.key.uri
                 hr
                 .subsection
                   img(src='/static/img/qrcode.png')