Fix: 絵文字リアクションボタンが右にずれる問題

This commit is contained in:
KMY 2024-10-01 12:09:15 +09:00
parent 429469b1ca
commit a877e6486d
2 changed files with 10 additions and 8 deletions

View file

@ -484,11 +484,13 @@ class StatusActionBar extends ImmutablePureComponent {
const outside = emojiReactionPolicy !== 'outside_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 denyFromAll = emojiReactionPolicy !== 'block' && emojiReactionPolicy !== 'block';
const emojiPickerDropdown = (enableEmojiReaction && emojiReactionAvailableServer && denyFromAll && (writtenByMe || (following && followed && mutual && outside)) && ( const emojiPickerDropdown = (enableEmojiReaction && emojiReactionAvailableServer && denyFromAll && (writtenByMe || (following && followed && mutual && outside)) && (
<EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={( <div className='status__action-bar__button-wrapper'>
<IconButton className='status__action-bar__button' icon='smile-o' iconComponent={EmojiReactionIcon} onClick={this.handleEmojiPickInnerButton} /> <EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={(
)} /> <IconButton icon='smile-o' iconComponent={EmojiReactionIcon} onClick={this.handleEmojiPickInnerButton} />
)} />
</div>
)) || (enableEmojiReaction && ( )) || (enableEmojiReaction && (
<div className='status__action-bar__button__blank' /> <div className='status__action-bar__button-wrapper status__action-bar__button-wrapper__blank' />
)) || null; )) || null;
const isReply = status.get('in_reply_to_account_id') === status.getIn(['account', 'id']); const isReply = status.get('in_reply_to_account_id') === status.getIn(['account', 'id']);

View file

@ -1524,6 +1524,10 @@ body > [data-popper-placement] {
&:last-child { &:last-child {
flex-grow: 0; flex-grow: 0;
} }
&__blank {
width: 24px;
}
} }
&--first-in-thread { &--first-in-thread {
@ -1767,10 +1771,6 @@ body > [data-popper-placement] {
align-items: center; align-items: center;
gap: 18px; gap: 18px;
margin-top: 16px; margin-top: 16px;
&__button__blank {
width: 24px;
}
} }
.detailed-status__action-bar-dropdown { .detailed-status__action-bar-dropdown {