1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-10-22 03:12:42 +02:00

Fix #20184 - Prevent overflow within the activity list (#20188)

* Fix #20184 - Prevent overflow within the activity list

* removing inline style, updating snap

---------

Co-authored-by: Victor Thomas <10986371+vthomas13@users.noreply.github.com>
This commit is contained in:
David Walsh 2023-08-05 11:11:27 -05:00 committed by Dan J Miller
parent 723d8bb51e
commit 62f0e0955f
3 changed files with 11 additions and 3 deletions

View File

@ -10,7 +10,7 @@ exports[`ActivityListItem should match snapshot with no props 1`] = `
class="mm-box mm-box--display-flex mm-box--gap-4 mm-box--flex-direction-row mm-box--width-full" class="mm-box mm-box--display-flex mm-box--gap-4 mm-box--flex-direction-row mm-box--width-full"
> >
<div <div
class="mm-box mm-box--display-inline-flex mm-box--width-full" class="mm-box activity-list-item__content-container mm-box--display-inline-flex mm-box--width-full"
> >
<div <div
class="mm-box activity-list-item__detail-container mm-box--display-inline-flex mm-box--flex-direction-column mm-box--width-1/3 mm-box--sm:width-7/12" class="mm-box activity-list-item__detail-container mm-box--display-inline-flex mm-box--flex-direction-column mm-box--width-1/3 mm-box--sm:width-7/12"
@ -52,7 +52,7 @@ exports[`ActivityListItem should match snapshot with props 1`] = `
/> />
</div> </div>
<div <div
class="mm-box mm-box--display-inline-flex mm-box--width-full" class="mm-box activity-list-item__content-container mm-box--display-inline-flex mm-box--width-full"
> >
<div <div
class="mm-box activity-list-item__detail-container mm-box--display-inline-flex mm-box--flex-direction-column mm-box--width-1/3 mm-box--sm:width-7/12" class="mm-box activity-list-item__detail-container mm-box--display-inline-flex mm-box--flex-direction-column mm-box--width-1/3 mm-box--sm:width-7/12"

View File

@ -66,7 +66,11 @@ export const ActivityListItem = ({
gap={4} gap={4}
> >
{icon && <Box display={Display.InlineFlex}>{icon}</Box>} {icon && <Box display={Display.InlineFlex}>{icon}</Box>}
<Box display={Display.InlineFlex} width={BlockSize.Full}> <Box
display={Display.InlineFlex}
width={BlockSize.Full}
className="activity-list-item__content-container"
>
<Box <Box
display={Display.InlineFlex} display={Display.InlineFlex}
width={[BlockSize.OneThird, BlockSize.SevenTwelfths]} width={[BlockSize.OneThird, BlockSize.SevenTwelfths]}

View File

@ -1,6 +1,10 @@
.activity-list-item { .activity-list-item {
cursor: pointer; cursor: pointer;
&__content-container {
overflow: hidden;
}
&__primary-currency { &__primary-currency {
max-width: 130px; max-width: 130px;