d9d4ae5535
Invalid certificate page has hardcoded lang='en' for html, that would cause a11y issue for other languages user. Some of screen reader text is not under translation. This patch would fix both issues. LEARNER-3110
118 lines
5.6 KiB
HTML
118 lines
5.6 KiB
HTML
<%page expression_filter="h"/>
|
|
<%! from django.utils.translation import ugettext as _ %>
|
|
<%namespace name='static' file='../static_content.html'/>
|
|
<%
|
|
course_mode_class = course_mode if course_mode else ''
|
|
%>
|
|
|
|
<main class="accomplishment accomplishment-main">
|
|
|
|
<div class="wrapper-accomplishment-rendering">
|
|
<div class="accomplishment-rendering">
|
|
<span class="deco-corner deco-corner-tl"></span>
|
|
<span class="deco-corner deco-corner-tr"></span>
|
|
<span class="deco-corner deco-corner-bl"></span>
|
|
<span class="deco-corner deco-corner-br"></span>
|
|
|
|
<div class="accomplishment-type">
|
|
<span class="accomplishment-type-symbol">
|
|
<img class="src" src="/static/certificates/images/ico-${course_mode_class}.png" alt="Image for course mode of type ${course_mode_class}">
|
|
</span>
|
|
|
|
<span class="accomplishment-type-label hd-3">${document_title}</span>
|
|
</div>
|
|
|
|
<div class="wrapper-statement-and-signatories">
|
|
<div class="accomplishment-statement">
|
|
<p class="accomplishment-statement-lead">
|
|
<strong class="accomplishment-recipient hd-1 emphasized">${accomplishment_copy_name}</strong>
|
|
<span class="accomplishment-summary copy copy-lead">${accomplishment_copy_description_full}</span>
|
|
|
|
<span class="accomplishment-course hd-1 emphasized">
|
|
<span class="accomplishment-course-org">${accomplishment_copy_course_org} </span>
|
|
<span class="accomplishment-course-number">${course_number}</span>:
|
|
<span class="accomplishment-course-name">${accomplishment_copy_course_name}</span>
|
|
</span>
|
|
</p>
|
|
|
|
<p class="accomplishment-statement-detail copy copy-lead">${accomplishment_copy_course_description}</p>
|
|
</div>
|
|
|
|
% if mode != 'base':
|
|
<div class="accomplishment-signatories">
|
|
<h3 class="accomplishment-signatories-title sr-only">${_("Noted by")}</h3>
|
|
|
|
<div class="wrapper-signatories">
|
|
<div class="list-signatories">
|
|
% if certificate_data:
|
|
% for signatory in certificate_data.get('signatories', []):
|
|
<div class="signatory">
|
|
<img class="signatory-signature" src="${static.url(signatory['signature_image_path'])}" alt="${signatory['name']}">
|
|
|
|
<h4 class="signatory-name hd-5">${signatory['name']}</h4>
|
|
<p class="signatory-credentials copy copy-micro">
|
|
<span class="role">${signatory['title']}</span>
|
|
<span class="organization">${signatory['organization']}</span>
|
|
</p>
|
|
</div>
|
|
% endfor
|
|
% endif
|
|
</div>
|
|
</div>
|
|
</div>
|
|
% endif
|
|
</div>
|
|
|
|
<div class="accomplishment-orgs">
|
|
<h3 class="accomplishment-orgs-title sr-only">${_("Supported by the following organizations")}</h3>
|
|
|
|
<ul class="wrapper-orgs list-orgs">
|
|
<li class="wrapper-organization">
|
|
<div class="organization organization-edX">
|
|
<img class="organization-logo" src="${logo_src}" alt="${platform_name}">
|
|
</div>
|
|
</li>
|
|
|
|
% if organization_logo:
|
|
<li class="wrapper-organization">
|
|
<div class="organization">
|
|
<img class="organization-logo" src="${organization_logo.url}" alt="${platform_name}">
|
|
</div>
|
|
</li>
|
|
% endif
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="wrapper-accomplishment-metadata">
|
|
<div class="accomplishment-metadata">
|
|
<h2 class="accomplishment-metadata-title hd-6">${accomplishment_copy_more_about}</h2>
|
|
|
|
<div class="wrapper-metadata">
|
|
<dl class="metadata accomplishment-recipient">
|
|
<dt class="label sr-only">${_("Awarded to:")}</dt>
|
|
<dd class="value copy copy-meta">
|
|
<span class="recipient-img">
|
|
<img class="src" src="/static/certificates/images/demo-user-profile.png" alt="Recipient Image">
|
|
</span>
|
|
<div class="recipient-details">
|
|
<h3 class="recipient-name">${accomplishment_copy_name}</h3>
|
|
<p class="recipient-username">${accomplishment_copy_username} @ ${platform_name}</p>
|
|
</div>
|
|
</dd>
|
|
</dl>
|
|
<dl class="metadata accomplishment-id">
|
|
<dt class="label copy copy-meta">${certificate_id_number_title}:</dt>
|
|
<dd class="value copy copy-base">${certificate_id_number}</dd>
|
|
</dl>
|
|
<dl class="metadata accomplishment-date">
|
|
<dt class="label copy copy-meta">${certificate_date_issued_title}</dt>
|
|
<dd class="value copy copy-base">${certificate_date_issued}</dd>
|
|
</dl>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</main>
|