open.source/manifold
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Challenge card styling

Browse Source
This commit is contained in:
Ian Philips 2022-08-01 10:54:11 -06:00
parent 086672dd4e
commit 216020d9f0
2 changed files with 14 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
og-image/api/_lib/template.ts
View File

@ -100,6 +100,7 @@ export function getHtml(parsedReq: ParsedRequest) {
? question.slice(0, MAX_QUESTION_CHARS) + '...' ? question.slice(0, MAX_QUESTION_CHARS) + '...'
: question : question
const hideAvatar = creatorAvatarUrl ? '' : 'hidden' const hideAvatar = creatorAvatarUrl ? '' : 'hidden'
const hideNonChallengeElements = challengeAmount !== '' ? 'hidden' : ''
return `<!DOCTYPE html> return `<!DOCTYPE html>
<html> <html>
<head> <head>
@ -146,24 +147,29 @@ 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-gray-900 text-6xl leading-tight">
${challengeAmount ? 'CHALLENGE BET:' : ''}
</div>
<div class="text-indigo-700 text-6xl leading-tight"> <div class="text-indigo-700 text-6xl leading-tight">
${truncatedQuestion} ${truncatedQuestion}
</div> </div>
<div class="flex flex-col text-primary"> <div class="flex flex-col text-primary">
<div class="text-8xl">${ <div class="text-8xl">${
challengeAmount !== '' ? 'M$' + challengeAmount : probability challengeAmount ? 'M$' + challengeAmount : probability
}</div>
<div class="text-5xl">${
challengeOutcome !== '' ? 'on' + challengeOutcome : ''
}</div>
<div class="text-4xl">${
challengeAmount !== '' && probability !== '' ? 'chance' : ''
}</div> }</div>
<div class="flex flex-col items-center justify-center">
<div class="text-4xl">${challengeOutcome ? 'on' : ''}</div>
<div class="text-6xl ">${challengeOutcome ?? ''}</div>
</div>
<div class="text-4xl ${hideNonChallengeElements}">${
probability !== '' ? 'chance' : ''
}</div>
</div> </div>
</div> </div>
<!-- Metadata --> <!-- Metadata -->
<div class="absolute bottom-16"> <div class="absolute bottom-16 ${hideNonChallengeElements}">
<div class="text-gray-500 text-3xl"> <div class="text-gray-500 text-3xl">
${metadata} ${metadata}
</div> </div>

1
web/pages/challenges/[username]/[contractSlug]/[challengeSlug].tsx
View File

@ -103,7 +103,6 @@ export default function ChallengePage(props: {
ogCardProps.creatorUsername = challenge.creatorUsername ogCardProps.creatorUsername = challenge.creatorUsername
ogCardProps.creatorName = challenge.creatorName ogCardProps.creatorName = challenge.creatorName
ogCardProps.creatorAvatarUrl = challenge.creatorAvatarUrl ogCardProps.creatorAvatarUrl = challenge.creatorAvatarUrl
ogCardProps.question = 'CHALLENGED:' + contract.question
return ( return (
<Page> <Page>