diff --git a/static/kx-claim.js b/static/kx-claim.js
index e721952..a9e5c0b 100644
--- a/static/kx-claim.js
+++ b/static/kx-claim.js
@@ -82,14 +82,14 @@ class Claim extends HTMLElement {
const profile_link = subsection_links_text.appendChild(document.createElement('p'));
if (claim.matches[0].profile.uri) {
- profile_link.innerHTML = `Profile link: ${claim.matches[0].profile.uri}`;
+ profile_link.innerHTML = `Profile link: ${claim.matches[0].profile.uri}`;
} else {
profile_link.innerHTML = `Profile link: not accessible from browser`;
}
const proof_link = subsection_links_text.appendChild(document.createElement('p'));
if (claim.matches[0].proof.uri) {
- proof_link.innerHTML = `Proof link: ${claim.matches[0].proof.uri}`;
+ proof_link.innerHTML = `Proof link: ${claim.matches[0].proof.uri}`;
} else {
proof_link.innerHTML = `Proof link: not accessible from browser`;
}
@@ -109,6 +109,7 @@ class Claim extends HTMLElement {
const button_profileQR = subsection_qr_text.appendChild(document.createElement('button'));
button_profileQR.innerText = `Show profile QR`;
button_profileQR.setAttribute('onClick', `showQR('${claim.matches[0].profile.qr}', 'url')`);
+ button_profileQR.setAttribute('aria-label', `Show QR code linking to profile`);
}
elContent.appendChild(document.createElement('hr'));
@@ -160,7 +161,7 @@ class Claim extends HTMLElement {
const subsection_info_text = subsection_info.appendChild(document.createElement('div'));
const result_proxyUsed = subsection_info_text.appendChild(document.createElement('p'));
- result_proxyUsed.innerHTML = `A proxy was used to fetch the proof: PLACEHOLDER__PROXY_HOSTNAME`;
+ result_proxyUsed.innerHTML = `A proxy was used to fetch the proof: PLACEHOLDER__PROXY_HOSTNAME`;
}
// TODO Display errors
diff --git a/static/kx-key.js b/static/kx-key.js
index 3c8c6db..e79f355 100644
--- a/static/kx-key.js
+++ b/static/kx-key.js
@@ -33,7 +33,7 @@ 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: ${data.key.uri}`;
+ profile_link.innerHTML = `Key link: ${data.key.uri}`;
elContent.appendChild(document.createElement('hr'));
@@ -46,9 +46,10 @@ class Key extends HTMLElement {
subsection_qr_icon.setAttribute('aria-hidden', 'true');
const subsection_qr_text = subsection_qr.appendChild(document.createElement('div'));
- const button_profileQR = subsection_qr_text.appendChild(document.createElement('button'));
- button_profileQR.innerText = `Show OpenPGP fingerprint QR`;
- button_profileQR.setAttribute('onClick', `showQR('${data.fingerprint}', 'fingerprint')`);
+ const button_fingerprintQR = subsection_qr_text.appendChild(document.createElement('button'));
+ button_fingerprintQR.innerText = `Show OpenPGP fingerprint QR`;
+ button_fingerprintQR.setAttribute('onClick', `showQR('${data.fingerprint}', 'fingerprint')`);
+ button_fingerprintQR.setAttribute('aria-label', `Show QR code for cryptographic fingerprint`);
}
}
diff --git a/views/index.pug b/views/index.pug
index 6c37a0d..ab9260d 100644
--- a/views/index.pug
+++ b/views/index.pug
@@ -34,10 +34,10 @@ block content
.narrow
#search.form-wrapper.card
- h2 Generate a profile
+ h2#searchTitle Generate a profile
form(action="post")
- label(for="query") Query for fingerprint or email identifier
- input#query(type="search" name="query" required placeholder="3637202523e7c1309ab79e99ef2dc5827b445f4b, test@doip.rocks")
+ label#searchQuery(for="query") Query for fingerprint or email identifier
+ input#query(type="search" name="query" required placeholder="3637202523e7c1309ab79e99ef2dc5827b445f4b, test@doip.rocks" aria-labelledby="searchTitle searchQuery")
fieldset(aria-role="radiogroup").radio-wrapper
legend Protocol
diff --git a/views/profile.pug b/views/profile.pug
index da3eb80..21a63ec 100644
--- a/views/profile.pug
+++ b/views/profile.pug
@@ -8,7 +8,7 @@ mixin generateUser(user, isPrimary)
each claim in user.claims
if claim.matches.length > 0
kx-claim.kx-item(data-claim=claim)
- details
+ details(aria-label="Claim")
summary
.info
p.subtitle= claim.matches[0].serviceprovider.name
@@ -22,12 +22,12 @@ mixin generateUser(user, isPrimary)
div
if (claim.matches[0].profile.uri)
p Profile link:
- a(rel='me' href=claim.matches[0].profile.uri)= claim.matches[0].profile.uri
+ a(rel='me' href=claim.matches[0].profile.uri aria-label="Link to profile")= claim.matches[0].profile.uri
else
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)= claim.matches[0].proof.uri
+ a(rel='me' href=claim.matches[0].proof.uri aria-label="Link to proof")= claim.matches[0].proof.uri
else
p Proof link: not accessible from browser
@@ -117,7 +117,7 @@ block content
#profileProofs.card.card--transparent
h2 Key
kx-key.kx-item(data-keydata=data.keyData)
- details
+ details(aria-label="Key")
summary
.info
p.subtitle= data.keyData.key.fetchMethod
@@ -127,12 +127,12 @@ block content
img(src='/static/img/link.png')
div
p Key link:
- a(href=data.keyData.key.uri)= data.keyData.key.uri
+ a(href=data.keyData.key.uri aria-label="Link to cryptographic key")= data.keyData.key.uri
hr
.subsection
img(src='/static/img/qrcode.png')
div
- button(onClick=`showQR('${data.keyData.fingerprint}', 'fingerprint')`) Show OpenPGP fingerprint QR
+ button(onClick=`showQR('${data.keyData.fingerprint}', 'fingerprint')` aria-label='Show QR code for cryptographic fingerprint') Show OpenPGP fingerprint QR
+generateUser(data.keyData.users[data.keyData.primaryUserIndex], true)
each user, index in data.keyData.users