merge in timepicker.html changes from - Improve accessibility of the …

…Datepicker. (elastic#11753)
nreese · Jun 2, 2017 · 08cb009 · 08cb009
1 parent 75f3552
commit 08cb009
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 9 deletions.
diff --git a/src/ui/public/timepicker/absolute_panel/kbn_timepicker_absolute_panel.html b/src/ui/public/timepicker/absolute_panel/kbn_timepicker_absolute_panel.html
@@ -1,8 +1,14 @@
 <form name="absoluteTime" ng-submit="applyAbsolute()">
   <div class="kbn-timepicker-section">
     <div>
-      <label class="small">From: <span ng-show="!absolute.from"><i>Invalid Date</i></span>
-        <a class="label label-default" ng-click="setToNow({key:'from'})">Set To Now</a>
+      <label class="small">From: <span ng-show="!absolute.from"><em>Invalid Date</em></span>
+        <a
+          class="label label-default"
+          ng-click="setToNow({key:'from'})"
+          kbn-accessible-click
+        >
+          Set To Now
+        </a>
       </label>
       <input type="text" required class="form-control" input-datetime="{{format}}" ng-model="absolute.from">
     </div>
@@ -14,9 +20,15 @@
   <div class="kbn-timepicker-section">
     <div>
       <label class="small">To:
-        <a class="label label-default" ng-click="setToNow({key:'to'})">Set To Now</a>
+        <a
+          class="label label-default"
+          ng-click="setToNow({key:'to'})"
+          kbn-accessible-click
+        >
+          Set To Now
+        </a>
       </label>
-      <span ng-show="!absolute.to"><i>Invalid Date</i></span>
+      <span ng-show="!absolute.to"><em>Invalid Date</em></span>
       <input type="text" required class="form-control" input-datetime="{{format}}" ng-model="absolute.to">
     </div>
     <div>

diff --git a/src/ui/public/timepicker/quick_panel/kbn_timepicker_quick_panel.html b/src/ui/public/timepicker/quick_panel/kbn_timepicker_quick_panel.html
@@ -2,7 +2,11 @@
   <div ng-repeat="list in quickLists" class="kbn-timepicker-section">
     <ul class="list-unstyled">
       <li ng-repeat="option in list">
-        <a ng-click="setQuick({from: option.from, to: option.to})" ng-bind="::option.display"></a>
+        <a
+          ng-click="setQuick({from: option.from, to: option.to})"
+          ng-bind="::option.display"
+          kbn-accessible-click
+        ></a>
       </li>
     </ul>
   </div>

diff --git a/src/ui/public/timepicker/relative_panel/kbn_timepicker_relative_panel.html b/src/ui/public/timepicker/relative_panel/kbn_timepicker_relative_panel.html
@@ -3,8 +3,14 @@
     <label>
       From:
       <span ng-show="relative.from.preview">{{relative.from.preview}}</span>
-      <a class="label label-default" ng-click="setRelativeToNow({key:'from'})">Set To Now</a>
-      <span ng-hide="relative.from.preview"><i>Invalid Expression</i></span>
+      <a
+        class="label label-default"
+        ng-click="setRelativeToNow({key:'from'})"
+        kbn-accessible-click
+      >
+        Set To Now
+      </a>
+      <span ng-hide="relative.from.preview"><em>Invalid Expression</em></span>
     </label>
     <br>
     <div class="form-group" ng-class="{ 'has-error': checkRelative() }">
@@ -47,8 +53,14 @@
     <label>
       To:
       <span ng-show="relative.to.preview">{{relative.to.preview}}</span>
-      <a class="label label-default" ng-click="setRelativeToNow({key:'to'})">Set To Now</a>
-      <span ng-hide="relative.to.preview"><i>Invalid Expression</i></span>
+      <a
+        class="label label-default"
+        ng-click="setRelativeToNow({key:'to'})"
+        kbn-accessible-click
+      >
+        Set To Now
+      </a>
+      <span ng-hide="relative.to.preview"><em>Invalid Expression</em></span>
     </label>
     <br>
     <div class="form-group" ng-class="{ 'has-error': checkRelative() }">