Accessibility fixes:
- changed buttons to spans since not being used in forms
- added aria roles to html elements
- changed low contrast colors
Change-Id: I56e784b226baa7f9b24346446a0a023fcea633d4
Signed-off-by: Michael Davis <michael.s.davis@ibm.com>
diff --git a/app/common/directives/confirm.html b/app/common/directives/confirm.html
index a38cf60..aade7dd 100644
--- a/app/common/directives/confirm.html
+++ b/app/common/directives/confirm.html
@@ -5,6 +5,6 @@
</div>
<div class="inline__confirm-buttons">
<button class="btn-primary" ng-click="accept()">Yes</button>
- <button class="btn-primary" ng-click="cancel()">No</button>
+ <button class="btn-primary default" ng-click="cancel()">No</button>
</div>
</div>
\ No newline at end of file
diff --git a/app/common/directives/log-event.html b/app/common/directives/log-event.html
index addb098..08efcf1 100644
--- a/app/common/directives/log-event.html
+++ b/app/common/directives/log-event.html
@@ -15,7 +15,7 @@
<label class="control-check">
<input type="checkbox" name="events__check" ng-click="event.selected= ! event.selected"
ng-checked="event.selected"/>
- <span class="control__indicator"></span>
+ <span class="control__indicator accessible-text">select log event</span>
</label>
</div>
<div class="column small-9 large-10 event-log__event-info"
@@ -29,8 +29,8 @@
<p class="inline event__description">{{event.Severity}}</p>
</div>
<div class="column small-1 large-1">
- <button class="accord-trigger" ng-class="{'active': event.meta}"
- ng-click="event.meta = ! event.meta"></button>
+ <span class="button accord-trigger" ng-class="{'active': event.meta}"
+ ng-click="event.meta = ! event.meta"></span>
</div>
</div>
<div class="row event__metadata-row" ng-class="{'active': event.meta}">
diff --git a/app/common/directives/log-filter.html b/app/common/directives/log-filter.html
index 38ca2e0..eac263f 100644
--- a/app/common/directives/log-filter.html
+++ b/app/common/directives/log-filter.html
@@ -1,4 +1,4 @@
-<section id="event-filter" class="row column">
+<section id="event-filter" class="row column" aria-label="event log filtering">
<div class="inline event__severity-filter">
<p class="filter-label">Filter by severity</p>
<button class="inline first" ng-click="toggleSeverityAll()"