Use gray-500 instead of gray-400 for text against gray bg.

This commit is contained in:
jahooma 2022-01-08 23:10:08 -06:00
parent e4206d6277
commit 519dda6473
3 changed files with 10 additions and 11 deletions

View File

@ -17,7 +17,7 @@ export function AdvancedPanel(props: { children: any }) {
onClick={() => setCollapsed((collapsed) => !collapsed)} onClick={() => setCollapsed((collapsed) => !collapsed)}
className="cursor-pointer" className="cursor-pointer"
> >
<div className="mt-4 mr-6 text-sm text-gray-400 text-right"> <div className="mt-4 mr-6 text-sm text-gray-500 text-right">
Advanced Advanced
</div> </div>
<div <div
@ -25,7 +25,7 @@ export function AdvancedPanel(props: { children: any }) {
style={{ style={{
top: -2, top: -2,
right: -15, right: -15,
color: '#9ca3af' /* gray-400 */, color: '#6a7280' /* gray-500 */,
}} }}
/> />
</div> </div>

View File

@ -1,4 +1,3 @@
import { getFunctions, httpsCallable } from 'firebase/functions'
import clsx from 'clsx' import clsx from 'clsx'
import React, { useEffect, useState } from 'react' import React, { useEffect, useState } from 'react'
@ -115,14 +114,14 @@ export function BetPanel(props: { contract: Contract; className?: string }) {
> >
<Title className="!mt-0 whitespace-nowrap" text={`Buy ${betChoice}`} /> <Title className="!mt-0 whitespace-nowrap" text={`Buy ${betChoice}`} />
<div className="mt-2 mb-1 text-sm text-gray-400">Outcome</div> <div className="mt-2 mb-1 text-sm text-gray-500">Outcome</div>
<YesNoSelector <YesNoSelector
className="my-2" className="my-2"
selected={betChoice} selected={betChoice}
onSelect={(choice) => onBetChoice(choice)} onSelect={(choice) => onBetChoice(choice)}
/> />
<div className="mt-3 mb-1 text-sm text-gray-400"> <div className="mt-3 mb-1 text-sm text-gray-500">
Amount{' '} Amount{' '}
{user && ( {user && (
<span className="float-right"> <span className="float-right">
@ -156,14 +155,14 @@ export function BetPanel(props: { contract: Contract; className?: string }) {
{user && <AddFundsButton className="self-end mt-3" />} {user && <AddFundsButton className="self-end mt-3" />}
</Col> </Col>
<div className="mt-2 mb-1 text-sm text-gray-400">Implied probability</div> <div className="mt-2 mb-1 text-sm text-gray-500">Implied probability</div>
<Row> <Row>
<div>{formatPercent(initialProb)}</div> <div>{formatPercent(initialProb)}</div>
<div className="mx-2"></div> <div className="mx-2"></div>
<div>{formatPercent(resultProb)}</div> <div>{formatPercent(resultProb)}</div>
</Row> </Row>
<div className="mt-2 mb-1 text-sm text-gray-400"> <div className="mt-2 mb-1 text-sm text-gray-500">
Estimated max payout Estimated max payout
</div> </div>
<div> <div>
@ -172,7 +171,7 @@ export function BetPanel(props: { contract: Contract; className?: string }) {
</div> </div>
<AdvancedPanel> <AdvancedPanel>
<div className="mt-2 mb-1 text-sm text-gray-400"> <div className="mt-2 mb-1 text-sm text-gray-500">
<OutcomeLabel outcome={betChoice} /> shares <OutcomeLabel outcome={betChoice} /> shares
</div> </div>
<div> <div>
@ -180,7 +179,7 @@ export function BetPanel(props: { contract: Contract; className?: string }) {
{formatWithCommas(shares + contract.totalShares[betChoice])} {formatWithCommas(shares + contract.totalShares[betChoice])}
</div> </div>
<div className="mt-2 mb-1 text-sm text-gray-400"> <div className="mt-2 mb-1 text-sm text-gray-500">
Current payout if <OutcomeLabel outcome={betChoice} /> Current payout if <OutcomeLabel outcome={betChoice} />
</div> </div>
<div> <div>

View File

@ -183,7 +183,7 @@ export default function NewContract() {
/> />
</label> </label>
<label> <label>
<span className="label-text text-gray-400 ml-1"> <span className="label-text text-gray-500 ml-1">
Remaining balance:{' '} Remaining balance:{' '}
{formatMoney(remainingBalance > 0 ? remainingBalance : 0)} {formatMoney(remainingBalance > 0 ? remainingBalance : 0)}
</span> </span>
@ -207,7 +207,7 @@ export default function NewContract() {
/> />
</div> </div>
<label> <label>
<span className="label-text text-gray-400 ml-1"> <span className="label-text text-gray-500 ml-1">
No new trades will be allowed after{' '} No new trades will be allowed after{' '}
{closeDate ? formattedCloseTime : 'this time'} {closeDate ? formattedCloseTime : 'this time'}
</span> </span>