diff --git a/app/javascript/mastodon/components/status_action_bar.jsx b/app/javascript/mastodon/components/status_action_bar.jsx index f0b6c389b0..965d2ceb6a 100644 --- a/app/javascript/mastodon/components/status_action_bar.jsx +++ b/app/javascript/mastodon/components/status_action_bar.jsx @@ -468,11 +468,12 @@ class StatusActionBar extends ImmutablePureComponent { const mutual = emojiReactionPolicy !== 'mutuals_only' || (relationship && relationship.get('following') && relationship.get('followed_by')); const outside = emojiReactionPolicy !== 'outside_only' || (relationship && (relationship.get('following') || relationship.get('followed_by'))); const denyFromAll = emojiReactionPolicy !== 'block' && emojiReactionPolicy !== 'block'; - const emojiPickerButton = ( - - ); - const emojiPickerDropdown = enableEmojiReaction && emojiReactionAvailableServer && denyFromAll && (writtenByMe || (following && followed && mutual && outside)) && ( - + const emojiPickerDropdown = (enableEmojiReaction && emojiReactionAvailableServer && denyFromAll && (writtenByMe || (following && followed && mutual && outside)) && ( + + )} /> + )) || ( +
); const isReply = status.get('in_reply_to_account_id') === status.getIn(['account', 'id']); diff --git a/app/javascript/mastodon/features/status/components/action_bar.jsx b/app/javascript/mastodon/features/status/components/action_bar.jsx index 332606d745..154b765384 100644 --- a/app/javascript/mastodon/features/status/components/action_bar.jsx +++ b/app/javascript/mastodon/features/status/components/action_bar.jsx @@ -376,11 +376,14 @@ class ActionBar extends PureComponent { const mutual = emojiReactionPolicy !== 'mutuals_only' || (relationship && relationship.get('following') && relationship.get('followed_by')); const outside = emojiReactionPolicy !== 'outside_only' || (relationship && (relationship.get('following') || relationship.get('followed_by'))); const denyFromAll = emojiReactionPolicy !== 'block' && emojiReactionPolicy !== 'block'; - const emojiPickerButton = ( - - ); - const emojiPickerDropdown = enableEmojiReaction && emojiReactionAvailableServer && denyFromAll && (writtenByMe || (following && followed && mutual && outside)) && ( -
+ const emojiPickerDropdown = (enableEmojiReaction && emojiReactionAvailableServer && denyFromAll && (writtenByMe || (following && followed && mutual && outside)) && ( +
+ + )} /> +
+ )) || ( +
); return ( diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss index 512a756d71..a80e39cf04 100644 --- a/app/javascript/styles/mastodon/components.scss +++ b/app/javascript/styles/mastodon/components.scss @@ -1388,6 +1388,10 @@ body > [data-popper-placement] { align-items: center; gap: 18px; margin-top: 16px; + + &__button__blank { + width: 24px; + } } .detailed-status__action-bar-dropdown { @@ -1442,6 +1446,11 @@ body > [data-popper-placement] { padding: 0; margin-bottom: 16px; } + + &__button__blank { + width: 24px; + flex: 1 1 auto; + } } .scrollable > div:first-child .detailed-status {