fix: adding fixed header (#5712)

*  adding fixed header
This commit is contained in:
aballerr 2022-12-19 14:26:07 -05:00 committed by GitHub
parent 6282298d13
commit 804692b114
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 15 additions and 3 deletions

@ -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;
}
`

@ -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 (
<Column>
<Row marginTop="20">
<TableHeader>
<Column
marginLeft={selectedMarkets.length > 1 ? '36' : '0'}
transition="500"
@ -86,7 +98,7 @@ export const NFTListingsGrid = ({ selectedMarkets }: { selectedMarkets: ListingM
You receive
</Column>
</Row>
</Row>
</TableHeader>
{sellAssets.map((asset) => {
return (
<>