Challenge card styling

This commit is contained in:
Ian Philips 2022-08-01 11:16:26 -06:00
parent f3411dfee1
commit 3634168a48
2 changed files with 22 additions and 18 deletions

View File

@ -94,7 +94,7 @@ export function getHtml(parsedReq: ParsedRequest) {
challengeAmount,
challengeOutcome,
} = parsedReq
const MAX_QUESTION_CHARS = 100
const MAX_QUESTION_CHARS = challengeAmount ? 85 : 100
const truncatedQuestion =
question.length > MAX_QUESTION_CHARS
? question.slice(0, MAX_QUESTION_CHARS) + '...'
@ -147,11 +147,11 @@ export function getHtml(parsedReq: ParsedRequest) {
</div>
<div class="flex flex-row justify-between gap-12 pt-36">
<div class="text-indigo-700 text-6xl leading-tight">
<span class="text-gray-900">
${challengeAmount ? 'Bet against me on:' : ''}
</span>
${truncatedQuestion}
<div class="flex flex-col text-gray-900 text-6xl">
${challengeAmount ? '⚔️️' + ' Bet against me ' + '⚔️️' : ''}
<div class="text-indigo-700 leading-tight">
${truncatedQuestion}
</div>
</div>
<div class="flex flex-col text-primary">
<div class="text-8xl">${

View File

@ -137,18 +137,22 @@ export default function ChallengePage(props: {
}
const userRow = (challenger: User) => (
<Row className={'mb-2 w-full items-center justify-center gap-2'}>
<Avatar
size={12}
avatarUrl={challenger.avatarUrl}
username={challenger.username}
/>
<UserLink
className={'text-2xl'}
name={challenger.name}
username={challenger.username}
/>
</Row>
<div className="flex flex-col text-gray-900">
${'⚔️️' + ' Bet against me ' + '⚔️️'}
<div>{'Will there be a new doctrowho sad'}</div>
</div>
// <Row className={'mb-2 w-full items-center justify-center gap-2'}>
// <Avatar
// size={12}
// avatarUrl={challenger.avatarUrl}
// username={challenger.username}
// />
// <UserLink
// className={'text-2xl'}
// name={challenger.name}
// username={challenger.username}
// />
// </Row>
)
function ClosedChallengeContent(props: {