diff --git a/app/soapbox/features/status/components/action_bar.js b/app/soapbox/features/status/components/action_bar.js index d569bcf76..d82e6b952 100644 --- a/app/soapbox/features/status/components/action_bar.js +++ b/app/soapbox/features/status/components/action_bar.js @@ -365,26 +365,22 @@ class ActionBar extends React.PureComponent {
); - let replyIcon; - if (status.get('in_reply_to_id', null) === null) { - replyIcon = 'reply'; - } else { - replyIcon = 'reply-all'; + let reblogIcon = require('feather-icons/dist/icons/repeat.svg'); + + if (status.get('visibility') === 'direct') { + reblogIcon = require('@tabler/icons/icons/mail.svg'); + } else if (status.get('visibility') === 'private') { + reblogIcon = require('@tabler/icons/icons/lock.svg'); } - let reblogIcon = 'retweet'; - if (status.get('visibility') === 'direct') reblogIcon = 'envelope'; - else if (status.get('visibility') === 'private') reblogIcon = 'lock'; - const reblog_disabled = (status.get('visibility') === 'direct' || status.get('visibility') === 'private'); - return (
@@ -394,7 +390,7 @@ class ActionBar extends React.PureComponent { disabled={reblog_disabled} active={status.get('reblogged')} title={reblog_disabled ? intl.formatMessage(messages.cannot_reblog) : intl.formatMessage(messages.reblog)} - icon={reblogIcon} + src={reblogIcon} onClick={this.handleReblogClick} text={intl.formatMessage(messages.reblog)} /> @@ -416,7 +412,7 @@ class ActionBar extends React.PureComponent { animate active={Boolean(meEmojiReact)} title={meEmojiTitle} - icon='thumbs-up' + src={require('@tabler/icons/icons/thumb-up.svg')} emoji={meEmojiReact} text={meEmojiTitle} onClick={this.handleLikeButtonClick} diff --git a/app/styles/components/detailed-status.scss b/app/styles/components/detailed-status.scss index 3761bc91e..e057fffc5 100644 --- a/app/styles/components/detailed-status.scss +++ b/app/styles/components/detailed-status.scss @@ -88,7 +88,7 @@ .icon_button__text { font-size: 14px; - padding-left: 3px; + padding-left: 5px; } } diff --git a/app/styles/components/emoji-reacts.scss b/app/styles/components/emoji-reacts.scss index 5f347b045..aabcb684e 100644 --- a/app/styles/components/emoji-reacts.scss +++ b/app/styles/components/emoji-reacts.scss @@ -134,6 +134,17 @@ } } +.detailed-status__button { + .svg-icon { + width: 24px; + height: 20px; + } + + &--favourite .svg-icon { + height: 24px !important; + } +} + .detailed-status__wrapper .emoji-react-selector { bottom: 40px; right: 10px;