diff --git a/web/pages/challenges/[username]/[contractSlug]/[challengeSlug].tsx b/web/pages/challenges/[username]/[contractSlug]/[challengeSlug].tsx index 7d633b18..1f1ff760 100644 --- a/web/pages/challenges/[username]/[contractSlug]/[challengeSlug].tsx +++ b/web/pages/challenges/[username]/[contractSlug]/[challengeSlug].tsx @@ -125,10 +125,59 @@ export default function ChallengePage(props: { bets={bets} /> )} + + ) } +function FAQ() { + const [toggleWhatIsThis, setToggleWhatIsThis] = useState(false) + const [toggleWhatIsMana, setToggleWhatIsMana] = useState(false) + return ( + + FAQ + + setToggleWhatIsThis(!toggleWhatIsThis)} + > + {toggleWhatIsThis ? '-' : '+'} + What is this? + + + {toggleWhatIsThis && ( + + + This is a challenge bet, or a bet offered from one person to another + that is only realized if both parties agree. You can agree to the + challenge (if it's open) or create your own from a market page. See + more markets{' '} + + here. + + + + )} + + setToggleWhatIsMana(!toggleWhatIsMana)} + > + {toggleWhatIsMana ? '-' : '+'} + What is M$? + + + {toggleWhatIsMana && ( + + Mana (M$) is the play-money used by our platform to keep track of your + bets. It's completely free for you and your friends to get started! + + )} + + ) +} + function ClosedChallengeContent(props: { contract: BinaryContract challenge: Challenge @@ -244,8 +293,8 @@ function OpenChallengeContent(props: { return ( - - + <Col className="h-full items-center justify-center rounded bg-white p-4 py-8 sm:p-8 sm:shadow-md"> + <Title className="!mt-0 !mb-2 sm:!mb-6" text={`⚔️ ${title} ⚔️`} /> <Row className="my-4 justify-center px-8 pb-4 text-lg sm:text-xl"> <SiteLink href={href}>{question}</SiteLink> @@ -262,7 +311,7 @@ function OpenChallengeContent(props: { amount={creatorAmount} /> - <Col className="items-center justify-center py-8 text-2xl sm:text-4xl"> + <Col className="items-center justify-center py-4 text-2xl sm:py-8 sm:text-4xl"> VS </Col> @@ -274,7 +323,7 @@ function OpenChallengeContent(props: { </Col> <Spacer h={3} /> - <Row className={'my-4 text-gray-500'}> + <Row className={'my-4 text-center text-gray-500'}> <span> {`${creator.name} will bet ${formatMoney( creatorAmount