Reduce size of ellipsis icon
This commit is contained in:
parent
9657598d33
commit
6bae81a758
3 changed files with 19 additions and 15 deletions
|
@ -4,7 +4,7 @@ import { useHistory } from 'react-router-dom';
|
||||||
|
|
||||||
import { openModal } from 'soapbox/actions/modals';
|
import { openModal } from 'soapbox/actions/modals';
|
||||||
import RelativeTimestamp from 'soapbox/components/relative-timestamp';
|
import RelativeTimestamp from 'soapbox/components/relative-timestamp';
|
||||||
import { Avatar, HStack, Stack, Text } from 'soapbox/components/ui';
|
import { Avatar, HStack, IconButton, Stack, Text } from 'soapbox/components/ui';
|
||||||
import VerificationBadge from 'soapbox/components/verification-badge';
|
import VerificationBadge from 'soapbox/components/verification-badge';
|
||||||
import DropdownMenuContainer from 'soapbox/containers/dropdown-menu-container';
|
import DropdownMenuContainer from 'soapbox/containers/dropdown-menu-container';
|
||||||
import { useChatContext } from 'soapbox/contexts/chat-context';
|
import { useChatContext } from 'soapbox/contexts/chat-context';
|
||||||
|
@ -115,12 +115,14 @@ const ChatListItem: React.FC<IChatListItemInterface> = ({ chat, onClick }) => {
|
||||||
<HStack alignItems='center' space={2}>
|
<HStack alignItems='center' space={2}>
|
||||||
{features.chatsDelete && (
|
{features.chatsDelete && (
|
||||||
<div className='text-gray-600 hidden group-hover:block hover:text-gray-100'>
|
<div className='text-gray-600 hidden group-hover:block hover:text-gray-100'>
|
||||||
{/* TODO: fix nested buttons here */}
|
<DropdownMenuContainer items={menu}>
|
||||||
<DropdownMenuContainer
|
<IconButton
|
||||||
items={menu}
|
|
||||||
src={require('@tabler/icons/dots.svg')}
|
src={require('@tabler/icons/dots.svg')}
|
||||||
title='Settings'
|
title='Settings'
|
||||||
|
className='text-gray-600 dark:text-gray-600 hover:text-gray-700 dark:hover:text-gray-500'
|
||||||
|
iconClassName='w-4 h-4'
|
||||||
/>
|
/>
|
||||||
|
</DropdownMenuContainer>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
|
|
@ -63,8 +63,7 @@ const ChatList: React.FC<IChatList> = ({ onClickChat, useWindowScroll = false, s
|
||||||
<div className='px-2'>
|
<div className='px-2'>
|
||||||
<ChatListItem chat={chat} onClick={onClickChat} />
|
<ChatListItem chat={chat} onClick={onClickChat} />
|
||||||
</div>
|
</div>
|
||||||
)
|
)}
|
||||||
}
|
|
||||||
components={{
|
components={{
|
||||||
ScrollSeekPlaceholder: () => <PlaceholderChat />,
|
ScrollSeekPlaceholder: () => <PlaceholderChat />,
|
||||||
Footer: () => hasNextPage ? <Spinner withText={false} /> : null,
|
Footer: () => hasNextPage ? <Spinner withText={false} /> : null,
|
||||||
|
|
|
@ -8,7 +8,7 @@ import { Components, Virtuoso, VirtuosoHandle } from 'react-virtuoso';
|
||||||
|
|
||||||
import { openModal } from 'soapbox/actions/modals';
|
import { openModal } from 'soapbox/actions/modals';
|
||||||
import { initReport } from 'soapbox/actions/reports';
|
import { initReport } from 'soapbox/actions/reports';
|
||||||
import { Avatar, Button, Divider, HStack, Icon, Spinner, Stack, Text } from 'soapbox/components/ui';
|
import { Avatar, Button, Divider, HStack, Icon, IconButton, Spinner, Stack, Text } from 'soapbox/components/ui';
|
||||||
import DropdownMenuContainer from 'soapbox/containers/dropdown-menu-container';
|
import DropdownMenuContainer from 'soapbox/containers/dropdown-menu-container';
|
||||||
import emojify from 'soapbox/features/emoji/emoji';
|
import emojify from 'soapbox/features/emoji/emoji';
|
||||||
import PlaceholderChatMessage from 'soapbox/features/placeholder/components/placeholder-chat-message';
|
import PlaceholderChatMessage from 'soapbox/features/placeholder/components/placeholder-chat-message';
|
||||||
|
@ -286,11 +286,14 @@ const ChatMessageList: React.FC<IChatMessageList> = ({ chat }) => {
|
||||||
})}
|
})}
|
||||||
data-testid='chat-message-menu'
|
data-testid='chat-message-menu'
|
||||||
>
|
>
|
||||||
<DropdownMenuContainer
|
<DropdownMenuContainer items={menu}>
|
||||||
items={menu}
|
<IconButton
|
||||||
src={require('@tabler/icons/dots.svg')}
|
src={require('@tabler/icons/dots.svg')}
|
||||||
title={intl.formatMessage(messages.more)}
|
title={intl.formatMessage(messages.more)}
|
||||||
|
className='text-gray-600 dark:text-gray-600 hover:text-gray-700 dark:hover:text-gray-500'
|
||||||
|
iconClassName='w-4 h-4'
|
||||||
/>
|
/>
|
||||||
|
</DropdownMenuContainer>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue