diff --git a/src/nft/components/profile/list/ListPage.tsx b/src/nft/components/profile/list/ListPage.tsx index 383de145a7..0b82a41043 100644 --- a/src/nft/components/profile/list/ListPage.tsx +++ b/src/nft/components/profile/list/ListPage.tsx @@ -34,7 +34,7 @@ const ListingHeader = styled(Row)` margin-top: 18px; @media screen and (min-width: ${SMALL_MEDIA_BREAKPOINT}) { - margin-top: 40px; + margin-top: 16px; } ` diff --git a/src/nft/components/profile/list/NFTListingsGrid.tsx b/src/nft/components/profile/list/NFTListingsGrid.tsx index 351de04617..a70a972c94 100644 --- a/src/nft/components/profile/list/NFTListingsGrid.tsx +++ b/src/nft/components/profile/list/NFTListingsGrid.tsx @@ -10,9 +10,21 @@ import { LOOKS_RARE_CREATOR_BASIS_POINTS } from 'nft/utils' import { formatEth, formatUsdPrice } from 'nft/utils/currency' import { fetchPrice } from 'nft/utils/fetchPrice' import { Dispatch, FormEvent, useEffect, useMemo, useRef, useState } from 'react' +import styled from 'styled-components/macro' import * as styles from './ListPage.css' +const TableHeader = styled.div` + display: flex; + position: sticky; + align-items: center; + top: 72px; + padding-top: 24px; + padding-bottom: 24px; + z-index: 1; + background-color: ${({ theme }) => theme.backgroundBackdrop}; +` + enum SetPriceMethod { SAME_PRICE, FLOOR_PRICE, @@ -44,7 +56,7 @@ export const NFTListingsGrid = ({ selectedMarkets }: { selectedMarkets: ListingM return ( - + 1 ? '36' : '0'} transition="500" @@ -86,7 +98,7 @@ export const NFTListingsGrid = ({ selectedMarkets }: { selectedMarkets: ListingM You receive - + {sellAssets.map((asset) => { return ( <>