Function displaySingleQuestion

trivia/code.ts:160–199

(triviaResult: TriviaResult)

}

function displaySingleQuestion(triviaResult: TriviaResult) {
  const frame = figma.createFrame()
  frame.fills = [{type: 'SOLID', color: {r: 1, g: 1, b: 1}}]
  frame.verticalPadding = 25
  frame.horizontalPadding = 25
  frame.primaryAxisSizingMode = 'AUTO'
  frame.counterAxisSizingMode = 'AUTO'
  frame.itemSpacing = 10
  frame.cornerRadius = 20

  const questionText = createText(triviaResult.question, 20)
  frame.appendChild(questionText)

  const optionsFrame = figma.createFrame()
  optionsFrame.itemSpacing = 10
  optionsFrame.layoutMode = "VERTICAL"
  optionsFrame.counterAxisSizingMode = "AUTO"

  const options = reorderOptions(triviaResult.correctAnswer, triviaResult.incorrectAnswers)
  for (const option of options) {
    const optionText = createText(option, 24)
    optionsFrame.appendChild(optionText)
  }
  frame.appendChild(optionsFrame)
  
  const correctAnswerFrame = figma.createFrame()
  const correctAnswer = createText(triviaResult.correctAnswer, 24)
  correctAnswerFrame.appendChild(correctAnswer)

  correctAnswerFrame.fills = [{type: 'SOLID', color: {r: .46, g: .86, b: .46} }]
  correctAnswerFrame.resize(correctAnswer.width, correctAnswer.height)

  const answerCover = figma.createFrame()
  answerCover.resize(correctAnswer.width, correctAnswer.height)
  answerCover.fills = [{type: 'SOLID', color: {r: 0, g: 0, b: 0}}]
  correctAnswerFrame.appendChild(answerCover)
  frame.appendChild(correctAnswerFrame)
  frame.layoutMode = "VERTICAL"
  return frame 
}

function reorderOptions(correctAnswer: string, incorrectAnswers: string[]) {
  const options = [...incorrectAnswers, correctAnswer]