1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 01:39:44 +01:00

UX Multichain: updated border top for activity list (#19176)

* updated border top for activity list

* updated border css via prop

* fixed symbol

* fixed lint errors

* fix conditions

* updated snapshot
This commit is contained in:
Nidhi Kumari 2023-05-23 22:54:17 +05:30 committed by Dan J Miller
parent d746b58c90
commit d2dba07eeb
5 changed files with 14 additions and 4 deletions

View File

@ -3,7 +3,7 @@
exports[`Token Cell should match snapshot 1`] = `
<div>
<div
class="list-item asset-list-item token-cell list-item--single-content-row"
class="list-item asset-list-item token-cell list-item--single-content-row list-item-border"
role="button"
tabindex="0"
>

View File

@ -168,6 +168,7 @@ function TransactionListItemInner({
]);
const showCancelButton = !hasCancelled && isPending && !isUnapproved;
const showBorder = process.env.MULTICHAIN;
return (
<>
@ -178,6 +179,7 @@ function TransactionListItemInner({
icon={
<TransactionIcon category={category} status={displayedStatusKey} />
}
showBorder={showBorder}
subtitle={
<h3>
<TransactionStatusLabel

View File

@ -3,7 +3,7 @@
exports[`ListItem should match snapshot with no props 1`] = `
<div>
<div
class="list-item list-item--single-content-row"
class="list-item list-item--single-content-row list-item-border"
role="button"
tabindex="0"
>
@ -21,7 +21,7 @@ exports[`ListItem should match snapshot with no props 1`] = `
exports[`ListItem should match snapshot with props 1`] = `
<div>
<div
class="list-item list-item-test"
class="list-item list-item-test list-item-border"
data-testid="test-id"
role="button"
tabindex="0"

View File

@ -7,7 +7,6 @@
@include Paragraph;
border-top: 1px solid var(--color-border-muted);
border-bottom: 1px solid var(--color-border-muted);
color: var(--color-text-default);
display: grid;
@ -119,3 +118,7 @@
grid-template-areas: 'icon head head head head mid mid mid mid right right right';
}
}
.list-item-border {
border-top: 1px solid var(--color-border-muted);
}

View File

@ -12,12 +12,16 @@ export default function ListItem({
rightContent,
midContent,
className,
showBorder,
'data-testid': dataTestId,
}) {
const primaryClassName = classnames(
'list-item',
className,
subtitle || children ? '' : 'list-item--single-content-row',
{
'list-item-border': !showBorder,
},
);
return (
@ -68,5 +72,6 @@ ListItem.propTypes = {
midContent: PropTypes.node,
className: PropTypes.string,
onClick: PropTypes.func,
showBorder: PropTypes.bool,
'data-testid': PropTypes.string,
};