Add boost visibility icon
This commit is contained in:
parent
91675c947e
commit
e1c54c9201
4 changed files with 19 additions and 11 deletions
|
@ -392,6 +392,15 @@ class Status extends ImmutablePureComponent {
|
||||||
openMedia: this.handleHotkeyOpenMedia,
|
openMedia: this.handleHotkeyOpenMedia,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const visibilityIconInfo = {
|
||||||
|
'public': { icon: 'globe', text: intl.formatMessage(messages.public_short) },
|
||||||
|
'unlisted': { icon: 'unlock', text: intl.formatMessage(messages.unlisted_short) },
|
||||||
|
'private': { icon: 'lock', text: intl.formatMessage(messages.private_short) },
|
||||||
|
'mutual': { icon: 'exchange', text: intl.formatMessage(messages.mutual_short) },
|
||||||
|
'limited': { icon: 'user-circle', text: intl.formatMessage(messages.limited_short) },
|
||||||
|
'direct': { icon: 'envelope', text: intl.formatMessage(messages.direct_short) },
|
||||||
|
};
|
||||||
|
|
||||||
if (hidden) {
|
if (hidden) {
|
||||||
return (
|
return (
|
||||||
<HotKeys handlers={handlers}>
|
<HotKeys handlers={handlers}>
|
||||||
|
@ -427,11 +436,14 @@ class Status extends ImmutablePureComponent {
|
||||||
);
|
);
|
||||||
} else if (status.get('reblog', null) !== null && typeof status.get('reblog') === 'object') {
|
} else if (status.get('reblog', null) !== null && typeof status.get('reblog') === 'object') {
|
||||||
const display_name_html = { __html: status.getIn(['account', 'display_name_html']) };
|
const display_name_html = { __html: status.getIn(['account', 'display_name_html']) };
|
||||||
|
const visibilityReblogIcon = visibilityIconInfo[status.get('visibility')];
|
||||||
|
const visibilityReblogLink = <Icon id={visibilityReblogIcon.icon} className='status__prepend-icon' title={visibilityReblogIcon.text} />;
|
||||||
|
|
||||||
prepend = (
|
prepend = (
|
||||||
<div className='status__prepend'>
|
<div className='status__prepend'>
|
||||||
<div className='status__prepend-icon-wrapper'><Icon id='retweet' className='status__prepend-icon' fixedWidth /></div>
|
<div className='status__prepend-icon-wrapper'><Icon id='retweet' className='status__prepend-icon' fixedWidth /></div>
|
||||||
<FormattedMessage id='status.reblogged_by' defaultMessage='{name} boosted' values={{ name: <a onClick={this.handleAccountClick} data-id={status.getIn(['account', 'id'])} data-group={status.getIn(['account', 'group'])} href={status.getIn(['account', 'url'])} className='status__display-name muted'><bdi><strong dangerouslySetInnerHTML={display_name_html} /></bdi></a> }} />
|
<FormattedMessage id='status.reblogged_by' defaultMessage='{name} boosted' values={{ name: <a onClick={this.handleAccountClick} data-id={status.getIn(['account', 'id'])} data-group={status.getIn(['account', 'group'])} href={status.getIn(['account', 'url'])} className='status__display-name muted'><bdi><strong dangerouslySetInnerHTML={display_name_html} /></bdi></a> }} />
|
||||||
|
{visibilityReblogLink}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
@ -537,15 +549,6 @@ class Status extends ImmutablePureComponent {
|
||||||
statusAvatar = <AvatarOverlay account={status.get('account')} friend={account} />;
|
statusAvatar = <AvatarOverlay account={status.get('account')} friend={account} />;
|
||||||
}
|
}
|
||||||
|
|
||||||
const visibilityIconInfo = {
|
|
||||||
'public': { icon: 'globe', text: intl.formatMessage(messages.public_short) },
|
|
||||||
'unlisted': { icon: 'unlock', text: intl.formatMessage(messages.unlisted_short) },
|
|
||||||
'private': { icon: 'lock', text: intl.formatMessage(messages.private_short) },
|
|
||||||
'mutual': { icon: 'exchange', text: intl.formatMessage(messages.mutual_short) },
|
|
||||||
'limited': { icon: 'user-circle', text: intl.formatMessage(messages.limited_short) },
|
|
||||||
'direct': { icon: 'envelope', text: intl.formatMessage(messages.direct_short) },
|
|
||||||
};
|
|
||||||
|
|
||||||
const visibilityIcon = visibilityIconInfo[status.get('visibility')];
|
const visibilityIcon = visibilityIconInfo[status.get('visibility')];
|
||||||
const visibilityLink = <Icon id={visibilityIcon.icon} title={visibilityIcon.text} />;
|
const visibilityLink = <Icon id={visibilityIcon.icon} title={visibilityIcon.text} />;
|
||||||
|
|
||||||
|
|
|
@ -1274,9 +1274,9 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
> span {
|
> span {
|
||||||
display: block;
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
|
margin-right: 4px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -158,6 +158,10 @@ body.rtl {
|
||||||
.status__prepend {
|
.status__prepend {
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
margin-right: 68px;
|
margin-right: 68px;
|
||||||
|
|
||||||
|
> span {
|
||||||
|
margin-left: 4px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.status__prepend-icon-wrapper {
|
.status__prepend-icon-wrapper {
|
||||||
|
|
|
@ -31,6 +31,7 @@
|
||||||
%bdi
|
%bdi
|
||||||
%strong.emojify= display_name(status.account, custom_emojify: true)
|
%strong.emojify= display_name(status.account, custom_emojify: true)
|
||||||
= t('stream_entries.reblogged')
|
= t('stream_entries.reblogged')
|
||||||
|
= visibility_icon status
|
||||||
- elsif pinned
|
- elsif pinned
|
||||||
.status__prepend
|
.status__prepend
|
||||||
.status__prepend-icon-wrapper
|
.status__prepend-icon-wrapper
|
||||||
|
|
Loading…
Reference in a new issue