Improve accessibility of Contacts menu
Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
This commit is contained in:
parent
2cd467f3f0
commit
61f10b27bc
|
@ -26,6 +26,7 @@
|
|||
'use strict';
|
||||
|
||||
var MENU_TEMPLATE = ''
|
||||
+ '<label class="hidden-visually" for="contactsmenu-search">' + t('core', 'Search contacts …') + '</label>'
|
||||
+ '<input id="contactsmenu-search" type="search" placeholder="' + t('core', 'Search contacts …') + '" value="{{searchTerm}}">'
|
||||
+ '<div class="content">'
|
||||
+ '</div>';
|
||||
|
@ -51,7 +52,7 @@
|
|||
var CONTACT_TEMPLATE = ''
|
||||
+ '{{#if contact.avatar}}'
|
||||
+ '<img src="{{contact.avatar}}&size=32" class="avatar"'
|
||||
+ 'srcset="{{contact.avatar}}&size=32 1x, {{contact.avatar}}&size=64 2x, {{contact.avatar}}&size=128 4x">'
|
||||
+ 'srcset="{{contact.avatar}}&size=32 1x, {{contact.avatar}}&size=64 2x, {{contact.avatar}}&size=128 4x" alt="">'
|
||||
+ '{{else}}'
|
||||
+ '<div class="avatar"></div>'
|
||||
+ '{{/if}}'
|
||||
|
@ -61,12 +62,12 @@
|
|||
+ '</div>'
|
||||
+ '{{#if contact.topAction}}'
|
||||
+ '<a class="top-action" href="{{contact.topAction.hyperlink}}" title="{{contact.topAction.title}}">'
|
||||
+ ' <img src="{{contact.topAction.icon}}">'
|
||||
+ ' <img src="{{contact.topAction.icon}}" alt="{{contact.topAction.title}}">'
|
||||
+ '</a>'
|
||||
+ '{{/if}}'
|
||||
+ '{{#if contact.hasTwoActions}}'
|
||||
+ '<a class="second-action" href="{{contact.secondAction.hyperlink}}" title="{{contact.secondAction.title}}">'
|
||||
+ ' <img src="{{contact.secondAction.icon}}">'
|
||||
+ ' <img src="{{contact.secondAction.icon}}" alt="{{contact.secondAction.title}}">'
|
||||
+ '</a>'
|
||||
+ '{{/if}}'
|
||||
+ '{{#if contact.hasManyActions}}'
|
||||
|
@ -76,7 +77,7 @@
|
|||
+ ' {{#each contact.actions}}'
|
||||
+ ' <li>'
|
||||
+ ' <a href="{{hyperlink}}">'
|
||||
+ ' <img src="{{icon}}">'
|
||||
+ ' <img src="{{icon}}" alt="">'
|
||||
+ ' <span>{{title}}</span>'
|
||||
+ ' </a>'
|
||||
+ ' </li>'
|
||||
|
@ -224,7 +225,7 @@
|
|||
}));
|
||||
this.delegateEvents();
|
||||
|
||||
// Show placeholder iff no avatar is available (avatar is rendered as img, not div)
|
||||
// Show placeholder if no avatar is available (avatar is rendered as img, not div)
|
||||
this.$('div.avatar').imageplaceholder(this._model.get('fullName'));
|
||||
|
||||
// Show tooltip for top action
|
||||
|
|
Loading…
Reference in New Issue