open.source/manifold
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Use media query instead of conditional render

Browse Source
This commit is contained in:
Sinclair Chen 2022-10-02 09:22:43 -07:00
parent cae35bc05e
commit 8484fcd54e
1 changed files with 10 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
web/pages/embed/[username]/[contractSlug].tsx
View File

@ -79,12 +79,16 @@ export function ContractEmbed(props: EmbedProps) {
creatorId: contract.creatorId, creatorId: contract.creatorId,
}) })
const { height = 0 } = useWindowSize() // return (height < 250px) ? Card : SmolView
return (
return height < 250 ? ( <>
<ContractCard contract={contract} className="h-screen" /> <div className="contents [@media(min-height:250px)]:hidden">
) : ( <ContractCard contract={contract} className="h-screen" />
<ContractSmolView {...props} /> </div>
<div className="hidden [@media(min-height:250px)]:contents">
<ContractSmolView {...props} />
</div>
</>
) )
} }