Generated Image

import { sanitizeHtml } from './sanitizer' import { ParsedRequest } from './types' function getCss(theme: string, fontSize: string) { let background = 'white' let foreground = 'black' let radial = 'lightgray' if (theme === 'dark') { background = 'black' foreground = 'white' radial = 'dimgray' } // To use Readex Pro: `font-family: 'Readex Pro', sans-serif;` return ` @import url('https://fonts.googleapis.com/css2?family=Major+Mono+Display&family=Readex+Pro:wght@400;700&display=swap'); body { background: ${background}; background-image: radial-gradient(circle at 25px 25px, ${radial} 2%, transparent 0%), radial-gradient(circle at 75px 75px, ${radial} 2%, transparent 0%); background-size: 100px 100px; height: 100vh; font-family: "Readex Pro", sans-serif; } code { color: #D400FF; font-family: 'Vera'; white-space: pre-wrap; letter-spacing: -5px; } code:before, code:after { content: '\`'; } .logo-wrapper { display: flex; align-items: center; align-content: center; justify-content: center; justify-items: center; } .logo { margin: 0 75px; } .plus { color: #BBB; font-family: Times New Roman, Verdana; font-size: 100px; } .spacer { margin: 150px; } .emoji { height: 1em; width: 1em; margin: 0 .05em 0 .1em; vertical-align: -0.1em; } .heading { font-family: 'Major Mono Display', monospace; font-size: ${sanitizeHtml(fontSize)}; font-style: normal; color: ${foreground}; line-height: 1.8; } .font-major-mono { font-family: "Major Mono Display", monospace; } .text-primary { color: #11b981; } ` } export function getChallengeHtml(parsedReq: ParsedRequest) { const { theme, fontSize, question, creatorName, creatorAvatarUrl, challengerAmount, challengerOutcome, creatorAmount, creatorOutcome, acceptedName, acceptedAvatarUrl, } = parsedReq const MAX_QUESTION_CHARS = 78 const truncatedQuestion = question.length > MAX_QUESTION_CHARS ? question.slice(0, MAX_QUESTION_CHARS) + '...' : question const hideAvatar = creatorAvatarUrl ? '' : 'hidden' const hideAcceptedAvatar = acceptedAvatarUrl ? '' : 'hidden' const accepted = acceptedName !== '' return ` Generated Image

${truncatedQuestion}

${creatorName}

${'M$' + creatorAmount}

${'on'}

${creatorOutcome}

You

${acceptedName}

${'M$' + challengerAmount}

${'on'}

${challengerOutcome}

Manifold Markets

` }