changeset 5950:c1af4d89a737

style: use some ARIA accessibility markup Use markup from Web Accessibility Initiative - it is default in Bootstrap examples and "comes for free" but is currently not used, complete, or tested. See https://en.wikipedia.org/wiki/WAI-ARIA and https://www.w3.org/WAI/GL/wiki/Using_ARIA_menus .
author Andrew Shadura <andrew@shadura.me>
date Fri, 27 May 2016 11:43:17 +0200
parents 3578484a86d2
children 060ffe6dd700
files kallithea/templates/base/base.html
diffstat 1 files changed, 10 insertions(+), 10 deletions(-) [+]
line wrap: on
line diff
--- a/kallithea/templates/base/base.html	Fri May 27 11:43:17 2016 +0200
+++ b/kallithea/templates/base/base.html	Fri May 27 11:43:17 2016 +0200
@@ -55,7 +55,7 @@
 </%def>
 
 <%def name="admin_menu()">
-  <ul class="dropdown-menu">
+  <ul class="dropdown-menu" role="menu">
       <li><a href="${h.url('admin_home')}"><i class="icon-book"></i> ${_('Admin Journal')}</a></li>
       <li><a href="${h.url('repos')}"><i class="icon-database"></i> ${_('Repositories')}</a></li>
       <li><a href="${h.url('repos_groups')}"><i class="icon-folder"></i> ${_('Repository Groups')}</a></li>
@@ -72,7 +72,7 @@
 
 ## admin menu used for people that have some admin resources
 <%def name="admin_menu_simple(repositories=None, repository_groups=None, user_groups=None)">
-  <ul class="dropdown-menu">
+  <ul class="dropdown-menu" role="menu">
    %if repositories:
       <li><a href="${h.url('repos')}"><i class="icon-database"></i> ${_('Repositories')}</a></li>
    %endif
@@ -139,11 +139,11 @@
         </li>
         <li ${is_current('options')} data-context="options">
              %if h.HasRepoPermissionAll('repository.admin')(c.repo_name):
-               <a href="${h.url('edit_repo',repo_name=c.repo_name)}" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-wrench"></i> ${_('Options')} <i class="caret"></i></a>
+               <a href="${h.url('edit_repo',repo_name=c.repo_name)}" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"><i class="icon-wrench"></i> ${_('Options')} <i class="caret"></i></a>
              %else:
-               <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-wrench"></i> ${_('Options')} <i class="caret"></i></a>
+               <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"><i class="icon-wrench"></i> ${_('Options')} <i class="caret"></i></a>
              %endif
-          <ul class="dropdown-menu">
+          <ul class="dropdown-menu" role="menu">
              %if h.HasRepoPermissionAll('repository.admin')(c.repo_name):
                    <li><a href="${h.url('edit_repo',repo_name=c.repo_name)}"><i class="icon-gear"></i> ${_('Settings')}</a></li>
              %endif
@@ -314,10 +314,10 @@
       </li>
     %endif
       <li ${is_current('gists')} class="dropdown">
-        <a class="menu_link dropdown-toggle" data-toggle="dropdown" title="${_('Show public gists')}"  href="${h.url('gists')}">
+        <a class="menu_link dropdown-toggle" data-toggle="dropdown" role="button" title="${_('Show public gists')}"  href="${h.url('gists')}">
           <i class="icon-clippy"></i> ${_('Gists')} <span class="caret"></span>
         </a>
-          <ul class="dropdown-menu">
+          <ul class="dropdown-menu" role="menu">
             <li><a href="${h.url('new_gist', public=1)}"><i class="icon-paste"></i> ${_('Create New Gist')}</a></li>
             <li><a href="${h.url('gists')}"><i class="icon-globe"></i> ${_('All Public Gists')}</a></li>
             %if c.authuser.username != 'default':
@@ -333,14 +333,14 @@
     </li>
     % if h.HasPermissionAll('hg.admin')('access admin main page'):
       <li ${is_current('admin')} class="dropdown">
-        <a class="menu_link dropdown-toggle" data-toggle="dropdown" title="${_('Admin')}" href="${h.url('admin_home')}">
+        <a class="menu_link dropdown-toggle" data-toggle="dropdown" role="button" title="${_('Admin')}" href="${h.url('admin_home')}">
           <i class="icon-gear"></i> ${_('Admin')} <span class="caret"></span>
         </a>
         ${admin_menu()}
       </li>
     % elif c.authuser.repositories_admin or c.authuser.repository_groups_admin or c.authuser.user_groups_admin:
     <li ${is_current('admin')} class="dropdown">
-        <a class="menu_link dropdown-toggle" data-toggle="dropdown" title="${_('Admin')}">
+        <a class="menu_link dropdown-toggle" data-toggle="dropdown" role="button" title="${_('Admin')}">
           <i class="icon-gear"></i> ${_('Admin')}
         </a>
         ${admin_menu_simple(c.authuser.repositories_admin,
@@ -360,7 +360,7 @@
 
     ## USER MENU
     <li class="dropdown">
-      <a class="menu_link dropdown-toggle" data-toggle="dropdown" id="quick_login_link"
+      <a class="menu_link dropdown-toggle" data-toggle="dropdown" role="button" id="quick_login_link"
         %if c.authuser.username != 'default':
           href="${h.url('notifications')}"
         %endif