Added ="true" to aria-hidden attribtues (ampproject#490)

This is to fix talkback not defaulting aria-hidden to true
itgiggs · Jul 6, 2017 · 7a79663 · 7a79663
1 parent 4dde4d3
commit 7a79663
Show file tree

Hide file tree

Showing 8 changed files with 22 additions and 22 deletions.
diff --git a/components/inputs/inputs.snip.html b/components/inputs/inputs.snip.html
@@ -20,7 +20,7 @@
 <!-- Start Input -->
 <div class="ampstart-input inline-block relative m0 p0 mb3 {{classes}}">
   <input type="{{type}}" value="{{value}}" name="{{name}}" id="{{id}}" class="block border-none p0 m0" placeholder="{{placeholder}}" {{disabled}}/>
-  <label for="{{id}}" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden>{{placeholder}}</label>
+  <label for="{{id}}" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden="true">{{placeholder}}</label>
 </div>
 <!-- End Input-->
 {{/input}}
@@ -52,7 +52,7 @@
       <option value="{{value}}">{{.}}</option>
     {{/options}}
   </select>
-  <label for="{{id}}" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden>{{placeholder}}</label>
+  <label for="{{id}}" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden="true">{{placeholder}}</label>
 </div>
 <!-- End Select -->
 {{/select}}
@@ -61,7 +61,7 @@
 <!-- Start Textarea -->
 <div class="ampstart-input inline-block relative m0 p0 mb3 {{classes}}">
   <textarea name="{{name}}" id="{{id}}" class="block border-none  p0 m0" rows="{{rows}}" {{disabled}}></textarea>
-  <label for="{{id}}" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden>{{placeholder}}</label>
+  <label for="{{id}}" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden="true">{{placeholder}}</label>
 </div>
 <!-- End Textarea -->
 {{/textarea}}
@@ -70,7 +70,7 @@
 <!-- Start Checkbox -->
 <div class="ampstart-input ampstart-input-chk inline-block relative m0 p0 mb3 {{classes}}">
     <input type="checkbox" value="{{value}}" name="{{name}}" id="{{id}}" class="p0 m0 relative" {{checked}} {{disabled}}/>
-    <label for="{{id}}" class="" aria-hidden>{{label}}</label>
+    <label for="{{id}}" class="" aria-hidden="true">{{label}}</label>
 </div>
 <!-- End Checkbox -->
 {{/checkbox}}
@@ -80,7 +80,7 @@
 <!-- Start Radio -->
 <div class="ampstart-input ampstart-input-radio inline-block relative m0 p0 mb3 {{classes}}">
     <input type="radio" value="{{value}}" name="{{name}}" id="{{id}}" class="relative" {{checked}} {{disabled}}/>
-    <label for="{{id}}" class="" aria-hidden>{{label}}</label>
+    <label for="{{id}}" class="" aria-hidden="true">{{label}}</label>
 </div>
 <!-- End Radio -->
 {{/radio}}
diff --git a/hl-partials/checkbox.html b/hl-partials/checkbox.html
@@ -1,17 +1,17 @@
 <!-- Checkbox checked -->
 <div class="ampstart-input ampstart-input-chk inline-block relative m0 p0 mb3 ">
     <input type="checkbox" value="1" name="cb" id="cb1" class="p0 m0 relative" checked="">
-    <label for="cb1" class="" aria-hidden>Chkbox 1</label>
+    <label for="cb1" class="" aria-hidden="true">Chkbox 1</label>
 </div>
 
 <!-- Checkbox un-checked -->
 <div class="ampstart-input ampstart-input-chk inline-block relative m0 p0 mb3 ">
     <input type="checkbox" value="2" name="cb" id="cb2" class="p0 m0 relative">
-    <label for="cb2" class="" aria-hidden>Chkbox 2</label>
+    <label for="cb2" class="" aria-hidden="true">Chkbox 2</label>
 </div>
 
 <!-- Checkbox Disabled -->
 <div class="ampstart-input ampstart-input-chk inline-block relative m0 p0 mb3 ">
     <input type="checkbox" value="3" name="cb" id="cb3" class="p0 m0 relative" disabled="">
-    <label for="cb3" class="" aria-hidden>Chkbox 3</label>
+    <label for="cb3" class="" aria-hidden="true">Chkbox 3</label>
 </div>
diff --git a/hl-partials/radio.html b/hl-partials/radio.html
@@ -1,17 +1,17 @@
 <!--Checked Radio -->
 <div class="ampstart-input ampstart-input-radio inline-block relative m0 p0 mb3 ">
   <input type="radio" value="1" name="rb" id="rb1" class="relative" checked>
-  <label for="rb1" class="" aria-hidden>Radio 1</label>
+  <label for="rb1" class="" aria-hidden="true">Radio 1</label>
 </div>
 
 <!--Un-checked Radio -->
 <div class="ampstart-input ampstart-input-radio inline-block relative m0 p0 mb3 ">
   <input type="radio" value="2" name="rb" id="rb2" class="relative">
-  <label for="rb2" class="" aria-hidden>Radio 2</label>
+  <label for="rb2" class="" aria-hidden="true">Radio 2</label>
 </div>
 
 <!--Disabled Radio -->
 <div class="ampstart-input ampstart-input-radio inline-block relative m0 p0 mb3 ">
   <input type="radio" value="3" name="rb" id="rb3" class="relative" disabled>
-  <label for="rb3" class="" aria-hidden>Radio 3</label>
+  <label for="rb3" class="" aria-hidden="true">Radio 3</label>
 </div>
diff --git a/hl-partials/rangeinputs.html b/hl-partials/rangeinputs.html
@@ -1,7 +1,7 @@
 <!-- Range Input -->
 <div class="ampstart-input inline-block relative m0 p0 mb3 ">
   <input type="range" value="" name="name11" id="ip11" class="block border-none p0 m0" placeholder="Select a range">
-  <label for="ip11" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden>
+  <label for="ip11" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden="true">
     Select a range
   </label>
 </div>
@@ -10,7 +10,7 @@
 <!-- Disabled Range Input -->
 <div class="ampstart-input inline-block relative m0 p0 mb3 ">
   <input type="range" value="" name="name11" id="ip11a" class="block border-none p0 m0" placeholder="Select a range" disabled>
-  <label for="ip11a" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden>
+  <label for="ip11a" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden="true">
     Select a range
   </label>
 </div>

diff --git a/hl-partials/select.html b/hl-partials/select.html
@@ -6,7 +6,7 @@
       <option value="">Lemon</option>
       <option value="">Grape</option>
   </select>
-  <label for="ip12" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden>
+  <label for="ip12" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden="true">
     Select a fruit
   </label>
 </div>
@@ -20,7 +20,7 @@
       <option value="">Lemon</option>
       <option value="">Grape</option>
   </select>
-  <label for="ip12a" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden>
+  <label for="ip12a" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden="true">
     Select a fruit
   </label>
 </div>

diff --git a/hl-partials/textarea.html b/hl-partials/textarea.html
@@ -1,7 +1,7 @@
 <!-- Textarea -->
 <div class="ampstart-input inline-block relative m0 p0 mb3 ">
   <textarea name="name13" id="ip13" class="block border-none  p0 m0" rows="5"></textarea>
-  <label for="ip13" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden>
+  <label for="ip13" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden="true">
     Write your story
   </label>
 </div>
@@ -10,7 +10,7 @@
 <!-- Disabled Textarea -->
 <div class="ampstart-input inline-block relative m0 p0 mb3 ">
   <textarea name="name13" id="ip13a" class="block border-none  p0 m0" rows="5" disabled=""></textarea>
-  <label for="ip13a" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden>
+  <label for="ip13a" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden="true">
     This input is disabled
   </label>
 </div>

diff --git a/hl-partials/textbox.html b/hl-partials/textbox.html
@@ -1,7 +1,7 @@
 <!-- Text Input -->
 <div class="ampstart-input inline-block relative m0 p0 mb3 ">
   <input type="text" value="" name="name1" id="ip1" class="block border-none p0 m0" placeholder="Enter your Name">
-  <label for="ip1" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden>
+  <label for="ip1" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden="true">
     Enter your Name
   </label>
 </div>
@@ -10,20 +10,20 @@
 <!-- Text Input with value -->
 <div class="ampstart-input inline-block relative m0 p0 mb3 ">
   <input type="text" value="John Smith" name="name1" id="ip1" class="block border-none p0 m0" placeholder="Enter your Name">
-  <label for="ip1" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden>Enter your Name</label>
+  <label for="ip1" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden="true">Enter your Name</label>
 </div>
 <!-- End Input-->
 
 <!-- Disabled text Input -->
 <div class="ampstart-input inline-block relative m0 p0 mb3 ">
   <input type="text" value="" name="name1" id="ip1" class="block border-none p0 m0" placeholder="This input is Disabled" disabled="">
-  <label for="ip1" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden>This input is Disabled</label>
+  <label for="ip1" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden="true">This input is Disabled</label>
 </div>
 <!-- End Input-->
 
 <!-- Date Input -->
 <div class="ampstart-input inline-block relative m0 p0 mb3">
   <input type="date" value="2020-10-10" name="name4" id="ip4" class="block border-none p0 m0" placeholder="Date of Expiry">
-  <label for="ip4" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden>Date of Expiry</label>
+  <label for="ip4" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden="true">Date of Expiry</label>
 </div>
 <!-- End Input-->
diff --git a/templates/test-all/test-all.amp.html b/templates/test-all/test-all.amp.html
@@ -693,7 +693,7 @@ <h4 class="ampstart-caption">Caption text</h4>
   <!-- Date Input -->
   <div class="ampstart-input inline-block relative m0 p0 mb3 ">
     <input type="date" value="2020-10-10" name="name4" id="ip4" class="block border-none p0 m0" placeholder="Date of Expiry">
-    <label for="ip4" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden>Date of Expiry</label>
+    <label for="ip4" class="absolute top-0 right-0 bottom-0 left-0" aria-hidden="true">Date of Expiry</label>
   </div>
   <!-- End Input-->