-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
20 changed files
with
721 additions
and
32 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,71 @@ | ||
import * as React from "react" | ||
import { SVGProps } from "react" | ||
const SvgComponent = (props: SVGProps<SVGSVGElement>) => ( | ||
<svg | ||
width={74} | ||
height={54} | ||
viewBox="0 0 74 54" | ||
fill="none" | ||
xmlns="http://www.w3.org/2000/svg" | ||
{...props} | ||
> | ||
<g filter="url(#filter0_d_4753_12611)"> | ||
<path | ||
d="M11 10.799C13.9285 17.6322 16.3083 25.1532 20.331 31.4107C20.491 31.6596 20.7597 32.1482 21.0892 31.7821C21.5382 31.2832 21.7581 30.4328 21.9867 29.8478C23.0426 27.1459 24.2598 24.5432 25.6077 21.9714C28.6901 16.09 31.9328 10.1153 35.9754 4.82596C36.376 4.30186 36.8667 3.29712 37.4609 3" | ||
stroke="#FDFDFD" | ||
strokeWidth={5.91946} | ||
strokeLinecap="round" | ||
/> | ||
<path | ||
d="M34.3968 31.9677C35.1928 32.0672 33.1822 33.3604 32.6018 33.3604C31.6038 33.3604 33.0688 31.5382 33.3136 31.3642C34.1504 30.7697 35.1158 30.737 35.7895 31.4107" | ||
stroke="#FDFDFD" | ||
strokeWidth={5.91946} | ||
strokeLinecap="round" | ||
/> | ||
<path | ||
d="M62.3466 3.2466C60.3503 3.2466 57.2621 3.23218 55.3961 3.98651C53.9193 4.58349 52.2736 5.96589 51.3599 7.17706C49.5304 9.60228 49.0271 8.88689 48.49 11.8791C48.0519 14.3203 49.8698 17.7166 51.7623 17.9935C54.8256 18.4418 58.6526 17.9709 61.0004 20.423C68.428 28.1808 46.3933 33.4706 42.5706 34.9997" | ||
stroke="#FDFDFD" | ||
strokeWidth={5.91946} | ||
strokeLinecap="round" | ||
/> | ||
</g> | ||
<defs> | ||
<filter | ||
id="filter0_d_4753_12611" | ||
x={0.146933} | ||
y={0.0395508} | ||
width={73.2244} | ||
height={53.7059} | ||
filterUnits="userSpaceOnUse" | ||
colorInterpolationFilters="sRGB" | ||
> | ||
<feFlood floodOpacity={0} result="BackgroundImageFix" /> | ||
<feColorMatrix | ||
in="SourceAlpha" | ||
type="matrix" | ||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" | ||
result="hardAlpha" | ||
/> | ||
<feOffset dy={7.89262} /> | ||
<feGaussianBlur stdDeviation={3.94631} /> | ||
<feComposite in2="hardAlpha" operator="out" /> | ||
<feColorMatrix | ||
type="matrix" | ||
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0" | ||
/> | ||
<feBlend | ||
mode="normal" | ||
in2="BackgroundImageFix" | ||
result="effect1_dropShadow_4753_12611" | ||
/> | ||
<feBlend | ||
mode="normal" | ||
in="SourceGraphic" | ||
in2="effect1_dropShadow_4753_12611" | ||
result="shape" | ||
/> | ||
</filter> | ||
</defs> | ||
</svg> | ||
) | ||
export default SvgComponent |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
import { useRef } from 'react'; | ||
import { PlayGameContainer } from "../LandingPageHeroSection/types"; | ||
import { Dice } from "../Dice"; | ||
import { useRoll, useAutoRoll } from "../Dice/animations"; | ||
import { LeftPlayerCard, RightPlayerCard } from "../LandingHeroPlayerCard"; | ||
import Button from "../Button"; | ||
import { SectionHeader } from '../../common/Section/types'; | ||
import 'twin.macro'; | ||
|
||
const LandingPageHero = () => { | ||
const diceRef = useRef<any>(null); | ||
const triggerDice = useRoll(diceRef); | ||
useAutoRoll(diceRef); | ||
|
||
return ( <> | ||
<PlayGameContainer tw="flex flex-col gap-[20.66px]"> | ||
<div tw="flex gap-x-[20.657px] items-center justify-center"> | ||
<LeftPlayerCard /> | ||
<Dice diceRef={diceRef} /> | ||
<RightPlayerCard /> | ||
</div> | ||
<Button buttonType="primary" tw="py-[9.92px] px-[19.83px] min-w-[162px] min-h-[35px]" onClick={() => triggerDice()}> | ||
Roll | ||
</Button> | ||
</PlayGameContainer> | ||
<SectionHeader tw="w-full text-center pt-[32px]">Play multiple P2P betting games with your NFTs.</SectionHeader> </> ) | ||
} | ||
export default LandingPageHero; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
import { useRef } from 'react'; | ||
import { Dice } from "../Dice"; | ||
import { useAutoRoll } from "../Dice/animations"; | ||
import { LeftPlayerCardMobile, RightPlayerCardMobile} from "../LandingHeroPlayerCard"; | ||
import Button from "../Button"; | ||
|
||
import { VersusIcon } from '../../assets/icons'; | ||
import 'twin.macro'; | ||
|
||
const LandingPageHeroMobile = () => { | ||
const diceRef = useRef<any>(null); | ||
useAutoRoll(diceRef); | ||
|
||
return ( | ||
<div tw="relative flex flex-col items-center mt-[85px]" > | ||
<VersusIcon tw="relative top-0 mt-[-3rem] mx-auto mb-[-1.5rem] z-[20]" /> | ||
<div tw="relative flex gap-x-[8.5px] self-center"> | ||
<LeftPlayerCardMobile /> | ||
<RightPlayerCardMobile /> | ||
</div> | ||
<Dice tw="rounded-[15px] w-[115px] h-[115px] p-[14px] border-[2.5px] mt-[-0.75rem]" diceRef={diceRef} /> | ||
<Button | ||
buttonType="primary" tw="shadow-primary-button py-[9.92px] px-[19.83px] min-w-[162px] min-h-[35px] mt-[5rem]" > | ||
Coming soon | ||
</Button> | ||
</div> | ||
) | ||
} | ||
export default LandingPageHeroMobile; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,27 @@ | ||
import Section from "../../common/Section" | ||
import { SectionHeaderContainer, SectionHeaderTitleLarge, SectionHeader } from "../../common/Section/types" | ||
import { FloatingOrbs } from '../../common/FloatingOrbs'; | ||
import 'twin.macro'; | ||
import LandingPageHeroMobile from "../LandingPageHeroMobile"; | ||
|
||
const LandingPageHeroSectionMobile = () => { | ||
return ( | ||
<> | ||
<FloatingOrbs tw="translate-y-[-32%] flex justify-center items-center" /> | ||
<Section | ||
direction='col' | ||
tw="relative w-full" | ||
hdr={ | ||
<SectionHeaderContainer tw="flex-col items-center gap-y-[32px] mb-[unset]"> | ||
<SectionHeaderTitleLarge tw="text-start font-primary leading-[68px] pb-[unset]"> | ||
{"Your NFTs’ Playground"}<span tw="text-oranjo">.</span> | ||
</SectionHeaderTitleLarge> | ||
<SectionHeader tw="w-full break-words text-start text-[#D9D9D9]">Play multiple P2P betting games with your NFTs.</SectionHeader> | ||
</SectionHeaderContainer> | ||
}> | ||
<LandingPageHeroMobile /> | ||
</Section> | ||
</> | ||
) | ||
} | ||
export default LandingPageHeroSectionMobile; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,60 @@ | ||
import { | ||
NFTProps, | ||
CardWrapper, | ||
RequestProps | ||
} from './types'; | ||
import { SVGComponent } from '../svg'; | ||
import { Link } from 'react-router-dom'; | ||
import { TransactionState } from '../../listing' | ||
|
||
export type NFTCardProps = { | ||
listButton?: boolean; | ||
tradeButton?: boolean; | ||
offersButton?: boolean; | ||
listed?: boolean; | ||
isOfferMaker?: boolean; | ||
nft: NFTProps, | ||
request?: RequestProps; | ||
} | ||
|
||
const NFTCard: React.FC<NFTCardProps> = ({ | ||
offersButton, | ||
isOfferMaker, | ||
listButton, | ||
request, | ||
listed, | ||
tradeButton, | ||
nft, | ||
}) => { | ||
return ( | ||
<CardWrapper> | ||
<header> | ||
<SVGComponent svgString={nft.svgString as string}/> | ||
{ /* add banner that shows if an nft is listed or unlisted */} | ||
</header> | ||
<div> | ||
<h5>{nft.nftName}</h5> | ||
<h6>price: {nft.ethPrice} ETH</h6> | ||
</div> | ||
{ | ||
listButton && !listed && | ||
<footer> | ||
<Link to={`/list`}> | ||
<button type="button"> | ||
List | ||
</button> | ||
</Link> | ||
</footer> | ||
} | ||
{ | ||
tradeButton && request && request.state === TransactionState.OPEN && | ||
<Link to="/trade"> | ||
<button type="button"> | ||
Make an offer | ||
</button> | ||
</Link> | ||
} | ||
</CardWrapper> | ||
) | ||
} | ||
export default NFTCard; |
Oops, something went wrong.