summaryrefslogtreecommitdiff
path: root/plugins/acl/skins
diff options
context:
space:
mode:
authorAleksander Machniak <alec@alec.pl>2014-06-10 14:40:22 +0200
committerAleksander Machniak <alec@alec.pl>2014-06-10 14:40:22 +0200
commit62c45161c4efd101b940134b60bb73881746e5f5 (patch)
tree116b59d64be9d11a9589f06a721aca635242f241 /plugins/acl/skins
parente4c179975219530d22e330ef7129a8eb5fa286e9 (diff)
ACL: Improved UI accessibility
Diffstat (limited to 'plugins/acl/skins')
-rw-r--r--plugins/acl/skins/larry/acl.css17
-rw-r--r--plugins/acl/skins/larry/templates/table.html21
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="&#9881;" />
+ <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="&#9881;" 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>