diff options
author | Aleksander Machniak <alec@alec.pl> | 2014-06-10 14:40:22 +0200 |
---|---|---|
committer | Aleksander Machniak <alec@alec.pl> | 2014-06-10 14:40:22 +0200 |
commit | 62c45161c4efd101b940134b60bb73881746e5f5 (patch) | |
tree | 116b59d64be9d11a9589f06a721aca635242f241 /plugins/acl/skins/larry | |
parent | e4c179975219530d22e330ef7129a8eb5fa286e9 (diff) |
ACL: Improved UI accessibility
Diffstat (limited to 'plugins/acl/skins/larry')
-rw-r--r-- | plugins/acl/skins/larry/acl.css | 17 | ||||
-rw-r--r-- | plugins/acl/skins/larry/templates/table.html | 21 |
2 files changed, 18 insertions, 20 deletions
diff --git a/plugins/acl/skins/larry/acl.css b/plugins/acl/skins/larry/acl.css index 96c1092a0..bd72b3c85 100644 --- a/plugins/acl/skins/larry/acl.css +++ b/plugins/acl/skins/larry/acl.css @@ -26,44 +26,39 @@ border: none; } +#acltable th, #acltable td { white-space: nowrap; text-align: center; } -#acltable thead tr td +#acltable thead tr th { - border-left: #BBD3DA dotted 1px; font-size: 11px; font-weight: bold; - width: auto; } #acltable tbody td { - border-bottom: #DDDDDD 1px solid; text-align: center; height: 16px; cursor: default; } -#acltable thead td.user +#acltable thead tr > .user { width: 30%; + border-left: none; } -#acltable.advanced thead td.user { - width: 25%; +#acltable.advanced thead tr > .user { + width: 25%; } #acltable tbody td.user { text-align: left; - overflow: hidden; - text-overflow: ellipsis; - -o-text-overflow: ellipsis; - border-left: none; } #acltable tbody td.partial diff --git a/plugins/acl/skins/larry/templates/table.html b/plugins/acl/skins/larry/templates/table.html index c0b8329c6..3f203e44d 100644 --- a/plugins/acl/skins/larry/templates/table.html +++ b/plugins/acl/skins/larry/templates/table.html @@ -1,23 +1,26 @@ <div id="aclcontainer" class="uibox listbox"> -<div id="acllist-content" class="scroller withfooter"> - <roundcube:object name="acltable" id="acltable" class="records-table" /> +<div id="acllist-content" class="scroller withfooter" aria-labelledby="aria-label-acltable"> + <h2 class="boxtitle" id="aria-label-acltable"><roundcube:label name="acl.ariasummaryacltable" /></h2> + <roundcube:object name="acltable" id="acltable" class="records-table" summary="acl.ariasummaryacltable" role="listbox" /> </div> <div id="acllist-footer" class="boxfooter"> - <roundcube:button command="acl-create" id="aclcreatelink" type="link" title="acl.newuser" class="listbutton add disabled" classAct="listbutton add" innerClass="inner" content="+" /><roundcube:button name="aclmenulink" id="aclmenulink" type="link" title="acl.actions" class="listbutton groupactions"onclick="UI.show_popup('aclmenu', undefined, {above:1});return false" innerClass="inner" content="⚙" /> + <roundcube:button command="acl-create" id="aclcreatelink" type="link" title="acl.newuser" class="listbutton add disabled" classAct="listbutton add" innerClass="inner" content="+" /><roundcube:button name="aclmenulink" id="aclmenulink" type="link" title="acl.actions" class="listbutton groupactions" onclick="return UI.toggle_popup('aclmenu', event)" innerClass="inner" content="⚙" aria-haspopup="true" aria-expanded="false" aria-owns="aclmenu-menu" /> </div> </div> -<div id="aclmenu" class="popupmenu"> - <ul class="toolbarmenu selectable iconized"> - <li><roundcube:button command="acl-edit" label="edit" class="icon" classAct="icon active" innerclass="icon edit" /></li> - <li><roundcube:button command="acl-delete" label="delete" class="icon" classAct="icon active" innerclass="icon delete" /></li> +<div id="aclmenu" class="popupmenu" aria-hidden="true" data-align="bottom"> + <h3 id="aria-label-aclactions" class="voice"><roundcube:label name="acl.arialabelaclactions" /></h3> + <ul id="aclmenu-menu" class="toolbarmenu selectable iconized" role="menu" aria-labelledby="aria-label-aclactions"> + <li role="menuitem"><roundcube:button command="acl-edit" label="edit" class="icon" classAct="icon active" innerclass="icon edit" /></li> + <li role="menuitem"><roundcube:button command="acl-delete" label="delete" class="icon" classAct="icon active" innerclass="icon delete" /></li> <roundcube:if condition="!in_array('acl_advanced_mode', (array)config:dont_override)" /> - <li><roundcube:button name="acl-switch" id="acl-switch" label="acl.advanced" onclick="rcmail.command('acl-mode-switch');return false" class="active" /></li> + <li role="menuitem"><roundcube:button name="acl-switch" id="acl-switch" label="acl.advanced" onclick="rcmail.command('acl-mode-switch');return false" class="active" /></li> <roundcube:endif /> </ul> </div> -<div id="aclform" class="propform" style="position:absolute; width:480px; top:0; left:0; padding:8px"> +<div id="aclform" class="propform" style="position:absolute; width:480px; top:0; left:0; padding:8px" aria-labelledby="aria-label-aclform" aria-hidden="true" role="dialog"> + <h3 id="aria-label-aclform" class="voice"><roundcube:label name="acl.arialabelaclform" /></h3> <fieldset class="thinbordered"><legend><roundcube:label name="acl.identifier" /></legend> <roundcube:object name="acluser" id="acluser" size="35" class="proplist" /> </fieldset> |