Fix spacing on challenge modal

This commit is contained in:
Ian Philips 2022-09-06 07:58:00 -06:00
parent a3b18e5bea
commit 39d7f1055b

View File

@ -147,7 +147,7 @@ function CreateChallengeForm(props: {
setFinishedCreating(true)
}}
>
<Title className="!mt-2" text="Challenge bet " />
<Title className="!mt-2 hidden sm:block" text="Challenge bet " />
<div className="mb-8">
Challenge a friend to bet on{' '}
@ -170,7 +170,8 @@ function CreateChallengeForm(props: {
)}
</div>
<div className="mt-2 flex flex-col flex-wrap justify-center gap-x-5 gap-y-2">
<Col className="mt-2 flex-wrap justify-center gap-x-5 sm:gap-y-2">
<Col>
<div>You'll bet:</div>
<Row
className={
@ -213,7 +214,9 @@ function CreateChallengeForm(props: {
</Button>
</Row>
<Row className={'items-center'}>If they bet:</Row>
<Row className={'max-w-xs items-center justify-between gap-4 pr-3'}>
<Row
className={'max-w-xs items-center justify-between gap-4 pr-3'}
>
<div className={'w-32 sm:mr-1'}>
<AmountInput
amount={challengeInfo.acceptorAmount || undefined}
@ -235,7 +238,8 @@ function CreateChallengeForm(props: {
<span>on</span>
{challengeInfo.outcome === 'YES' ? <NoLabel /> : <YesLabel />}
</Row>
</div>
</Col>
</Col>
{contract && (
<Button
size="2xs"