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;