Show avatar using "span" instead of "div"
Visually it makes no difference, but as the ".avatar" element is inside a "span" element it can not be a block element to be compliant with the HTML specification. Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
This commit is contained in:
parent
4173f9d588
commit
da75c7ff6d
|
@ -198,20 +198,20 @@
|
||||||
displayTpl: function (item) {
|
displayTpl: function (item) {
|
||||||
return '<li>'
|
return '<li>'
|
||||||
+ '<span class="avatar-name-wrapper">'
|
+ '<span class="avatar-name-wrapper">'
|
||||||
+ '<div class="avatar" '
|
+ '<span class="avatar" '
|
||||||
+ ' data-username="' + escapeHTML(item.id) + '"' // for avatars
|
+ ' data-username="' + escapeHTML(item.id) + '"' // for avatars
|
||||||
+ ' data-user="' + escapeHTML(item.id) + '"' // for contactsmenu
|
+ ' data-user="' + escapeHTML(item.id) + '"' // for contactsmenu
|
||||||
+ ' data-user-display-name="' + escapeHTML(item.label) + '"></div>'
|
+ ' data-user-display-name="' + escapeHTML(item.label) + '"></span>'
|
||||||
+ ' <strong>' + escapeHTML(item.label) + '</strong>'
|
+ ' <strong>' + escapeHTML(item.label) + '</strong>'
|
||||||
+ '</span></li>';
|
+ '</span></li>';
|
||||||
},
|
},
|
||||||
insertTpl: function (item) {
|
insertTpl: function (item) {
|
||||||
return ''
|
return ''
|
||||||
+ '<span class="avatar-name-wrapper">'
|
+ '<span class="avatar-name-wrapper">'
|
||||||
+ '<div class="avatar" '
|
+ '<span class="avatar" '
|
||||||
+ ' data-username="' + escapeHTML(item.id) + '"' // for avatars
|
+ ' data-username="' + escapeHTML(item.id) + '"' // for avatars
|
||||||
+ ' data-user="' + escapeHTML(item.id) + '"' // for contactsmenu
|
+ ' data-user="' + escapeHTML(item.id) + '"' // for contactsmenu
|
||||||
+ ' data-user-display-name="' + escapeHTML(item.label) + '"></div>'
|
+ ' data-user-display-name="' + escapeHTML(item.label) + '"></span>'
|
||||||
+ ' <strong>' + escapeHTML(item.label) + '</strong>'
|
+ ' <strong>' + escapeHTML(item.label) + '</strong>'
|
||||||
+ '</span>';
|
+ '</span>';
|
||||||
},
|
},
|
||||||
|
@ -224,7 +224,7 @@
|
||||||
// passing the whole comments form would re-apply and request
|
// passing the whole comments form would re-apply and request
|
||||||
// avatars from the server
|
// avatars from the server
|
||||||
$(je.target).find(
|
$(je.target).find(
|
||||||
'div[data-username="' + $el.find('[data-username]').data('username') + '"]'
|
'span[data-username="' + $el.find('[data-username]').data('username') + '"]'
|
||||||
).parent(),
|
).parent(),
|
||||||
editionMode
|
editionMode
|
||||||
);
|
);
|
||||||
|
@ -486,11 +486,11 @@
|
||||||
},
|
},
|
||||||
|
|
||||||
_composeHTMLMention: function(uid, displayName) {
|
_composeHTMLMention: function(uid, displayName) {
|
||||||
var avatar = '<div class="avatar" '
|
var avatar = '<span class="avatar" '
|
||||||
+ 'data-username="' + _.escape(uid) + '"'
|
+ 'data-username="' + _.escape(uid) + '"'
|
||||||
+ ' data-user="' + _.escape(uid) + '"'
|
+ ' data-user="' + _.escape(uid) + '"'
|
||||||
+ ' data-user-display-name="'
|
+ ' data-user-display-name="'
|
||||||
+ _.escape(displayName) + '"></div>';
|
+ _.escape(displayName) + '"></span>';
|
||||||
|
|
||||||
var isCurrentUser = (uid === OC.getCurrentUser().uid);
|
var isCurrentUser = (uid === OC.getCurrentUser().uid);
|
||||||
|
|
||||||
|
|
|
@ -309,7 +309,7 @@ describe('OCA.Comments.CommentsTabView tests', function() {
|
||||||
|
|
||||||
expect(createStub.calledOnce).toEqual(false);
|
expect(createStub.calledOnce).toEqual(false);
|
||||||
expect($newCommentForm.find('.message').html()).toContain('Mention to <span');
|
expect($newCommentForm.find('.message').html()).toContain('Mention to <span');
|
||||||
expect($newCommentForm.find('.message').html()).toContain('<div class="avatar"');
|
expect($newCommentForm.find('.message').html()).toContain('<span class="avatar"');
|
||||||
expect($newCommentForm.find('.message').html()).toContain('<strong>User Name</strong>');
|
expect($newCommentForm.find('.message').html()).toContain('<strong>User Name</strong>');
|
||||||
expect($newCommentForm.find('.message').text()).not.toContain('@');
|
expect($newCommentForm.find('.message').text()).not.toContain('@');
|
||||||
// In this case the default behaviour is prevented by the
|
// In this case the default behaviour is prevented by the
|
||||||
|
|
Loading…
Reference in New Issue