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

View File

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