Format Tailwind classes with Prettier

Not sure why Husky hooks aren't enforcing this 🤷
This commit is contained in:
Austin Chen 2022-03-03 01:09:32 -08:00
parent d9fb2c0557
commit ef77779cec
8 changed files with 29 additions and 29 deletions

View File

@ -94,11 +94,11 @@ export function AnswerBetPanel(props: {
return ( return (
<Col className={clsx('px-2 pb-2 pt-4 sm:pt-0', className)}> <Col className={clsx('px-2 pb-2 pt-4 sm:pt-0', className)}>
<Row className="self-stretch items-center justify-between"> <Row className="items-center justify-between self-stretch">
<div className="text-xl">Buy this answer</div> <div className="text-xl">Buy this answer</div>
<button className="btn-ghost btn-circle" onClick={closePanel}> <button className="btn-ghost btn-circle" onClick={closePanel}>
<XIcon className="w-8 h-8 text-gray-500 mx-auto" aria-hidden="true" /> <XIcon className="mx-auto h-8 w-8 text-gray-500" aria-hidden="true" />
</button> </button>
</Row> </Row>
<div className="my-3 text-left text-sm text-gray-500">Amount </div> <div className="my-3 text-left text-sm text-gray-500">Amount </div>
@ -112,8 +112,8 @@ export function AnswerBetPanel(props: {
inputRef={inputRef} inputRef={inputRef}
contractIdForLoan={contract.id} contractIdForLoan={contract.id}
/> />
<Col className="gap-3 mt-3 w-full"> <Col className="mt-3 w-full gap-3">
<Row className="justify-between items-center text-sm"> <Row className="items-center justify-between text-sm">
<div className="text-gray-500">Probability</div> <div className="text-gray-500">Probability</div>
<Row> <Row>
<div>{formatPercent(initialProb)}</div> <div>{formatPercent(initialProb)}</div>
@ -122,8 +122,8 @@ export function AnswerBetPanel(props: {
</Row> </Row>
</Row> </Row>
<Row className="justify-between items-start text-sm gap-2"> <Row className="items-start justify-between gap-2 text-sm">
<Row className="flex-nowrap whitespace-nowrap items-center gap-2 text-gray-500"> <Row className="flex-nowrap items-center gap-2 whitespace-nowrap text-gray-500">
<div>Payout if chosen</div> <div>Payout if chosen</div>
<InfoTooltip <InfoTooltip
text={`Current payout for ${formatWithCommas( text={`Current payout for ${formatWithCommas(
@ -133,7 +133,7 @@ export function AnswerBetPanel(props: {
)} shares`} )} shares`}
/> />
</Row> </Row>
<Row className="flex-wrap justify-end items-end gap-2"> <Row className="flex-wrap items-end justify-end gap-2">
<span className="whitespace-nowrap"> <span className="whitespace-nowrap">
{formatMoney(currentPayout)} {formatMoney(currentPayout)}
</span> </span>

View File

@ -71,9 +71,9 @@ export function AnswerResolvePanel(props: {
: 'btn-disabled' : 'btn-disabled'
return ( return (
<Col className="gap-4 p-4 bg-gray-50 rounded"> <Col className="gap-4 rounded bg-gray-50 p-4">
<div>Resolve your market</div> <div>Resolve your market</div>
<Col className="sm:flex-row sm:items-center gap-4"> <Col className="gap-4 sm:flex-row sm:items-center">
<ChooseCancelSelector <ChooseCancelSelector
className="sm:!flex-row sm:items-center" className="sm:!flex-row sm:items-center"
selected={resolveOption} selected={resolveOption}

View File

@ -95,9 +95,9 @@ export function AnswersPanel(props: { contract: Contract; answers: Answer[] }) {
))} ))}
{sortedAnswers.length === 0 ? ( {sortedAnswers.length === 0 ? (
<div className="text-gray-500 p-4">No answers yet...</div> <div className="p-4 text-gray-500">No answers yet...</div>
) : ( ) : (
<div className="text-gray-500 self-end p-4"> <div className="self-end p-4 text-gray-500">
None of the above:{' '} None of the above:{' '}
{formatPercent(getOutcomeProbability(contract.totalShares, '0'))} {formatPercent(getOutcomeProbability(contract.totalShares, '0'))}
</div> </div>

View File

@ -73,7 +73,7 @@ export function CreateAnswerPanel(props: { contract: Contract }) {
const currentReturnPercent = (currentReturn * 100).toFixed() + '%' const currentReturnPercent = (currentReturn * 100).toFixed() + '%'
return ( return (
<Col className="gap-4 p-4 bg-gray-50 rounded"> <Col className="gap-4 rounded bg-gray-50 p-4">
<Col className="flex-1 gap-2"> <Col className="flex-1 gap-2">
<div className="mb-1">Add your answer</div> <div className="mb-1">Add your answer</div>
<Textarea <Textarea
@ -87,14 +87,14 @@ export function CreateAnswerPanel(props: { contract: Contract }) {
<div /> <div />
<Col <Col
className={clsx( className={clsx(
'sm:flex-row sm:items-end gap-4', 'gap-4 sm:flex-row sm:items-end',
text ? 'justify-between' : 'self-end' text ? 'justify-between' : 'self-end'
)} )}
> >
{text && ( {text && (
<> <>
<Col className="gap-2 mt-1"> <Col className="mt-1 gap-2">
<div className="text-gray-500 text-sm">Buy amount</div> <div className="text-sm text-gray-500">Buy amount</div>
<AmountInput <AmountInput
amount={betAmount} amount={betAmount}
onChange={setBetAmount} onChange={setBetAmount}
@ -106,7 +106,7 @@ export function CreateAnswerPanel(props: { contract: Contract }) {
/> />
</Col> </Col>
<Col className="gap-3"> <Col className="gap-3">
<Row className="justify-between items-center text-sm"> <Row className="items-center justify-between text-sm">
<div className="text-gray-500">Probability</div> <div className="text-gray-500">Probability</div>
<Row> <Row>
<div>{formatPercent(0)}</div> <div>{formatPercent(0)}</div>
@ -115,8 +115,8 @@ export function CreateAnswerPanel(props: { contract: Contract }) {
</Row> </Row>
</Row> </Row>
<Row className="justify-between text-sm gap-2"> <Row className="justify-between gap-2 text-sm">
<Row className="flex-nowrap whitespace-nowrap items-center gap-2 text-gray-500"> <Row className="flex-nowrap items-center gap-2 whitespace-nowrap text-gray-500">
<div>Payout if chosen</div> <div>Payout if chosen</div>
<InfoTooltip <InfoTooltip
text={`Current payout for ${formatWithCommas( text={`Current payout for ${formatWithCommas(
@ -124,7 +124,7 @@ export function CreateAnswerPanel(props: { contract: Contract }) {
)} / ${formatWithCommas(shares)} shares`} )} / ${formatWithCommas(shares)} shares`}
/> />
</Row> </Row>
<Row className="flex-wrap justify-end items-end gap-2"> <Row className="flex-wrap items-end justify-end gap-2">
<span className="whitespace-nowrap"> <span className="whitespace-nowrap">
{formatMoney(currentPayout)} {formatMoney(currentPayout)}
</span> </span>

View File

@ -157,8 +157,8 @@ export function BetPanel(props: {
contractIdForLoan={contract.id} contractIdForLoan={contract.id}
/> />
<Col className="gap-3 mt-3 w-full"> <Col className="mt-3 w-full gap-3">
<Row className="justify-between items-center text-sm"> <Row className="items-center justify-between text-sm">
<div className="text-gray-500">Probability</div> <div className="text-gray-500">Probability</div>
<Row> <Row>
<div>{formatPercent(initialProb)}</div> <div>{formatPercent(initialProb)}</div>
@ -167,8 +167,8 @@ export function BetPanel(props: {
</Row> </Row>
</Row> </Row>
<Row className="justify-between items-start text-sm gap-2"> <Row className="items-start justify-between gap-2 text-sm">
<Row className="flex-nowrap whitespace-nowrap items-center gap-2 text-gray-500"> <Row className="flex-nowrap items-center gap-2 whitespace-nowrap text-gray-500">
<div> <div>
Payout if <OutcomeLabel outcome={betChoice ?? 'YES'} /> Payout if <OutcomeLabel outcome={betChoice ?? 'YES'} />
</div> </div>
@ -182,7 +182,7 @@ export function BetPanel(props: {
)} ${betChoice} shares`} )} ${betChoice} shares`}
/> />
</Row> </Row>
<Row className="flex-wrap justify-end items-end gap-2"> <Row className="flex-wrap items-end justify-end gap-2">
<span className="whitespace-nowrap"> <span className="whitespace-nowrap">
{formatMoney(currentPayout)} {formatMoney(currentPayout)}
</span> </span>

View File

@ -32,7 +32,7 @@ function FollowFoldButton(props: {
className={clsx( className={clsx(
'rounded-full border-2 px-4 py-1 shadow-md', 'rounded-full border-2 px-4 py-1 shadow-md',
'cursor-pointer', 'cursor-pointer',
followed ? 'bg-gray-300 border-gray-300' : 'bg-white' followed ? 'border-gray-300 bg-gray-300' : 'bg-white'
)} )}
onClick={onClick} onClick={onClick}
> >

View File

@ -19,10 +19,10 @@ export default function AddFundsPage() {
<SEO title="Add funds" description="Add funds" url="/add-funds" /> <SEO title="Add funds" description="Add funds" url="/add-funds" />
<Col className="items-center"> <Col className="items-center">
<Col className="bg-white rounded sm:shadow-md p-4 py-8 sm:p-8 h-full"> <Col className="h-full rounded bg-white p-4 py-8 sm:p-8 sm:shadow-md">
<Title className="!mt-0" text="Get Manifold Dollars" /> <Title className="!mt-0" text="Get Manifold Dollars" />
<img <img
className="mb-6 block self-center -scale-x-100" className="mb-6 block -scale-x-100 self-center"
src="/stylized-crane-black.png" src="/stylized-crane-black.png"
width={200} width={200}
height={200} height={200}

View File

@ -137,7 +137,7 @@ export function NewContract(props: { question: string; tag?: string }) {
<span className="mb-1">Answer type</span> <span className="mb-1">Answer type</span>
</label> </label>
<Row className="form-control gap-2"> <Row className="form-control gap-2">
<label className="cursor-pointer label gap-2"> <label className="label cursor-pointer gap-2">
<input <input
className="radio" className="radio"
type="radio" type="radio"
@ -149,7 +149,7 @@ export function NewContract(props: { question: string; tag?: string }) {
<span className="label-text">Yes / No</span> <span className="label-text">Yes / No</span>
</label> </label>
<label className="cursor-pointer label gap-2"> <label className="label cursor-pointer gap-2">
<input <input
className="radio" className="radio"
type="radio" type="radio"