d5e197e6ea
Ine464e69I removed href='#' but I noticed that it broke some things. Readding href serves two purposes: - it makes links reachable with Tab key - it makes links clickable with Enter key The alternative to this approach was to introduce [tabindex] and [role] attributes. But not only using tabindex=0 with <a/> is questionable, it'd require adding a keyboard handler that'd intercept space and return key presses and simulated link clicks. Since it's best to leave this kind of thing to the native UI, I went with readding hrefs instead. I believe that hash hrefs, even though being a common practice, are silly, so I decided to settle down with empty hrefs. As a bonus, I added a snippet that prevents middle mouse clicks from opening such links/buttons in new tabs, which was the motivation fore464e69.
49 lines
1.7 KiB
Smarty
49 lines
1.7 KiB
Smarty
<div class='comment'>
|
|
<div class='avatar'>
|
|
<% if (ctx.comment.user && ctx.comment.user.name && ctx.canViewUsers) { %>
|
|
<a href='/user/<%- encodeURIComponent(ctx.comment.user.name) %>'>
|
|
<% } %>
|
|
|
|
<%= ctx.makeThumbnail(ctx.comment.user ? ctx.comment.user.avatarUrl : null) %>
|
|
|
|
<% if (ctx.comment.user && ctx.comment.user.name && ctx.canViewUsers) { %>
|
|
</a>
|
|
<% } %>
|
|
</div>
|
|
|
|
<div class='body'>
|
|
<header><!--
|
|
--><span class='nickname'><!--
|
|
--><% if (ctx.comment.user && ctx.comment.user.name && ctx.canViewUsers) { %><!--
|
|
--><a href='/user/<%- encodeURIComponent(ctx.comment.user.name) %>'><!--
|
|
--><% } %><!--
|
|
|
|
--><%- ctx.comment.user ? ctx.comment.user.name : 'Deleted user' %><!--
|
|
|
|
--><% if (ctx.comment.user && ctx.comment.user.name && ctx.canViewUsers) { %><!--
|
|
--></a><!--
|
|
--><% } %><!--
|
|
--></span><!--
|
|
|
|
--><span class='date'><!--
|
|
--><%= ctx.makeRelativeTime(ctx.comment.creationTime) %><!--
|
|
--></span><!--
|
|
|
|
--><span class='score-container'></span><!--
|
|
|
|
--><% if (ctx.canEditComment) { %><!--
|
|
--><a href class='edit'><!--
|
|
--><i class='fa fa-pencil'></i> edit<!--
|
|
--></a><!--
|
|
--><% } %><!--
|
|
|
|
--><% if (ctx.canDeleteComment) { %><!--
|
|
--><a href class='delete'><!--
|
|
--><i class='fa fa-remove'></i> delete<!--
|
|
--></a><!--
|
|
--><% } %><!--
|
|
--></header>
|
|
|
|
<div class='comment-form-container'></div>
|
|
</div>
|
|
</div>
|