Commit ff6f43d7 authored by Jordan Frankfurt's avatar Jordan Frankfurt Committed by GitHub

fix(bag-footer): remove double border top and excess margin (#5171)

parent f1443671
...@@ -279,63 +279,62 @@ const Bag = () => { ...@@ -279,63 +279,62 @@ const Bag = () => {
[itemsInBag, totalUsdPrice] [itemsInBag, totalUsdPrice]
) )
if (!bagExpanded || !isNFTPage) {
return null
}
return ( return (
<> <Portal>
{bagExpanded && isNFTPage ? ( <Column zIndex={isMobile || isOpen ? 'modal' : '3'} className={styles.bagContainer}>
<Portal> {!(isProfilePage && profilePageState === ProfilePageStateType.LISTING) ? (
<Column zIndex={isMobile || isOpen ? 'modal' : '3'} className={styles.bagContainer}> <>
{!(isProfilePage && profilePageState === ProfilePageStateType.LISTING) ? ( <BagHeader
<> numberOfAssets={isProfilePage ? sellAssets.length : itemsInBag.length}
<BagHeader closeBag={handleCloseBag}
numberOfAssets={isProfilePage ? sellAssets.length : itemsInBag.length} resetFlow={isProfilePage ? resetSellAssets : reset}
closeBag={handleCloseBag} isProfilePage={isProfilePage}
resetFlow={isProfilePage ? resetSellAssets : reset} />
isProfilePage={isProfilePage} {shouldRenderEmptyState && <EmptyState />}
/> <ScrollingIndicator top show={userCanScroll && scrollProgress > 0} />
{shouldRenderEmptyState && <EmptyState />} <Column ref={scrollRef} className={styles.assetsContainer} onScroll={scrollHandler} gap="12">
<ScrollingIndicator top show={userCanScroll && scrollProgress > 0} /> {isProfilePage ? <ProfileBagContent /> : <BagContent />}
<Column ref={scrollRef} className={styles.assetsContainer} onScroll={scrollHandler} gap="12"> </Column>
{isProfilePage ? <ProfileBagContent /> : <BagContent />} {hasAssetsToShow && !isProfilePage && (
</Column> <BagFooter
<ScrollingIndicator show={userCanScroll && scrollProgress < 100} /> totalEthPrice={totalEthPrice}
{hasAssetsToShow && !isProfilePage && ( totalUsdPrice={totalUsdPrice}
<BagFooter bagStatus={bagStatus}
totalEthPrice={totalEthPrice} fetchAssets={fetchAssets}
totalUsdPrice={totalUsdPrice} eventProperties={eventProperties}
bagStatus={bagStatus} />
fetchAssets={fetchAssets} )}
eventProperties={eventProperties} {isSellingAssets && isProfilePage && (
/> <Box
)} marginTop="32"
{isSellingAssets && isProfilePage && ( marginX="28"
<Box paddingY="10"
marginTop="32" className={`${buttonTextMedium} ${commonButtonStyles}`}
marginX="28" backgroundColor="accentAction"
paddingY="10" textAlign="center"
className={`${buttonTextMedium} ${commonButtonStyles}`} onClick={() => {
backgroundColor="accentAction" isMobile && toggleBag()
textAlign="center" setProfilePageState(ProfilePageStateType.LISTING)
onClick={() => { }}
isMobile && toggleBag() >
setProfilePageState(ProfilePageStateType.LISTING) Continue
}} </Box>
>
Continue
</Box>
)}
</>
) : (
<ListingModal />
)} )}
</Column> </>
{isDetailsPage ? ( ) : (
<DetailsPageBackground onClick={toggleBag} /> <ListingModal />
) : ( )}
isOpen && <Overlay onClick={() => (!bagIsLocked ? setModalIsOpen(false) : undefined)} /> </Column>
)} {isDetailsPage ? (
</Portal> <DetailsPageBackground onClick={toggleBag} />
) : null} ) : (
</> isOpen && <Overlay onClick={() => (!bagIsLocked ? setModalIsOpen(false) : undefined)} />
)}
</Portal>
) )
} }
......
...@@ -3,7 +3,6 @@ import { body } from 'nft/css/common.css' ...@@ -3,7 +3,6 @@ import { body } from 'nft/css/common.css'
import { sprinkles } from 'nft/css/sprinkles.css' import { sprinkles } from 'nft/css/sprinkles.css'
export const footerContainer = sprinkles({ export const footerContainer = sprinkles({
marginTop: '20',
paddingX: '16', paddingX: '16',
}) })
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment