ce07a621e5
According to the WCAG success criterias 1.3.1 (Info and relationships), 3.3.2 (Labels or Instructions) and 4.1.2 (Name, Role, Value), labels or instructions are required when content requires user input. To do so, this commit adds a label for the password input and hide it with a CSS visually-hidden method to not alter the design. Resources: - https://www.w3.org/TR/WCAG21/#labels-or-instructions - https://www.w3.org/TR/WCAG21/#info-and-relationships - https://www.w3.org/TR/WCAG21/#name-role-value - https://www.w3.org/TR/WCAG20-TECHS/H44.html - https://www.w3.org/WAI/WCAG21/Understanding/labels-or-instructions.html - https://gomakethings.com/hidden-content-for-better-a11y/
14 lines
604 B
Smarty
14 lines
604 B
Smarty
{include file='inc/head.tpl'}
|
|
<div class="wrapper">
|
|
<main class="main">
|
|
{include file="inc/logo.tpl"}
|
|
<h2>{t}This video is protected{/t}</h2>
|
|
<p>{t}You need a password in order to download this video.{/t}</p>
|
|
<form action="" method="POST">
|
|
<label class="sr-only" for="password">{t}Video password{/t}</label>
|
|
<input class="URLinput" type="password" name="password" id="password" />
|
|
<br/><br/>
|
|
<input class="downloadBtn" type="submit" value="{t}Download{/t}" />
|
|
</form>
|
|
</main>
|
|
{include file='inc/footer.tpl'}
|