1
0
mirror of https://github.com/flarum/core.git synced 2025-04-22 08:06:15 +02:00

chore: accessible avatar edit

This commit is contained in:
Sami Mazouz 2025-04-18 13:47:10 +01:00
parent 42904fee35
commit 540475f83f
No known key found for this signature in database
3 changed files with 7 additions and 3 deletions

View File

@ -42,9 +42,10 @@ export default class AvatarEditor extends Component {
return (
<div className={classList(['AvatarEditor', 'Dropdown', this.attrs.className, this.loading && 'loading', this.isDraggedOver && 'dragover'])}>
<Avatar user={user} loading="eager" />
<a
<button
className={user.avatarUrl() ? 'Dropdown-toggle' : 'Dropdown-toggle AvatarEditor--noAvatar'}
title={app.translator.trans('core.forum.user.avatar_upload_tooltip')}
ariaLabel={app.translator.trans('core.forum.user.avatar_upload_tooltip')}
data-toggle="dropdown"
onclick={this.quickUpload.bind(this)}
ondragover={this.enableDragover.bind(this)}
@ -60,7 +61,7 @@ export default class AvatarEditor extends Component {
) : (
<Icon name={'fas fa-plus-circle'} />
)}
</a>
</button>
<ul className="Dropdown-menu Menu">{listItems(this.controlItems().toArray())}</ul>
</div>
);

View File

@ -312,7 +312,7 @@ export default class DiscussionListItem<CustomAttrs extends IDiscussionListItemA
className="DiscussionListItem-count"
icon={showUnread ? [<Icon name={'fas fa-check _checkmark'} />, <Icon name={'fas fa-comment _comment'} />] : <Icon name={'far fa-comment'} />}
label={showUnread ? abbreviateNumber(discussion.unreadCount()) : abbreviateNumber(discussion.replyCount())}
a11yLabel={app.translator.trans(a11yKey, { count: discussion.unreadCount() })}
ariaLabel={app.translator.trans(a11yKey, { count: discussion.unreadCount() })}
onclick={showUnread ? this.markAsRead.bind(this) : undefined}
/>
);

View File

@ -15,6 +15,8 @@
inset: 0;
border-radius: 100%;
background: rgba(0, 0, 0, 0.6);
color: #fff;
cursor: pointer;
text-align: center;
text-decoration: none;
border: 0;
@ -23,6 +25,7 @@
opacity: 0.7;
}
&:hover .Dropdown-toggle,
.Dropdown-toggle:focus,
&.open .Dropdown-toggle,
&.loading .Dropdown-toggle,
&.dragover .Dropdown-toggle {